/*
 * === DEWARDS STYLE COLOR OVERRIDE ===
 * Primary brand color : #135A54 (Dark Teal)
 * Replaces ALL traces of #FF6701 / #FE7433 (orange)
 * Loaded LAST — wins over main.css, plugins.css, etc.
 */

/* ═══════════════════════════════════════════════
   1. CSS VARIABLE OVERRIDE
   Overrides "--enpix-brand: #FF6701" in main.css
   ═══════════════════════════════════════════════ */
:root {
    --enpix-brand:              #135A54 !important;
    --enpix-hover:              #0d3d39 !important;
    --brand:                    #135A54;
    --brand-light:              #1a7a72;
    --brand-dark:               #0d3d39;
    --brand-rgb:                19, 90, 84;
    --brand-alpha-10:           rgba(19,90,84,0.10);
    --brand-alpha-20:           rgba(19,90,84,0.20);
    --brand-alpha-40:           rgba(19,90,84,0.40);
}

/* ═══════════════════════════════════════════════
   2. GLOBAL –– any element using var(--enpix-brand)
   ═══════════════════════════════════════════════ */
/* Selection highlight */
::selection { background: rgba(19,90,84,0.30) !important; color: #fff !important; }

/* Headings with <span> accent */
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span, p span {
    color: #135A54 !important;
}

/* ═══════════════════════════════════════════════
   3. BUTTONS & CTA
   ═══════════════════════════════════════════════ */
.enpix-cta,
.enpix-cta-rounded,
.enpix-button,
.banner-text a,
.enpix-btn,
.btn-primary,
.section-btn,
.submit-btn,
button[type="submit"],
.form-btn,
[class*="enpix-btn"],
.enpix-scroll-up {
    background-color: #135A54 !important;
    background:        #135A54 !important;
    border-color:      #135A54 !important;
    color:             #fff    !important;
}
.enpix-cta:hover,
.enpix-cta-rounded:hover,
.banner-text a:hover,
.enpix-btn:hover,
.btn-primary:hover,
.submit-btn:hover,
button[type="submit"]:hover {
    background-color: #0d3d39 !important;
    background:        #0d3d39 !important;
    border-color:      #0d3d39 !important;
    color:             #fff    !important;
}

/* Transparent variant */
.enpix-cta-transparent {
    background:   transparent !important;
    border-color: #135A54    !important;
    color:        #135A54    !important;
}
.enpix-cta-transparent:hover {
    background: #135A54 !important;
    color:      #fff    !important;
}

/* Light variant */
.enpix-cta-light {
    color:        #135A54 !important;
    border-color: #135A54 !important;
}
.enpix-cta-light:hover {
    background: #135A54 !important;
    color:      #fff    !important;
}

/* ═══════════════════════════════════════════════
   4. TEXT / ACCENT COLORS
   ═══════════════════════════════════════════════ */
.enpix-subtitle, .sub-title, .section-label,
.enpix-orange, .text-orange, .text-primary-color,
.active-nav-link, .current-menu-item > a,
a.active,
[class*="text-brand"],
[class*="color-brand"] {
    color: #135A54 !important;
}

/* Underline / decoration lines */
.enpix-subtitle::after,
.sub-title::after,
[class*="title-decoration"] {
    background: #135A54 !important;
}

/* Icon color utility classes */
.enpix-icon-color, .icon-color { color: #135A54 !important; }

/* Borders accent */
.enpix-border-accent, .accent-border { border-color: #135A54 !important; }

/* ═══════════════════════════════════════════════
   5. COUNTER / STATS NUMBERS
   ═══════════════════════════════════════════════ */
.counter-num,
.count-up,
[class*="counter"],
[class*="odometer"],
.fact-count,
.stat-number,
.fun-fact-number {
    color: #135A54 !important;
}

/* ═══════════════════════════════════════════════
   6. TAGS / BADGES
   ═══════════════════════════════════════════════ */
.enpix-tag, .tag, .badge-primary {
    background: rgba(19,90,84,0.10) !important;
    color:      #135A54            !important;
}

/* ═══════════════════════════════════════════════
   7. PROGRESS BARS & SKILL BARS
   ═══════════════════════════════════════════════ */
.progress-bar,
[class*="skillbar-bar"],
[class*="skill-bar"],
.enpix-progress-bar {
    background: #135A54 !important;
}

/* ═══════════════════════════════════════════════
   8. PAGINATION
   ═══════════════════════════════════════════════ */
.pagination a.active {
    background-color: #135A54 !important;
    border-color:     #135A54 !important;
    color:            #fff    !important;
}
.pagination a:hover:not(.active) { color: #135A54 !important; }

/* ═══════════════════════════════════════════════
   9. CARD / ITEM HOVER BORDERS
   ═══════════════════════════════════════════════ */
.enpix-service-card:hover,
.project-item:hover,
.service-item:hover,
.team-card:hover,
.blog-item:hover,
[class*="card-item"]:hover {
    border-color: rgba(19,90,84,0.40) !important;
    box-shadow:   0 20px 50px rgba(19,90,84,0.12) !important;
}

/* ═══════════════════════════════════════════════
   10. FOOTER
   ═══════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════
   10. MINIMAL FOOTER STYLES
   ═══════════════════════════════════════════════ */
.minimal-footer-title {
    color: var(--enpix-black-900) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 20px !important;
    font-family: var(--enpix-font-jost) !important;
    text-transform: uppercase !important;
}

.minimal-footer-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.minimal-footer-list li {
    margin-bottom: 12px !important;
}

.minimal-footer-list li a {
    color: var(--enpix-black-600) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    transition: color 0.3s ease !important;
    text-decoration: none !important;
}

.minimal-footer-list li a:hover {
    color: #135A54 !important;
}

.footer-bottom-minimal {
    padding: 0 0 50px 0 !important;
    border-top: 1px solid rgba(0,0,0,0.03) !important;
}

@media (max-width: 991px) {
    .minimal-footer-title {
        margin-top: 20px !important;
    }
}

/* ═══════════════════════════════════════════════
   10.5 FOOTER & WIDGETS (Dark Theme Override)
   ═══════════════════════════════════════════════ */
.footer-dark-menu a:hover {
    color: var(--enpix-brand) !important;
    padding-left: 5px;
}

.floating-whatsapp {
    position: fixed;
    bottom: 30px;
    left: 30px;
    width: 60px;
    height: 60px;
    background-color: #25D366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    z-index: 999;
    transition: all 0.3s ease;
}
.floating-whatsapp:hover {
    background-color: #1ebe57;
    color: #fff;
    transform: scale(1.1);
}

.enpix-scroll-up-custom {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: #135A54 !important;
    color: #fff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    z-index: 998;
    transition: all 0.3s ease;
    border: none !important;
    opacity: 0;
    visibility: hidden;
}
.enpix-scroll-up-custom.show {
    opacity: 1;
    visibility: visible;
}
.enpix-scroll-up-custom:hover {
    background-color: #0d3d39 !important;
    transform: translateY(-3px);
}

/* ═══════════════════════════════════════════════
   11. SCROLL-UP BUTTON
   ═══════════════════════════════════════════════ */
.enpix-scroll-up,
[class*="scroll-top"],
[class*="back-to-top"] {
    background:   #135A54 !important;
    border-color: #135A54 !important;
    color:        #fff    !important;
}

/* ═══════════════════════════════════════════════
   12. SPLIDE / SLIDER ARROWS
   ═══════════════════════════════════════════════ */
.splide__arrow:hover {
    background:   #135A54 !important;
    border-color: #135A54 !important;
}

/* ═══════════════════════════════════════════════
   13. FORM FOCUS
   ═══════════════════════════════════════════════ */
input:focus, textarea:focus, select:focus, .form-control:focus {
    border-color: #135A54                     !important;
    box-shadow:   0 0 0 3px rgba(19,90,84,0.15) !important;
    outline:      none                         !important;
}

/* ═══════════════════════════════════════════════
   14. SCROLLBAR
   ═══════════════════════════════════════════════ */
::-webkit-scrollbar-thumb { background: #135A54 !important; }

/* ═══════════════════════════════════════════════
   15. SWEETALERT
   ═══════════════════════════════════════════════ */
.swal2-confirm {
    background:  #135A54 !important;
    box-shadow:  0 4px 16px rgba(19,90,84,0.30) !important;
}

/* ═══════════════════════════════════════════════
   16. MEGA NAVBAR — Nav links
   ═══════════════════════════════════════════════ */
.mnav-cta a {
    background: #135A54 !important;
    box-shadow: 0 4px 16px rgba(19,90,84,0.30) !important;
}
.mnav-cta a:hover {
    background: #0d3d39 !important;
    box-shadow: 0 8px 24px rgba(19,90,84,0.45) !important;
}
.mnav-links > li > a:hover,
.mnav-links > li.has-drop:hover > a {
    color:      #135A54                    !important;
    background: rgba(19,90,84,0.07)        !important;
}
.mnav-links > li.has-drop:hover > a .drop-arrow { color: #135A54 !important; }

/* ═══════════════════════════════════════════════
   17. MEGA PANEL — Hizmetlerimiz cards (Dewards style)
   ═══════════════════════════════════════════════ */
/* Default: grey card, no border, grey icon */
.mp-service-card {
    border: none !important;
    background: #f4f5f7 !important;
}
/* Hover: icon turns teal, card lifts */
.mp-service-card:hover {
    background:  #eef6f5                           !important;
    box-shadow:  0 10px 28px rgba(19,90,84,0.10)   !important;
    border:      none                              !important;
}
.mp-service-card:hover .mp-service-icon {
    background: transparent !important;
}
.mp-service-card:hover .mp-service-icon i,
.mp-service-card:hover i {
    color:                  #135A54 !important;
    fill:                   #135A54 !important;
    -webkit-text-fill-color: #135A54 !important;
}
.mp-service-card:hover .mp-service-name { color: #135A54 !important; }

/* ═══════════════════════════════════════════════
   18. MEGA PANEL — link list & simple dropdown
   ═══════════════════════════════════════════════ */
.mp-link-list li a:hover { background: rgba(19,90,84,0.06) !important; color: #135A54 !important; }
.mp-link-list li a:hover i { color: #135A54 !important; }
.simple-drop li a:hover { background: rgba(19,90,84,0.06) !important; color: #135A54 !important; }

/* ═══════════════════════════════════════════════
   19. BLANKET — catch any remaining inline / hardcoded orange
       Selects anything that still renders with the original
       --enpix-brand variable (FF6701 / FE7433 palette)
   ═══════════════════════════════════════════════ */
[style*="FF6701"],
[style*="FE7433"],
[style*="fe7433"],
[style*="ff6701"] {
    color:            #135A54 !important;
    background-color: #135A54 !important;
    border-color:     #135A54 !important;
}

/* ═══════════════════════════════════════════════
   20. BANNER / SLIDER — Referans tasarıma uygun
       Sol: başlık + açıklama + buton
       Sağ: dikdörtgen, kırpılmış, gölgeli görsel
   ═══════════════════════════════════════════════ */

/* Slider arka planı — açık gri */
.banner-area {
    background: #f0f2f5 !important;
    padding: 50px 0 50px 0 !important;
}

/* Eski bg pattern animasyonunu kapat */
.banner-area:before {
    display: none !important;
    content: "" !important;
    animation: none !important;
}

/* Sol metin alanı — dikey ortalama */
.banner-area .d-flex.align-items-center.h-100 {
    min-height: 400px;
}

/* Başlık */
.banner-text h1 {
    font-size: 2.8em !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    color: #1a1a2e !important;
    letter-spacing: -0.5px;
}

/* Açıklama */
.banner-text p {
    color: #555 !important;
    font-size: 1.05em !important;
    line-height: 1.7 !important;
    margin-top: 24px !important;
    max-width: 440px;
}

/* CTA Butonu */
.banner-text a {
    display: inline-block !important;
    margin-top: 36px !important;
    padding: 16px 32px !important;
    background: #135A54 !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-size: 1em !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    box-shadow: 0 4px 18px rgba(19,90,84,0.25) !important;
    transition: background 0.2s, box-shadow 0.2s !important;
}
.banner-text a:hover {
    background: #0d3d39 !important;
    box-shadow: 0 6px 24px rgba(19,90,84,0.35) !important;
}

/* SVG dekoratif şekilleri gizle — sade görünüm */
.banner-area img.path-svg,
.banner-area img.rectangle-svg,
.banner-area img.oval-svg,
.banner-area img.fill-255,
.banner-image-svg {
    display: none !important;
}

/* ——— Sağ taraf: görsel kutusu ——— */
.banner-image-area {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    padding: 20px 0 !important;
}

/* Görsel — dikdörtgen kart */
.banner-image-area img.banner-image {
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    height: 400px !important;
    object-fit: cover !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.14) !important;
    margin: 0 auto !important;
}

/* Responsive — tablet */
@media (max-width: 992px) {
    .banner-image-area img.banner-image {
        height: 320px !important;
        max-width: 100% !important;
    }
    .banner-text h1 {
        font-size: 2.1em !important;
    }
}

/* Responsive — mobil */
@media (max-width: 768px) {
    .banner-area {
        padding: 50px 0 40px !important;
    }
    .banner-image-area img.banner-image {
        height: 240px !important;
        border-radius: 12px !important;
    }
    .banner-text h1 {
        font-size: 1.7em !important;
        line-height: 1.25 !important;
    }
}
/* ═══════════════════════════════════════════════
   21. BRANDS SLIDER (Targeted Alignment)
   ═══════════════════════════════════════════════ */
.brands-logo-area {
    background: #fff !important;
    padding: 35px 0 35px 0 !important;
    position: relative;
    z-index: 10;
}
.brands-logo-area .splide__slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.brands-logo-area .splide__slide img {
    max-height: 35px !important;
    width: auto !important;
    filter: none !important;
    opacity: 1 !important;
    transition: transform 0.3s ease !important;
}
.brands-logo-area .splide__slide img:hover {
    transform: scale(1.15) !important;
}

/* ═══════════════════════════════════════════════
   23. SERVICES CARD EQUAL HEIGHT & HOVER
   ═══════════════════════════════════════════════ */
.services-area .row > [class*="col-"] {
    display: flex;
}

.service-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Horizontally center contents */
    text-align: center !important;  /* Center text content */
    width: 100% !important;
    height: 100% !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    padding: 40px 30px !important;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}

.service-content:hover {
    transform: translateY(-10px) scale(1.03) !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.08) !important;
    z-index: 2;
}

.service-content h3 {
    margin-top: 20px !important;
    min-height: 2.4em; /* Headlines same height across cards */
}

.service-content p {
    flex-grow: 1 !important; /* Pushes everything below it down */
    margin-bottom: 25px !important;
}

.service-content > a {
    margin-top: auto !important; /* Aligns arrows to the absolute bottom of the card */
    display: inline-block;
}

.service-content svg stroke {
    transition: all 0.3s ease;
}

.service-content:hover svg stroke {
    stroke: #135A54; /* Brand color on hover */
}

/* ═══════════════════════════════════════════════
   24. BRANDING AREA DECORATIVE SHAPES
   ═══════════════════════════════════════════════ */
.branding-image-container .branding-image-shape {
    display: none !important; /* Sol tarafta görünmemesi garantiye alındı */
}

.branding-image-shape.branding-shape-right {
    display: block !important;
    position: absolute !important;
    top: -50px !important;
    right: -20px !important;
    width: 300px !important;
    z-index: 0;
    pointer-events: none;
    opacity: 0.9 !important;
}