/* =========================================
   GLOBAL
========================================= */

/* BODY / MENU / NORMAL TEXT */

body {
    font-family: 'Poppins', sans-serif;
}


/* ALL HEADINGS */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Playfair Display', serif;
}


/* =========================================
   COLORS
========================================= */

:root {
    --primary-green: #4b8f4f;
    --dark-green: #34753c;
    --light-green: #5a9c5d;
}

/* =========================================
   TOP GREEN BAR
========================================= */
.top-bar {
    height: 55px;
    background: #4b8f4f;
    position: relative;
    z-index: 100;
}

.top-wave {
    position: absolute;
    left: 0;
    bottom: -1px;

    width: 100%;
    height: 22px;

    overflow: hidden;
    line-height: 0;
}

.top-wave svg {
    width: 100%;
    height: 100%;
    display: block;

    transform: skewX(-30deg);
    transform-origin: center;

    /* Smooth rendering */
    shape-rendering: geometricPrecision;
}

                                    /* =========================================
                                       TOP BAR CONTENT
                                    ========================================= */

.top-bar .container {
    height: 100%;
    position: relative;
    z-index: 5;
}


.top-email {
    color: #fff;
    padding-top:1px;
    font-size: 11px;

    display: inline-flex;
    align-items: center;

    gap: 6px;

    line-height: 32px;

    transition: 0.3s ease;
}


.top-email:hover {
    color: #e5f5e5;
}


/* Social Icons */

.top-social {
    height: 32px;
    padding-top: 1px;
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 14px;
}


.top-social a {
    color: #fff;

    font-size: 11px;

    transition: all 0.3s ease;
}


.top-social a:hover {
    color: #d9f0dc;
    transform: translateY(-2px);
}

/* =========================================================
   HEADER
========================================================= */

.main-header {
    position: relative;
    z-index: 1000;
    width: 100%;
    background: #fff;
}

.main-header .navbar {
    min-height: 65px;
    padding: 5px 0;
}


/* =========================================================
   LOGO
========================================================= */

.main-header .navbar-brand {
    padding: 0;
    margin: 0;
}

.main-logo {
    display: block;
    width: 130px;
    height: auto;
}


/* =========================================================
   NAVIGATION
========================================================= */

.main-header .navbar-nav {
    align-items: center;
    gap: 2px;
}

.main-header .nav-link {
    position: relative;

    padding: 22px 13px !important;
    color: #222;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 500;

    transition: color 0.3s ease;
}

.main-header .nav-link:hover,
.main-header .nav-link.active {
    color: #478b4c;
}


/* UNDERLINE */

.main-header .nav-link::before {
    content: "";

    position: absolute;
    left: 13px;
    right: 13px;
     bottom: 13px;
    height: 2px;

    background: #478b4c;

    transform: scaleX(0);
    transform-origin: center;

    transition: transform 0.3s ease;
}

.main-header .nav-link:hover::before,
.main-header .nav-link.active::before {
    transform: scaleX(1);
}


/* =========================================================
   DROPDOWN
========================================================= */

.main-header .dropdown-menu {
    display: block;

    min-width: 210px;
    margin: 0;

    padding: 8px 0;

    border: 0;
    border-radius: 4px;

    background: #fff;

    opacity: 0;
    visibility: hidden;

    transform: translateY(8px);

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        visibility 0.25s ease;
}


/* DESKTOP HOVER */




/* DROPDOWN ITEMS */

.main-header .dropdown-item {
    padding: 10px 18px;

    color: #333;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 400;

    background: transparent;

    transition:
        color 0.25s ease,
        background-color 0.25s ease,
        padding-left 0.25s ease;
}

.main-header .dropdown-item:hover {
    color: #fff;
    background: #478b4c;
    padding-left: 23px;
}


/* =========================================================
   CALL BUTTON
========================================================= */

.nav-button {
    margin-left: 20px;
}

.call-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-width: 120px;
    padding: 11px 18px;

    border-radius: 4px;

    background: #478b4c;
    color: #fff !important;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 500;

    transition:
        background-color 0.3s ease,
        transform 0.3s ease;
}

.call-btn:hover {
    background: #397540;
    transform: translateY(-2px);
}

.call-btn i {
    font-size: 13px;
}


/* =========================================================
   MOBILE TOGGLER
========================================================= */

.navbar-toggler {
    padding: 7px 9px;

    border: 1px solid #478b4c;
    border-radius: 4px;

    box-shadow: none !important;
}

.navbar-toggler:focus {
    outline: none;
    box-shadow: none !important;
}


/* =========================================================
   MOBILE / TABLET
========================================================= */




/* =========================================================
   SMALL MOBILE
========================================================= */










                                                /* ==============================
                                                   section 1 hero 
                                                ============================== */



/* =========================================
   HERO SECTION
========================================= */

.hero-section {
    position: relative;
    min-height: 470px;

    background-image: url("../img/slide.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    align-items: center;

    overflow: hidden;
}


.hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.05);
}


.hero-section .container {
    position: relative;
    z-index: 2;
}


/* =========================================
   HERO CONTENT
========================================= */

.hero-content {
    min-height: 410px;

    display: flex;
    align-items: center;
}


/* White circular box */

.hero-box {
    width: 330px;
    height: 330px;

    background: #ffffff;

    border-radius: 50%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;

    padding: 40px;

    box-sizing: border-box;
}


/* Small heading */

.hero-subtitle {
    color: #478b4c;

    font-family: 'Poppins', sans-serif;

    font-size: 11px;
    font-weight: 600;

    margin-bottom: 10px;
}


/* =========================================
   HERO MAIN HEADING
========================================= */

.hero-box h1 {
    margin: 0;

    color: #111111;

    font-family: 'DM Serif Display', serif;

    font-size: 25px;
    line-height: 1.08;

    font-weight: 400;
}


/* Green line */

.hero-line {
    width: 55px;
    height: 3px;

    background: #4b914f;

    margin: 13px 0;
}


/* Description */

.hero-box p {
    max-width: 240px;

    margin: 0 0 18px;

    color: #555555;

    font-family: 'Poppins', sans-serif;

    font-size: 10px;
    font-weight: 400;

    line-height: 1.6;
}


/* Read More */

.hero-btn {
    display: inline-block;

    padding: 9px 21px;

    background: #478b4c;
    color: #ffffff;

    text-decoration: none;

    border-radius: 3px;

    font-family: 'Poppins', sans-serif;

    font-size: 10px;
    font-weight: 500;

    transition: 0.3s ease;
}


.hero-btn:hover {
    background: #326b37;
    color: #ffffff;
}





                                
                                /* =========================
                                   green box section 2
                                ========================= */


.cta-section {
    position: relative;
    background: #397540;
    padding: 35px 20px 40px;
    overflow: hidden;
    color: #fff;
}


/* =========================
   SMOOTH 3 WAVES
========================= */
.cta-section::after {
    content: none;
}
.cta-section::after {
    content: "";
    position: absolute;

    top: 8px;
    left: 0;

    width: 100%;
    height: 75px;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 150' preserveAspectRatio='none'%3E%3Cpath fill='%233d7944' d='M0 48 C90 75 170 25 290 42 C410 60 470 105 600 82 C730 58 790 20 920 38 C1050 55 1110 100 1240 78 C1340 60 1390 38 1440 52 L1440 0 L0 0 Z'/%3E%3Cpath fill='%23427f49' d='M0 72 C110 95 190 45 310 62 C430 80 500 120 630 98 C760 75 820 42 950 58 C1080 75 1150 118 1270 96 C1360 80 1400 65 1440 76 L1440 0 L0 0 Z'/%3E%3Cpath fill='%2348854f' d='M0 92 C100 115 200 70 330 85 C460 100 530 138 660 115 C790 92 850 62 980 78 C1110 94 1180 135 1300 112 C1370 100 1410 88 1440 95 L1440 0 L0 0 Z'/%3E%3C/svg%3E");

    background-size: 100% 100%;
    background-repeat: no-repeat;

    z-index: 1;
    
}

.cta-section::after {
    content: none;
}


.cta-section::before {
    content: "";
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 95px;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 150' preserveAspectRatio='none'%3E%3Cpath fill='%232b5f33' d='M0 35 C110 5 190 75 310 65 C430 55 520 10 650 25 C780 40 830 95 960 82 C1090 68 1160 25 1270 42 C1360 58 1400 55 1440 42 L1440 0 L0 0 Z'/%3E%3Cpath fill='%23306437' d='M0 62 C120 25 210 105 340 82 C470 60 560 25 690 55 C820 85 900 120 1030 98 C1160 76 1230 42 1340 65 C1390 75 1420 72 1440 62 L1440 0 L0 0 Z'/%3E%3Cpath fill='%23366e3c' d='M0 88 C120 48 220 130 360 103 C500 76 590 48 720 80 C850 112 930 140 1060 115 C1190 90 1280 58 1380 88 C1410 95 1430 94 1440 88 L1440 0 L0 0 Z'/%3E%3C/svg%3E");

    background-size: 100% 100%;
    background-repeat: no-repeat;

    z-index: 1;
}



/* Remove second pseudo wave */



.cta-section::after {
    content: "";
    position: absolute;

    top: 8px;
    left: 0;

    width: 100%;
    height: 75px;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 150' preserveAspectRatio='none'%3E%3Cpath fill='%233d7944' d='M0 48 C90 75 170 25 290 42 C410 60 470 105 600 82 C730 58 790 20 920 38 C1050 55 1110 100 1240 78 C1340 60 1390 38 1440 52 L1440 0 L0 0 Z'/%3E%3Cpath fill='%23427f49' d='M0 72 C110 95 190 45 310 62 C430 80 500 120 630 98 C760 75 820 42 950 58 C1080 75 1150 118 1270 96 C1360 80 1400 65 1440 76 L1440 0 L0 0 Z'/%3E%3Cpath fill='%2348854f' d='M0 92 C100 115 200 70 330 85 C460 100 530 138 660 115 C790 92 850 62 980 78 C1110 94 1180 135 1300 112 C1370 100 1410 88 1440 95 L1440 0 L0 0 Z'/%3E%3Cpath fill='%2324512b' fill-opacity='.55' d='M0 110 C130 80 230 125 360 105 C490 85 570 70 700 100 C830 130 930 145 1050 115 C1170 85 1270 100 1370 115 C1400 120 1425 118 1440 112 L1440 0 L0 0 Z'/%3E%3C/svg%3E");

    background-size: 100% 100%;
    background-repeat: no-repeat;

    z-index: 2;
    fill-opacity: .40;
}


/* =========================
   CONTENT
========================= */

.cta-section .container {
    position: relative;
    z-index: 5;
    text-align: center;
}


/* Small Heading */

.cta-small {
    display: block;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 600;

    margin-bottom: 8px;
    margin-top: 40px;
    color: #ffffff;
}


/* Main Heading */

.cta-section h2 {
    margin: 0;

    font-family: 'DM Serif Display', serif;
    font-size: 45px;
    font-weight: 400;
    line-height: 1.2;

    color: #ffffff;
}


/* Green Underline */

.cta-section h2::after {
    content: "";

    display: block;

    width: 250px;
    height: 5px;

    background: #76b852;

    margin: 18px auto 20px;
}


/* Paragraph */

.cta-section p {
    max-width: 900px;

    margin: 0 auto 30px;

    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;

    color: rgba(255, 255, 255, 0.95);
}


/* Contact Button */

.cta-btn {
    display: inline-block;

    background: #ffffff;
    color: #111111;

    padding: 12px 30px;

    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;

    border-radius: 5px;
    border: none;

    text-decoration: none;

    transition: all 0.3s ease;
}


/* Button Hover */

.cta-btn:hover {
    background: #f1f1f1;
    color: #111111;

    text-decoration: none;
}

                                                
                                            /* =========================
                                               about us section no3
                                            ========================= */





/* =========================
   ABOUT SECTION
========================= */

.about-section {
    background: #ffffff;
    padding: 70px 0;
    overflow: hidden;
}

.about-section .container {
    max-width: 1300px;
    padding-left: 15px;
    padding-right: 15px;
}


/* =========================
   ABOUT IMAGE
========================= */

.about-image {
    overflow: hidden;
    border-radius: 5px;
}

.about-image img {
    width: 100%;
    height: 575px;
    object-fit: cover;
    display: block;
}


/* =========================
   ABOUT CONTENT
========================= */

.about-content {
    padding-left: 5px;
}


/* =========================
   SMALL TITLE
========================= */

.about-small {
    display: block;
    color: #478b4c;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
}


/* =========================
   MAIN HEADING
========================= */

.about-content h2 {
    margin: 0;
    color: #111111;
    font-family: 'DM Serif Display', serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1.2;
}


/* =========================
   GREEN LINE
========================= */

.about-line {
    width: 120px;
    height: 4px;
    background: #478b4c;
    margin: 24px 0 25px;
}


/* =========================
   PARAGRAPH
========================= */

.about-content p {
    margin: 0 0 18px;
    color: #333333;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.75;
}


                                        /* =========================
                                           MANUFACTURING section 4
                                        ========================= */

/* =========================
   MANUFACTURE SECTION
========================= */

.manufacture-section {
    background: #f4fbfc;
    padding: 55px 0 65px;
    overflow: hidden;
}


/* =========================
   TITLE
========================= */

.manufacture-title {
    text-align: center;
    margin-bottom: 40px;
}

.manufacture-title h2 {
    margin: 0;
    color: #111111;
    font-family: 'DM Serif Display', serif;
    font-size: 42px;
    font-weight: 400;
    line-height: 1.2;
}


/* =========================
   ROW
========================= */

.manufacture-row {
    align-items: stretch;
}


/* =========================
   COLUMN
========================= */

.manufacture-column {
    display: flex;
    margin-bottom: 25px;
}


/* =========================
   CARD
========================= */

.manufacture-card {
    width: 100%;
    min-height: 285px;

    background: #ffffff;

    border-radius: 10px;

    padding: 42px 20px 25px;

    text-align: center;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;

    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
}


/* =========================
   MANUFACTURING GIF
========================= */

.manufacture-gif {
    width: 75px;
    height: 75px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 18px;

    overflow: hidden;
}

.manufacture-gif img {
    width: 70px;
    height: 70px;

    object-fit: contain;
    display: block;
}

                                               /* /* =========================
                                                  our porducts
                                                 ========================= */
                                                         
                                                        



/* =====================================================
   NICONIA PRODUCTS SECTION
===================================================== */

.niconia-products {
    width: 100%;
    background: #ffffff;

    padding: 55px 0 75px;

    overflow: hidden;
}


/* =====================================================
   CONTAINER
===================================================== */

.niconia-products .container {
    max-width: 1350px;
}


/* =====================================================
   SECTION HEADING
===================================================== */

.niconia-products-heading {
    text-align: center;

    margin-bottom: 30px;
}

.niconia-products-heading h2 {
    margin: 0;

    color: #111111;

    font-family: 'DM Serif Display', serif;

    font-size: 42px;
    font-weight: 400;

    line-height: 1.2;
}


/* =====================================================
   GREEN UNDERLINE
===================================================== */

.niconia-products-line {
    position: relative;

    width: 140px;
    height: 5px;

    background: #478b4c;

    margin: 20px auto 0;
}


/* small end piece */

.niconia-products-line::after {
    content: "";

    position: absolute;

    top: 0;
    right: -10px;

    width: 7px;
    height: 5px;

    background: #478b4c;
}


/* =====================================================
   CATEGORY TABS
===================================================== */

.niconia-product-tabs {
    display: flex;

    justify-content: center;
    align-items: stretch;

    gap: 10px;

    margin-bottom: 45px;

    flex-wrap: wrap;
}


/* =====================================================
   TAB
===================================================== */

.niconia-product-tab {
    min-width: 180px;

    padding: 14px 25px;

    border: 0;
    border-radius: 0;

    background: #478b4c;

    color: #000000;

    font-family: 'Poppins', sans-serif;

    font-size: 17px;
    font-weight: 500;

    line-height: 1.3;

    text-align: center;

    cursor: pointer;

    outline: none;
}


/* =====================================================
   ACTIVE TAB
===================================================== */

.niconia-product-tab.active {
    color: #ffffff;

    font-weight: 600;
}


/* =====================================================
   PRODUCTS ROW
===================================================== */

.niconia-products-row {
    align-items: flex-start;
}


/* =====================================================
   PRODUCT ITEM
===================================================== */

.niconia-product-item {
    margin-bottom: 35px;
}


/* =====================================================
   PRODUCT CARD
===================================================== */

.niconia-product-card {
    width: 100%;

    text-align: left;
}


/* =====================================================
   PRODUCT IMAGE AREA
===================================================== */

.niconia-product-image {
    width: 100%;
    height: 300px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #ffffff;

    overflow: hidden;

    margin-bottom: 22px;
}


/* =====================================================
   PRODUCT IMAGE
===================================================== */

.niconia-product-image img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;
}


/* =====================================================
   PRODUCT CONTENT
===================================================== */

.niconia-product-content {
    width: 100%;
}


/* =====================================================
   PRODUCT CATEGORY
===================================================== */

.niconia-product-content span {
    display: block;

    margin-bottom: 10px;

    color: #929ba5;

    font-family: 'Poppins', sans-serif;

    font-size: 15px;
    font-weight: 400;

    line-height: 1.4;
}


/* =====================================================
   PRODUCT NAME
===================================================== */

.niconia-product-content h3 {
    margin: 0 0 17px;

    color: #102b4e;

    font-family: 'Poppins', sans-serif;

    font-size: 18px;
    font-weight: 500;

    line-height: 1.3;
}


/* =====================================================
   READ MORE
===================================================== */

.niconia-product-button {
    display: inline-block;

    min-width: 169px;

    padding: 13px 25px;

    background: #478b4c;

    color: #ffffff;

    border-radius: 5px;

    font-family: 'Poppins', sans-serif;

    font-size: 16px;
    font-weight: 600;

    line-height: 1.4;

    text-align: center;

    text-decoration: none;
}


/* =====================================================
   NO PRODUCTS
===================================================== */

.niconia-no-products {
    display: none;

    width: 100%;

    text-align: center;

    padding: 35px 0;
}

.niconia-no-products p {
    margin: 0;

    color: #929ba5;

    font-family: 'Poppins', sans-serif;

    font-size: 16px;
}


/* =====================================================
   TABLET
===================================================== */




/* =====================================================
   MOBILE
===================================================== */





                                /* =====================================================
                                  why chose us 
                                ===================================================== */





/* Main Section Font & Background */
.why-choose-us {
    font-family: 'Poppins', sans-serif;
    background: url('../img/bac.jpg') no-repeat center center/cover;
    padding: 70px 0;
    position: relative;
}



/* Subheading - Green Small Text */
.small-subheading {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: #43a047 !important;
}

/* Heading - Serif Classic Style */
.section-title {
    font-family: 'Playfair Display', serif;
    font-size: 38px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* Underline Indicator */
.custom-underline {
    width: 75px;
    height: 3px;
    background-color: #388e3c;
    position: relative;
    border-radius: 2px;
}

.custom-underline::after {
    content: '';
    position: absolute;
    right: 0;
    top: -2px;
    width: 7px;
    height: 7px;
    background-color: #ffffff;
    border-radius: 50%;
}

/* Feature Titles */
.feature-title {
    font-size: 17px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.35;
    margin-top: 10px;
}

/* 5 Column Layout for Desktop */


/* Icons Box Wrapper */
.icon-box {
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Custom Image Icons Styling */
.custom-icon-img {
    max-height: 60px;
    width: auto;
    object-fit: contain;
    transition: transform 0.3s ease;
}

/* Hover Effect on Icon (Optional) */
.feature-card:hover .custom-icon-img {
    transform: translateY(-5px);
}

                        
                                            /* =====================================================
                                                 contanct form
                                                ===================================================== */

 /* =========================================
   CONTACT SECTION
========================================= */

.contact-section {
    width: 100%;
    background: #ffffff;
    padding: 80px 0 105px;
}


/* =========================================
   CONTAINER
========================================= */

.contact-section .container {
    max-width: 1320px;
    margin: 0 auto;
    padding-left: 40px;
    padding-right: 40px;
}

/* =========================================
   MAIN LAYOUT
========================================= */

.contact-layout {
    display: grid;

    grid-template-columns: 0.95fr 1fr;

    column-gap: 105px;

    align-items: start;
}


/* =========================================
   LEFT CONTENT
========================================= */



.contact-subheading {
    display: block;

    margin-bottom: 27px;

    color: #478b4c;

    font-family: 'Poppins', sans-serif;
    font-size: 22px;
    font-weight: 600;

    line-height: 1.2;
}


.contact-heading {
    margin: 0;

    color: #111111;

    font-family: 'DM Serif Display', serif;
    font-size: 50px;
    font-weight: 400;

    line-height: 1.15;
}


/* =========================================
   GREEN LINE
========================================= */

.contact-underline {
    display: flex;
    align-items: center;

    margin-top: 38px;
    margin-bottom: 39px;

    width: 130px;
    height: 5px;
}


.contact-underline::before {
    content: "";

    width: 120px;
    height: 5px;

    background: #478b4c;
}


.contact-underline span {
    display: block;

    width: 8px;
    height: 5px;

    margin-left: 3px;

    background: #478b4c;
}


/* =========================================
   DESCRIPTION
========================================= */

.contact-description {
    max-width: 730px;

    margin: 0 0 30px;

    color: #202b35;

    font-family: 'Poppins', sans-serif;
    font-size: 19px;
    font-weight: 100;

    line-height: 1.85;
}


/* =========================================
   TAGLINE
========================================= */

.contact-tagline {
    margin: 0;

    color: #202b35;

    font-family: 'Poppins', sans-serif;
    font-size: 19px;
    font-weight: 400;

    line-height: 1.5;
}


/* =========================================
   RIGHT FORM
========================================= */

.contact-right {
    width: 100%;
}


.contact-form {
    width: 100%;
}


/* =========================================
   INPUT ROW
========================================= */

.contact-form-row {
    display: grid;

    grid-template-columns: 1fr 1fr;

    column-gap: 9px;

    margin-bottom: 14px;
}


/* =========================================
   INPUT
========================================= */

.contact-field {
    width: 100%;
}


.contact-field input {
    display: block;

    width: 100%;
    height: 54px;

    padding: 0 21px;

    border: 1px solid #d5dbe0;
    border-radius: 5px;

    background: #ffffff;

    color: #222222;

    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 400;

    line-height: 1;

    outline: none;

    box-sizing: border-box;

    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04);
}


.contact-field input::placeholder {
    color: #9ba7b4;
    opacity: 1;
}


.contact-field input:focus {
    border-color: #478b4c;

    outline: none;

    box-shadow:
        0 0 0 2px rgba(71, 139, 76, 0.08);
}


/* =========================================
   MESSAGE
========================================= */

.contact-message {
    width: 100%;

    margin-top: 0;
}


.contact-message textarea {
    display: block;

    width: 100%;
    height: 200px;

    padding: 20px 21px;

    border: 1px solid #d5dbe0;
    border-radius: 5px;

    background: #ffffff;

    color: #222222;

    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 400;

    line-height: 1.4;

    resize: vertical;

    outline: none;

    box-sizing: border-box;

    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04);
}


.contact-message textarea::placeholder {
    color: #9ba7b4;
    opacity: 1;
}


.contact-message textarea:focus {
    border-color: #478b4c;

    outline: none;

    box-shadow:
        0 0 0 2px rgba(71, 139, 76, 0.08);
}


/* =========================================
   SUBMIT BUTTON
========================================= */

.contact-submit {
    display: block;

    width: 210px;
    height: 60px;

    margin-top: 34px;

    padding: 0;

    border: none;
    border-radius: 4px;

    background: #478b4c;
    color: #ffffff;

    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 600;

    line-height: 60px;

    text-align: center;

    cursor: pointer;

    transition: all 0.25s ease;
}


.contact-submit:hover {
    background: #397540;

    color: #ffffff;

    transform: translateY(-1px);
}


/* =========================================
   TABLET
========================================= */




/* =========================================
   MOBILE
========================================= */




/* =========================================
   SMALL MOBILE
========================================= */




                            /* =========================================
                               NICONIA FOOTER
                            ========================================= */


/* =========================================
   FOOTER
========================================= */

.niconia-footer {
    width: 100%;
    background: #ffffff;
    font-family: 'Poppins', sans-serif;
}


/* =========================================
   MAIN FOOTER
========================================= */

.niconia-footer-main {
    width: 100%;
    background: #ffffff;
}

.niconia-footer-main .container {
    max-width: 1320px;

}


/* =========================================
   FOOTER BOX
========================================= */

.niconia-footer-box {
    min-height: 258px;
    padding: 34px 32px 25px;

    background: #ffffff;

    transition: all 0.3s ease;
}

.niconia-footer-box {
    min-height: 258px;
    padding: 34px 32px 25px;
    background: #ffffff;
    transition: background-color 0.45s ease, color 0.45s ease;
}

.niconia-footer-box h3,
.niconia-footer-box p,
.niconia-footer-box a,
.niconia-footer-box i {
    transition: color 0.35s ease;
}

/* Default About Us */
.niconia-footer-box.active {
    background: #478b4c;
}

.niconia-footer-box.active h3,
.niconia-footer-box.active p,
.niconia-footer-box.active a,
.niconia-footer-box.active i {
    color: #ffffff;
}

/* Hovered box */
.niconia-footer-box:hover {
    background: #478b4c;
}

.niconia-footer-box:hover h3,
.niconia-footer-box:hover p,
.niconia-footer-box:hover a,
.niconia-footer-box:hover i {
    color: #ffffff !important;
}

/* About Us becomes white when another box is hovered */
.niconia-footer-main .row:has(.niconia-footer-box:not(.active):hover)
.niconia-footer-box.active {
    background: #ffffff;
}

.niconia-footer-main .row:has(.niconia-footer-box:not(.active):hover)
.niconia-footer-box.active h3 {
    color: #397540 !important;
}

.niconia-footer-main .row:has(.niconia-footer-box:not(.active):hover)
.niconia-footer-box.active p,
.niconia-footer-main .row:has(.niconia-footer-box:not(.active):hover)
.niconia-footer-box.active a,
.niconia-footer-main .row:has(.niconia-footer-box:not(.active):hover)
.niconia-footer-box.active i {
    color: #222222 !important;
}

/* Green box de andar text/icon hover te white hi rahe */
.niconia-footer-box:hover a,
.niconia-footer-box:hover a:hover,
.niconia-footer-box:hover i,
.niconia-footer-box:hover .niconia-social a,
.niconia-footer-box:hover .niconia-social a:hover {
    color: #ffffff !important;
}

/* =========================================
   HEADINGS
========================================= */

.niconia-footer-box h3 {
    margin: 0 0 10px;

    color: #397540;

    font-family: 'DM Serif Display', serif;
    font-size: 23px;
    font-weight: 400;

    line-height: 1.3;
}


/* =========================================
   ABOUT
========================================= */

.niconia-footer-box p {
    max-width: 275px;

    margin: 0;

    color: #222222;

    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 400;

    line-height: 1.55;

    text-align: justify;
}


/* =========================================
   SOCIAL
========================================= */

.niconia-social {
    display: flex;
    align-items: center;

    gap: 16px;

    margin-top: 13px;
}

.niconia-social a {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    color: #397540;

    font-size: 18px;

    text-decoration: none;

    transition: 0.25s ease;
}

.niconia-social a:hover {
    transform: translateY(-2px);
}

.niconia-footer-box.active .niconia-social a {
    color: #ffffff;
}


/* =========================================
   LIST
========================================= */

.niconia-footer-box ul {
    padding: 0;
    margin: 0;

    list-style: none;
}

.niconia-footer-box li {
    margin-bottom: 8px;
}

.niconia-footer-box li:last-child {
    margin-bottom: 0;
}


/* =========================================
   LINKS
========================================= */

.niconia-footer-box li a {
    display: flex;

    align-items: flex-start;

    color: #222222;

    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 400;

    line-height: 1.5;

    text-decoration: none;

    transition: all 0.25s ease;
}


/* ICON */

.niconia-footer-box li a i {
    flex-shrink: 0;

    margin-right: 8px;
    margin-top: 4px;

    color: #222222;

    font-size: 9px;
}


/* HOVER */

.niconia-footer-box li a:hover {
    color: #478b4c;

    padding-left: 3px;
}

.niconia-footer-box li a:hover i {
    color: #478b4c;
}


/* =========================================
   CONTACT DETAILS
========================================= */

.contact-details li {
    display: flex;
    align-items: flex-start;

    margin-bottom: 10px;
}

.contact-details > li > i {
    flex-shrink: 0;

    width: 18px;

    margin-right: 7px;
    margin-top: 4px;

    color: #222222;

    font-size: 16px;
}

.contact-details li a {
    display: block !important;

    padding-left: 0 !important;
}


/* =========================================
   BOTTOM BAR
========================================= */

.niconia-footer-bottom {
    position: relative;

    min-height: 43px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #478b4c;

    border-top: 1px solid rgba(255,255,255,0.35);
}

.niconia-footer-bottom p {
    margin: 0;

    color: #ffffff;

    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 500;

    line-height: 43px;

    text-align: center;
}


/* =========================================
   BACK TO TOP
========================================= */

.niconia-back-top {
    position: fixed;

    right: 25px;
    bottom: 20px;

    width: 45px;
    height: 40px;

    display: none;

    align-items: center;
    justify-content: center;

    border: none;

    background: #478b4c;

    color: #ffffff;

    font-size: 16px;

    cursor: pointer;

    z-index: 9999;

    box-shadow: 0 3px 10px rgba(0,0,0,0.15);

    transition: all 0.3s ease;
}

.niconia-back-top.show {
    display: flex;
}

.niconia-back-top:hover {
    background: #397540;

    transform: translateY(-3px);
}


.container-fluid{

padding-left: 0px;
padding-right: 0px;
}

/* ===========================================================================================================================
                about page start 
============================================================================================================================== */



/* =========================================================
   ABOUT HERO
========================================================= */

.about-hero {
    position: relative;
    width: 100%;
    min-height: 250px;

    display: flex;
    align-items: center;

    overflow: hidden;

    background-image: url("../img/breadcr.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* DARK OVERLAY */

.about-hero-overlay {
    position: absolute;
    inset: 0;

    background: rgba(0, 0, 0, 0.38);
}


/* CONTAINER */

.about-hero .container {
    position: relative;
    z-index: 2;
}


/* HERO CONTENT */

.about-hero-content h1 {
    margin: 0 0 6px;

    color: #478b4c;

    font-family: 'DM Serif Display', serif;
    font-size: 30px;
    font-weight: 400;
    line-height: 1.2;
}


/* BREADCRUMB */

.about-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;

    color: #ffffff;

    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 400;
}


/* HOME LINK */

.about-breadcrumb a {
    color: #ffffff;
    text-decoration: none;

    transition: color 0.3s ease;
}


/* HOME HOVER */

.about-breadcrumb a:hover {
    color: #76b852;
}


/* ABOUT TEXT + ARROW */

.about-breadcrumb span {
    color: #ffffff;
}


/* =========================================================
   MOBILE
========================================================= */






/* =========================================================
   INNOVATION & QUALITY
========================================================= */

.innovation-section {
    position: relative;
    width: 100%;

    padding: 40px 0 45px;

    background:
        url("../img/light-blue-background-min-scaled.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.innovation-m{
    margin-top: 40px;
}


/* CONTENT */

.innovation-content {
    width: 100%;
}


/* SMALL HEADING */

.innovation-content .about-small {
    display: block;

    margin-bottom: 6px;

    color: #478b4c;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
}


/* MAIN HEADING */

.innovation-content h2 {
    margin: 0;

    color: #111111;

    font-family: 'DM Serif Display', serif;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.2;
}


/* GREEN LINE */

.innovation-content .about-line {
    width: 62px;
    height: 3px;

    margin: 14px 0 17px;

    background: #478b4c;
}


/* PARAGRAPHS */

.innovation-content p {
    margin: 0 0 9px;

    color: #333333;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.7;

    text-align: justify;
}

/* =========================================================
   INNOVATION SCROLL ANIMATION
========================================================= */

.innovation-content {
    opacity: 1;
    transform: translateY(0);
}

.innovation-content.animate {
    animation: innovationFadeUp 0.8s ease both;
}

@keyframes innovationFadeUp {

    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================================
   RESPONSIVE
========================================================= */









/* ==================================================================================================================
                                                    our products
================================================================================================================== */



/* =========================================================
   PRODUCTS SECTION
========================================================= */

.niconia-product-section {
    width: 100%;
    padding: 35px 0 55px;
    background: #ffffff;
}


/* PRODUCT CARD */

.product-card {
    padding: 0 20px;
}

.product-box {
    width: 100%;
    padding-bottom: 32px;

    background: #ffffff;

    transition: transform 0.3s ease;
}


/* IMAGE */

.product-image {
    width: 100%;
    height: 245px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.product-image img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;

    transition: transform 0.4s ease;
}

.product-box:hover .product-image img {
    transform: scale(1.04);
}


/* PRODUCT INFO */

.product-info {
    padding-top: 7px;
}


/* CATEGORY */

.product-info span {
    display: block;

    margin-bottom: 5px;

    color: #a5a5a5;

    font-family: 'Poppins', sans-serif;
    font-size: 9px;
    font-weight: 400;

    line-height: 1.4;
}


/* PRODUCT NAME */

.product-info h3 {
    margin: 0 0 11px;

    color: #222222;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 400;

    line-height: 1.3;
    text-transform: uppercase;
}


/* READ MORE BUTTON */

.product-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 75px;
    height: 24px;

    padding: 0 11px;

    border-radius: 2px;

    background: #478b4c;
    color: #ffffff;

    font-family: 'Poppins', sans-serif;
    font-size: 8px;
    font-weight: 500;

    text-decoration: none;

    transition:
        background-color 0.3s ease,
        transform 0.3s ease;
}

.product-btn:hover {
    background: #397540;
    color: #ffffff;

    transform: translateY(-2px);
}


/* =========================================================
   TABLET
========================================================= */




/* =========================================================
   MOBILE
========================================================= */




/* =========================================================
   SMALL MOBILE
========================================================= */




/* ===========================================================================================================================================================================
                                                            gallery page section 
=========================================================================================================================================================================== */

.niconia-gallery {
    width: 100%;
    padding: 35px 0 50px;
    background: #ffffff;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px;
}

.gallery-item {
    width: 100%;
    height: 245px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.gallery-item img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;

    transition: transform 0.4s ease;
}

.gallery-item:hover img {
    transform: scale(1.05);
}


/* TABLET */




/* MOBILE */




/* SMALL MOBILE */




/* ===========================================================================================================================================================================
                                                            contact page section 
=========================================================================================================================================================================== */


/* =========================================================
   CONTACT INFO
   ========================================================= */

.contact-info-section {
    width: 100%;
    padding: 40px 0 65px;
    background: #f7f7f7;
}

.contact-info-grid {
    width: 100%;
    max-width: 1050px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 22px;
    align-items: center;
}


/* =========================================================
   CARD
   ========================================================= */

.contact-info-card {
    position: relative;

    width: 100%;
    height: 165px;
    min-height: 165px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #ffffff;

    border-radius: 5px;

    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.06);

    z-index: 1;

    transition:
        transform 0.35s ease,
        background-color 0.35s ease,
        box-shadow 0.35s ease;
}


/* =========================================================
   ADDRESS DEFAULT GREEN
   ========================================================= */

.contact-info-card.address-card {
    background: #478b4c;

    height: 165px;
    min-height: 165px;

    margin: 0;
}


/* =========================================================
   CARD LINK
   ========================================================= */

.contact-card-link {
    width: 100%;
    height: 100%;
    min-height: 165px;

    padding: 20px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    text-align: center;

    color: inherit;
    text-decoration: none;
}


/* =========================================================
   ICON
   ========================================================= */

.contact-icon {
    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    margin-bottom: 10px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #478b4c;
    border-radius: 50%;

    background: #ffffff;

    color: #478b4c;

    font-size: 19px;

    line-height: 1;

    box-sizing: border-box;

    transition:
        transform 0.35s ease,
        background-color 0.35s ease,
        color 0.35s ease,
        border-color 0.35s ease;
}


/* =========================================================
   NORMAL CARD TEXT
   ========================================================= */

.contact-info-card h3 {
    margin: 0 0 5px;

    color: #111111;

    font-family: 'DM Serif Display', serif;
    font-size: 21px;
    font-weight: 400;

    line-height: 1.2;

    transition: color 0.3s ease;
}

.contact-info-card p {
    margin: 0;

    color: #333333;

    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 400;

    line-height: 1.45;

    text-align: center;

    transition: color 0.3s ease;
}

.contact-info-card.address-card p {
    font-size: 11px;
}


/* =========================================================
   ADDRESS CARD DEFAULT TEXT
   ========================================================= */

.contact-info-card.address-card h3,
.contact-info-card.address-card p {
    color: #ffffff;
}


/* =========================================================
   ADDRESS DEFAULT ICON
   ========================================================= */

.contact-info-card.address-card .contact-icon {
    background: #ffffff;

    border-color: #ffffff;

    color: #478b4c;
}


/* =========================================================
   HOVER CARD
   ========================================================= */

.contact-info-card:hover {
    background: #478b4c;

    transform: scale(1.07);

    box-shadow: 0 18px 40px rgba(71, 139, 76, 0.30);

    z-index: 10;
}


/* Hover text */

.contact-info-card:hover h3,
.contact-info-card:hover p {
    color: #ffffff;
}


/* Hover icon */

.contact-info-card:hover .contact-icon {
    background: #ffffff;

    border-color: #ffffff;

    color: #478b4c;

    transform: scale(1.10);
}


/* =========================================================
   IMPORTANT:
   WHEN ANOTHER CARD IS HOVERED,
   ADDRESS GOES WHITE
   ========================================================= */

.contact-info-grid:has(.contact-info-card:not(.address-card):hover)
.address-card {
    background: #ffffff;

    transform: scale(1);

    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.06);
}


/* Address text white -> black */

.contact-info-grid:has(.contact-info-card:not(.address-card):hover)
.address-card h3 {
    color: #111111;
}

.contact-info-grid:has(.contact-info-card:not(.address-card):hover)
.address-card p {
    color: #333333;
}


/* Address icon back to normal */

.contact-info-grid:has(.contact-info-card:not(.address-card):hover)
.address-card .contact-icon {
    background: transparent;

    border-color: #478b4c;

    color: #478b4c;

    transform: scale(1);
}


/* =========================================================
   REVEAL ANIMATION
   ========================================================= */

.contact-reveal {
    opacity: 0;
}

.contact-reveal.animate {
    animation: contactCardReveal 0.8s ease forwards;
}

.contact-reveal:nth-child(1).animate {
    animation-delay: 0.1s;
}

.contact-reveal:nth-child(2).animate {
    animation-delay: 0.25s;
}

.contact-reveal:nth-child(3).animate {
    animation-delay: 0.4s;
}

@keyframes contactCardReveal {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


/* =========================================================
   TABLET
   ========================================================= */




/* =========================================================
   MOBILE
   ========================================================= */




/* =========================================================
   SMALL MOBILE
   ========================================================= */





/*===============================
           map
=================================*/


/* =====================================================
   MAP SECTION
===================================================== */

.contact-map-section {
    
    width: 100%;
    height: 100;
    background: #f7f7f7;
}

.contact-map {
    width: 100%;
    overflow: hidden;

    border-radius: 5px;

    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
}

.contact-map iframe {
    display: block;

    width: 100%;
    height: 400px;

    border: 0;
}


/* =====================================================
   TABLET
===================================================== */




/* =====================================================
   MOBILE
===================================================== */




/* =====================================================
   SMALL MOBILE
===================================================== */






/* ===========================================================================================================================================================================
                                                            sigle product  page section 
=========================================================================================================================================================================== */

/* =========================================================
   PRODUCT DETAIL SECTION
========================================================= */

.product-detail-section {
    width: 100%;
    padding: 25px 0 75px;
    background: #ffffff;
}

.product-detail-section .container {
    max-width: 1000px;
}


/* =========================================================
   PRODUCT MAIN AREA
========================================================= */

.product-main-row {
    width: 100%;

    display: grid;
    grid-template-columns: 1fr 1fr;

    align-items: start;

    min-height: 390px;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.product-main-image-wrap {
    position: relative;

    width: 100%;
    height: 390px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.product-main-image {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.product-main-image img {
    width: 330px;
    height: 370px;

    object-fit: contain;

    display: block;

    transition:
        transform 0.5s ease,
        filter 0.5s ease;
}


/* Image hover */

.product-main-image:hover img {
    transform: scale(1.04);
}


/* Search icon */

.product-search-icon {
    position: absolute;

    top: 25px;
    right: 40px;

    width: 28px;
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #26364a;

    font-size: 14px;

    cursor: pointer;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}

.product-search-icon:hover {
    color: #478b4c;
    transform: scale(1.15);
}


/* =========================================================
   PRODUCT INFORMATION
========================================================= */

.product-main-info {
    padding: 15px 0 0 30px;
}

.product-breadcrumb {
    margin-bottom: 12px;

    color: #8d9399;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 400;

    line-height: 1.5;
}

.product-category {
    margin-bottom: 7px;

    color: #4388d0;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 400;
}

.product-main-info h1 {
    margin: 0 0 8px;

    color: #17263a;

    font-family: 'Poppins', sans-serif;
    font-size: 17px;
    font-weight: 600;

    line-height: 1.3;
}

.product-short-desc {
    margin: 0;

    color: #5d6570;

    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    font-weight: 400;

    line-height: 1.5;
}

.product-info-line {
    width: 100%;
    height: 1px;

    margin: 12px 0 8px;

    background: #e5e5e5;
}

.product-categories {
    color: #4e5660;

    font-family: 'Poppins', sans-serif;
    font-size: 9px;
    font-weight: 400;

    line-height: 1.5;
}

.product-categories strong {
    color: #273444;
    font-weight: 600;
}

.product-categories a {
    color: #4388d0;

    text-decoration: none;

    transition: color 0.3s ease;
}

.product-categories a:hover {
    color: #478b4c;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.product-description {
    width: 100%;

    margin-top: 5px;
}


/* Tabs */

.product-tabs {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 20px;

    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

.product-tabs span {
    position: relative;

    padding: 10px 0;

    color: #333333;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 500;

    cursor: pointer;
}

.product-tabs span.active {
    color: #26364a;
    font-weight: 600;
}

.product-tabs span.active::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -1px;

    width: 100%;
    height: 2px;

    background: #478b4c;
}


/* Description content */

.product-description-content {
    padding-top: 25px;
}

.product-description-content h2 {
    margin: 0 0 15px;

    color: #17263a;

    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 600;

    line-height: 1.4;
}

.product-description-content > p {
    margin: 0 0 25px;

    color: #4d5967;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 400;

    line-height: 1.7;
}

.product-features p {
    margin: 0 0 3px;

    color: #4d5967;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 400;

    line-height: 1.6;
}





.product-features strong {
    color: #273444;
    font-weight: 700;
}



.product-feature-list {
    margin: 0 0 20px;
    padding-left: 18px;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.6;
    color: #4d5967;
}

.product-feature-list li {
    margin-bottom: 4px;
    padding-left: 2px;
}

.product-feature-list li::marker {
    color: #478b4c;
}

/* =========================================================
   RELATED PRODUCTS
========================================================= */

.related-products {
    width: 100%;

    margin-top: 40px;
}

.related-title {
    margin: 0 0 22px;

    color: #17263a;

    font-family: 'Poppins', sans-serif;
    font-size: 19px;
    font-weight: 600;

    line-height: 1.3;
}


/* Grid */

.related-products-grid {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: 35px;
}


/* Card */

.related-product-card {
    min-width: 0;

    transition:
        transform 0.35s ease,
        opacity 0.35s ease;
}

.related-product-card:hover {
    transform: translateY(-7px);
}


/* Image */

.related-product-image {
    width: 100%;
    height: 175px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}

.related-product-image img {
    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;

    transition: transform 0.45s ease;
}

.related-product-card:hover .related-product-image img {
    transform: scale(1.06);
}


/* Product info */

.related-product-info {
    padding-top: 10px;
}

.related-product-info span {
    display: block;

    margin-bottom: 5px;

    color: #a4a9af;

    font-family: 'Poppins', sans-serif;
    font-size: 8px;
    font-weight: 400;

    line-height: 1.3;
}

.related-product-info h3 {
    margin: 0 0 12px;

    color: #17263a;

    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 600;

    line-height: 1.3;
}


/* Button */

.related-product-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 98px;
    height: 31px;

    padding: 0 16px;

    background: #478b4c;
    color: #ffffff;

    border-radius: 2px;

    font-family: 'Poppins', sans-serif;
    font-size: 9px;
    font-weight: 500;

    text-decoration: none;

    transition:
        background-color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.related-product-btn:hover {
    background: #397640;
    color: #ffffff;

    transform: translateY(-2px);

    box-shadow: 0 5px 12px rgba(71, 139, 76, 0.25);
}


/* =========================================================
   SCROLL ANIMATION
========================================================= */

.product-reveal {
    opacity: 0;
    transform: translateY(25px);
}

.product-reveal.animate {
    animation: productReveal 0.7s ease forwards;
}

@keyframes productReveal {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================================
   TABLET
========================================================= */




/* =========================================================
   MOBILE
========================================================= */




/* =========================================================
   SMALL MOBILE
========================================================= */