/* ===================================================== */
/* SAYHAN INTERNATIONAL - PREMIUM EPC STYLE CSS */
/* ===================================================== */


/* ===================================================== */
/* HERO OVERLAY */
/* ===================================================== */

.hero-banner-area:before,
.slider-area:before,
.banner-area:before,
.rs-layer-wrap:before {
    content: "";
    position: absolute;
    inset: 0;

    background: linear-gradient(
        90deg,
        rgba(0,0,0,0.58) 0%,
        rgba(0,0,0,0.32) 45%,
        rgba(0,0,0,0.10) 100%
    );

    z-index: 1;
}


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

.hero-content,
.slider-content,
.banner-content,
.rs-layer {
    position: relative;
    z-index: 2;
}


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

.hero-content h1,
.slider-content h1,
.banner-content h1,
.rs-layer h1 {

    color: #ffffff !important;

    font-weight: 800 !important;

    line-height: 1.1;

    text-shadow: 0px 3px 12px rgba(0,0,0,0.45);
}


/* ===================================================== */
/* GREEN HIGHLIGHT */
/* ===================================================== */

.hero-content h1 span,
.slider-content h1 span,
.banner-content h1 span,
.rs-layer h1 span {

    color: #58C14D !important;
}


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

.hero-content p,
.slider-content p,
.banner-content p,
.rs-layer p {

    color: rgba(255,255,255,0.92) !important;

    line-height: 1.8;

    font-weight: 500;

    text-shadow: 0px 2px 8px rgba(0,0,0,0.35);
}


/* ===================================================== */
/* BUTTON STYLE */
/* ===================================================== */

.theme-btn,
.primary-btn,
.btn,
button,
input[type="submit"] {

    background: linear-gradient(
        135deg,
        #58C14D,
        #0E9F6E
    ) !important;

    border: none !important;

    color: #ffffff !important;

    font-weight: 700;

    border-radius: 10px;

    transition: all 0.3s ease;

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

    padding: 14px 28px;
}


/* ===================================================== */
/* BUTTON HOVER */
/* ===================================================== */

.theme-btn:hover,
.primary-btn:hover,
.btn:hover,
button:hover,
input[type="submit"]:hover {

    background: linear-gradient(
        135deg,
        #4CAF50,
        #087F5B
    ) !important;

    transform: translateY(-2px);

    box-shadow: 0 14px 28px rgba(0,0,0,0.18);
}


/* ===================================================== */
/* NAVBAR GLASS EFFECT */
/* ===================================================== */

.site-header,
.header-area,
.navbar,
.main-header,
.menu-area {

    background: rgba(0,0,0,0.22) !important;

    backdrop-filter: blur(10px);

    -webkit-backdrop-filter: blur(10px);

    transition: 0.3s ease;
}


/* ===================================================== */
/* MENU TEXT */
/* ===================================================== */

.navbar a,
.main-menu a,
.menu-area ul li a {

    color: #ffffff !important;

    font-weight: 600;

    transition: 0.3s ease;
}


/* ===================================================== */
/* MENU HOVER */
/* ===================================================== */

.navbar a:hover,
.main-menu a:hover,
.menu-area ul li a:hover {

    color: #58C14D !important;
}


/* ===================================================== */
/* REMOVE TOP BAR */
/* ===================================================== */

.topbar-area,
.header-top,
.top-header,
.notice-bar {

    display: none !important;
}


/* ===================================================== */
/* HERO HEIGHT */
/* ===================================================== */

.hero-banner-area,
.slider-area,
.banner-area {

    min-height: 100vh;

    position: relative;
}


/* ===================================================== */
/* IMAGE LOOK */
/* ===================================================== */

.hero-banner-area img,
.slider-area img,
.banner-area img {

    object-fit: cover;
}


/* ===================================================== */
/* SECTION SPACING */
/* ===================================================== */

section {

    position: relative;
}


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

.service-card,
.project-card,
.team-card {

    border-radius: 18px;

    overflow: hidden;

    transition: 0.3s ease;

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


.service-card:hover,
.project-card:hover,
.team-card:hover {

    transform: translateY(-8px);

    box-shadow: 0 20px 40px rgba(0,0,0,0.12);
}


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

@media (max-width: 768px) {

    .hero-content h1,
    .slider-content h1,
    .banner-content h1 {

        font-size: 42px !important;

        line-height: 1.2;
    }

    .hero-content p,
    .slider-content p,
    .banner-content p {

        font-size: 15px !important;
    }

    .hero-banner-area,
    .slider-area,
    .banner-area {

        min-height: 85vh;
    }

    .theme-btn,
    .primary-btn,
    .btn,
    button {

        padding: 12px 22px;
    }
}

/* Remove huge white gaps between sections */
section {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Counter section */
.shortcode-counter,
.counter-section,
.funfact-area,
.consulting-block-area {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* Portfolio / project section */
.portfolio-area,
.project-area,
.recent-project-area {
    padding-top: 50px !important;
}

/* Remove empty spacing */
.elementor-widget-container,
.elementor-section {
    margin-bottom: 0 !important;
}
.footer-widget img{
    max-height: 100px !important;
    width: auto !important;
}