/*
 * EgyTech custom styles -- footer.css
 * Scope: Elementor footer template 23458
 * Moved out of WordPress Additional CSS on 2026-09-21 so that a change
 * to one area can no longer overwrite unrelated sections.
 * See docs/SITE-CUSTOMIZATION-MAP.md
 */

/* =========================================================================
   EGYTECH ENTERPRISE FOOTER REDESIGN (Template ID 23458)
   Strictly scoped to footer container and elementor-23458
   ========================================================================= */

footer.hfe-footer,
.elementor-23458 {
    background-color: #035292;
    color: #ffffff;
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    position: relative;
    z-index: 10;
}

/* Remove any stray margins from footer sections */
.elementor-23458 > .elementor-section {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* -------------------------------------------------------------------------
   1. TOP CTA BAND (Section 1)
   ------------------------------------------------------------------------- */
.elementor-23458 > .elementor-section:first-child,
.elementor-23458 .egy-cta-band-section {
    background-color: #035292 !important;
    padding: 35px 20px 10px 20px !important;
}

.elementor-23458 > .elementor-section:first-child > .elementor-container,
.elementor-23458 .egy-cta-band-section > .elementor-container {
    background: linear-gradient(135deg, #02365e 0%, #02487d 100%) !important;
    border: 1px solid rgba(244, 180, 26, 0.4) !important;
    border-radius: 14px !important;
    padding: 26px 36px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    max-width: 1240px !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.elementor-23458 > .elementor-section:first-child > .elementor-container:hover,
.elementor-23458 .egy-cta-band-section > .elementor-container:hover {
    border-color: rgba(244, 180, 26, 0.65) !important;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.3) !important;
}

.elementor-23458 .egy-cta-heading h3,
.elementor-23458 .egy-cta-heading .elementor-heading-title {
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: -0.2px;
}

.elementor-23458 .egy-cta-text p {
    color: #d0e1f3 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    margin: 0 !important;
}

.elementor-23458 .egy-cta-btn .elementor-button,
.elementor-23458 .egy-cta-btn a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background-color: #F4B41A !important;
    color: #035292 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 13px 26px !important;
    border-radius: 8px !important;
    border: 2px solid #F4B41A !important;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(244, 180, 26, 0.3) !important;
    transition: all 250ms ease !important;
    cursor: pointer !important;
}

.elementor-23458 .egy-cta-btn .elementor-button:hover,
.elementor-23458 .egy-cta-btn .elementor-button:focus,
.elementor-23458 .egy-cta-btn a:hover,
.elementor-23458 .egy-cta-btn a:focus {
    background-color: #ffffff !important;
    color: #035292 !important;
    border-color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
}

/* -------------------------------------------------------------------------
   2. MAIN 4-COLUMN FOOTER (Section 2)
   ------------------------------------------------------------------------- */
.elementor-23458 > .elementor-section:nth-child(2),
.elementor-23458 .egy-main-footer-section {
    background-color: #035292 !important;
    padding: 35px 20px 40px 20px !important;
}

/* Column 1: Logo Badge */
.elementor-23458 .egy-logo-card {
    display: inline-block !important;
    background: #ffffff !important;
    padding: 10px 18px !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
    margin-bottom: 12px !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}
.elementor-23458 .egy-logo-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.22) !important;
}
.elementor-23458 .egy-logo-card img {
    display: block !important;
    max-width: 175px !important;
    height: auto !important;
}

.elementor-23458 .egy-footer-tagline {
    color: #F4B41A !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.4px !important;
    margin-bottom: 12px !important;
}

.elementor-23458 .egy-about-text,
.elementor-23458 .egy-about-text p {
    color: #dce8f5 !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
    margin-bottom: 16px !important;
}

/* Column Headings & Gold Underline */
.elementor-23458 .egy-col-heading h4,
.elementor-23458 .egy-col-heading .elementor-heading-title {
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    letter-spacing: 0.2px !important;
}

.elementor-23458 .elementor-widget-divider {
    margin-bottom: 12px !important;
}

/* Clean links (hide default checkmarks) */
.elementor-23458 .egy-clean-links .elementor-icon-list-icon {
    display: none !important;
}

/* Icon Lists / Navigation Links */
.elementor-23458 .elementor-widget-icon-list ul.elementor-icon-list-items {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.elementor-23458 .elementor-widget-icon-list li.elementor-icon-list-item {
    margin-bottom: 10px !important;
    line-height: 1.45 !important;
}

.elementor-23458 .elementor-widget-icon-list li.elementor-icon-list-item a {
    color: #dce8f5 !important;
    text-decoration: none !important;
    font-size: 13.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: color 250ms ease, transform 250ms ease !important;
}

.elementor-23458 .elementor-widget-icon-list li.elementor-icon-list-item a:hover,
.elementor-23458 .elementor-widget-icon-list li.elementor-icon-list-item a:focus {
    color: #F4B41A !important;
    transform: translateX(3px) !important;
}

/* Contact Column Icons */
.elementor-23458 .egy-contact-col .elementor-icon-list-icon {
    color: #F4B41A !important;
    font-size: 15px !important;
    width: 20px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

.elementor-23458 .egy-contact-col .elementor-icon-list-text {
    color: #dce8f5 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    transition: color 250ms ease !important;
}

.elementor-23458 .egy-contact-col a:hover .elementor-icon-list-text {
    color: #F4B41A !important;
}

/* Social Media Icons */
.elementor-23458 .egy-social-row {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    margin-top: 14px !important;
}

.elementor-23458 .egy-social-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transition: all 280ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.elementor-23458 .egy-social-icon svg {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    fill: currentColor !important;
    transition: fill 250ms ease !important;
}

.elementor-23458 .egy-social-icon:hover,
.elementor-23458 .egy-social-icon:focus {
    background: #F4B41A !important;
    border-color: #F4B41A !important;
    color: #035292 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(244, 180, 26, 0.4) !important;
}

.elementor-23458 .egy-social-icon:hover svg,
.elementor-23458 .egy-social-icon:focus svg {
    fill: #035292 !important;
}

/* -------------------------------------------------------------------------
   3. BOTTOM COPYRIGHT & LEGAL BAR (Section 3)
   ------------------------------------------------------------------------- */
.elementor-23458 > .elementor-section:last-child,
.elementor-23458 .egy-bottom-bar-section {
    background-color: #02365e !important;
    border-top: 1px solid rgba(244, 180, 26, 0.25) !important;
    padding: 16px 20px !important;
}

.elementor-23458 .egy-copyright-text {
    font-size: 13.5px !important;
    color: #dce8f5 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.elementor-23458 .egy-legal-links {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
}

.elementor-23458 .egy-legal-links a {
    color: #dce8f5 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    transition: color 250ms ease !important;
}

.elementor-23458 .egy-legal-links a:hover,
.elementor-23458 .egy-legal-links a:focus {
    color: #F4B41A !important;
}

.elementor-23458 .egy-legal-sep {
    color: rgba(244, 180, 26, 0.45) !important;
    font-size: 12px !important;
}

/* Floating WhatsApp button clearance on desktop */
@media (min-width: 768px) {
    .elementor-23458 > .elementor-section:last-child,
    .elementor-23458 .egy-bottom-bar-section {
        padding-right: 90px !important;
    }
}

/* -------------------------------------------------------------------------
   4. RESPONSIVE DESIGN
   ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    .elementor-23458 > .elementor-section:first-child > .elementor-container,
    .elementor-23458 .egy-cta-band-section > .elementor-container {
        padding: 22px 26px !important;
    }
    .elementor-23458 > .elementor-section:nth-child(2),
    .elementor-23458 .egy-main-footer-section {
        padding: 30px 20px 30px 20px !important;
    }
}

@media (max-width: 767px) {
    .elementor-23458 > .elementor-section:first-child > .elementor-container,
    .elementor-23458 .egy-cta-band-section > .elementor-container {
        flex-direction: column !important;
        text-align: center !important;
        padding: 22px 18px !important;
        gap: 14px !important;
    }
    .elementor-23458 .egy-cta-heading h3 {
        font-size: 19px !important;
    }
    .elementor-23458 .egy-cta-btn {
        width: 100% !important;
        text-align: center !important;
    }
    .elementor-23458 .egy-cta-btn a,
    .elementor-23458 .egy-cta-btn .elementor-button {
        width: 100% !important;
    }
    .elementor-23458 > .elementor-section:nth-child(2),
    .elementor-23458 .egy-main-footer-section {
        padding: 25px 16px 25px 16px !important;
    }
    .elementor-23458 > .elementor-section:last-child,
    .elementor-23458 .egy-bottom-bar-section {
        padding: 18px 16px 24px 16px !important;
        text-align: center !important;
    }
    .elementor-23458 .egy-copyright-text {
        text-align: center !important;
    }
    .elementor-23458 .egy-legal-links {
        justify-content: center !important;
        margin-top: 8px !important;
    }
}


/* =========================================================================
   FOOTER HOVER SCALE -- gap-fill after the enterprise footer redesign.
   The redesigned footer above already removes link underlines on hover
   (text-decoration:none), but it dropped the subtle scale-up that was
   explicitly requested alongside the colour change ("مش عايز underline
   ... عايز يتغير لونه بس ويبقي فيه scale"). Re-added here only, scoped to
   the footer, and placed after the redesign so it composes with it rather
   than fighting it. Nothing else from the previous footer pass is
   reinstated -- the newer redesign supersedes it.
   ========================================================================= */
.elementor-23458 .elementor-icon-list-item > a,
.elementor-23458 .egy-legal-links a {
	display: inline-block;
	transform-origin: left center;
	transition: transform 220ms ease, color 220ms ease;
}
.elementor-23458 .elementor-icon-list-item > a:hover,
.elementor-23458 .egy-legal-links a:hover {
	transform: scale(1.06);
}
.elementor-23458 .egy-social-icon {
	transition: transform 220ms ease, background-color 220ms ease,
		border-color 220ms ease;
}
.elementor-23458 .egy-social-icon:hover,
.elementor-23458 .egy-social-icon:focus-visible {
	transform: scale(1.12);
}
