/* GENEL */
:root { --bs-btn-color: #a03516; }
body { font-family: "Red Hat Display", sans-serif; color: #272727; scroll-behavior: smooth; }
a { text-decoration: none; transition: all 0.3s ease; color: currentColor; }
.form-check-input:checked { background-color: #6f6f6f; border-color: #aeaeae; }

/* Ürün Ana Görseli İçin Taşıyıcı Kutu */
.zoom-container { position: relative; overflow: hidden; cursor: crosshair; display: block; width: 100%; }

/* Orijinal Görsel (Normal Hal) */
.zoom-container img#productMainImg { width: 100%; height: auto; object-fit: contain; transition: transform 0.1s ease-out; transform-origin: center center; }
.sticky-top { z-index: 0; }
.bg-primary { background-color: #a03516 !important; border:1px #a03516 !important; }
.rounded-pill { font-weight: bold; color: #fff; border: 1px solid #fff; }
.btn-edit-modern { background-color: rgba(245, 130, 32, 0.1); color: #a03516; border: 1px solid rgba(245, 130, 32, 0.25); font-weight: 600; transition: all 0.25s ease-in-out; display: inline-flex; align-items: center; gap: 4px; }
.btn-edit-modern:hover { background-color: #a03516 !important; color: #ffffff; border-color: #a03516; transform: translateY(-1px); box-shadow: 0 4px 8px rgba(245, 130, 32, 0.2); }
.fw-bold { color: #fff; }
.fw-boldB { color: #000; }
.rich-text-area ul { padding-left: 20px; }
.rich-text-area li { margin-bottom: 10px; }
.system-hero::before { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(180deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 100%); z-index:1; }

/* PDF Linkleri Hover Efekti */  
.transition-hover { transition: all 0.3s ease; }
.transition-hover:hover { transform: translateY(-5px); box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; }
.system-features-list ul { padding-left: 20px; list-style-type: disc; }
.system-features-list li { margin-bottom: 10px; color: #555; }
.doc-link-hover { transition: all 0.2s ease; }
.doc-link-hover:hover { border-color: #a03516 !important; box-shadow: 0 .5rem 1rem rgba(0,0,0,.08)!important; }
.doc-link-hover:hover svg { fill: #a03516 !important; }
.doc-link-hover:hover span.fw-bold { color: #a03516 !important; }
.text-muted { --bs-text-opacity: 1; color: #6f6f6f !important; font-size: 16px; }

/* Product Page Styles */
.product-detail-wrapper { padding: 30px 0; }
.product-gallery { position: sticky; top: 100px; }
.mb--4 { margin-bottom: -1.5rem; }
.product-main-slider { background: #fff; border-radius: 20px; padding: 40px; margin-bottom: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); overflow: hidden; }
.product-main-slider .swiper-slide { display: flex; align-items: center; justify-content: center; }
.product-main-slider .swiper-slide img { width: 100%; height: auto; object-fit: contain; cursor: zoom-in; }
.product-main-slider .swiper-slide img:focus-visible { outline: none; }
.product-thumb-slider { margin-top: 15px; }
header .navbar .relative.px-4 { padding: 0 !important; }
.product-thumb-slider .swiper-slide { width: 25%; height: auto; cursor: pointer; border-radius: 10px; overflow: hidden; padding: 10px; background: #fff; border: 1px solid transparent; transition: all 0.3s ease; }
.product-thumb-slider .swiper-wrapper { gap: 1rem; }
.product-thumb-slider .swiper-slide-thumb-active { border-color: var(--primary-color); }
.product-thumb-slider .swiper-slide img { width: 100%; height: auto; object-fit: contain; }
.product-main-image { background: #fff; border-radius: 20px; padding: 40px; margin-bottom: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); }
.product-main-image img { width: 100%; height: auto; object-fit: contain; }
.product-info-column .breadcrumb { margin-bottom: 15px; font-size: 14px; color: #666; }
.product-info-column .product-title { font-size: 36px; font-weight: 700; margin-bottom: 15px; color: var(--primary-color); }
.product-info-column .price-wrapper { font-size: 28px; font-weight: 700; color: #333; margin-bottom: 25px; }
.badge { font-size: 11px !important; vertical-align: middle; color:#fff !important; padding:6px 10px !important; background:#6f6f6f !important; }
.product-info-column .price-wrapper span { font-size: 0.85em; font-weight: 600; color: #9e9e9e; padding: 3px; }
.product-meta { border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding: 20px 0; margin-bottom: 30px; }
.product-meta-item { display: flex; margin-bottom: 10px; font-size: 15px; }
.product-meta-item strong { width: 120px; color: #333; }
.variation-select { margin-bottom: 30px; }
.variation-select label { display: block; font-weight: 600; margin-bottom: 10px; color: #333; }
.variation-select select { width: 100%; padding: 12px 20px; border: 1px solid #ddd; border-radius: 10px; outline: none; transition: border-color 0.3s; }
.variation-select select:focus { border-color: var(--primary-color); }
.quantity-add-to-cart { display: flex; gap: 15px; margin-bottom: 40px; }
.quantity-input { display: flex; align-items: center; border: 1px solid #ddd; border-radius: 10px; overflow: hidden; }
.quantity-input button { background: #f8f8f8; border: none; width: 40px; height: 50px; font-size: 20px; transition: background 0.3s; }
.trade-upgrade-banner { background: linear-gradient(135deg, #f37021 0%, #d45d12 100%); color: white; border-radius: 15px; padding: 30px; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.trade-upgrade-banner h4 { font-weight: 700; margin-bottom: 15px; }
.trade-upgrade-banner .btn-white { background: white; color: #f37021; font-weight: 600; border-radius: 50px; padding: 10px 25px; transition: 0.3s; }
.trade-upgrade-banner .btn-white:hover { background: #f8f9fa; transform: translateY(-2px); }
.quantity-input button:hover { background: #eee; }
.quantity-input input { width: 60px; height: 50px; text-align: center; border: none; border-left: 1px solid #ddd; border-right: 1px solid #ddd; background: #fff; outline: none; }
.product-tabs-wrapper { margin-top: 60px; }
.product-tabs-nav { display: flex; gap: 40px; border-bottom: 1px solid #eee; margin-bottom: 30px; }
.product-tab-link { padding-bottom: 15px; font-weight: 600; color: #999; cursor: pointer; position: relative; transition: color 0.3s; }
.product-tab-link.active { color: var(--primary-color); }
.product-tab-link.active::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 2px; background: var(--primary-color); }
.tab-content-item { display: none; animation: fadeIn 0.5s ease; }
.tab-content-item.active { display: block; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

ul { list-style: none; padding: 0; margin: 0; }
ul li { list-style: none; }
.mask { position: fixed; background: rgba(0, 0, 0, .5); width: 100%; height: 100vh; left: 0; top: 0; z-index: 3; }
.pl-0 { padding-left: 0 !important; }
.bg-success { background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 60%, #3a2800 100%); }
.bg-grey { background-color: #f5f5f5 !important; }
input::-webkit-search-cancel-button { display: none; outline: none; }
input:focus-visible { outline: none; }
input:focus { outline: none; box-shadow: none; }
.contact-actions .phone-float { z-index: 9999; background: #2E55AF; border-radius: 50px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: box-shadow 0.2s; width: 56px; height: 56px; position: fixed; right: 20px; bottom: 20px; fill: #fff; }
.contact-actions .phone-float span { display: none; }
.contact-actions .phone-float svg { width: 32px; }
.contact-actions .whatsapp-float { position: fixed; right: 90px; bottom: 20px; z-index: 9999; background: #25d366; border-radius: 50px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: box-shadow 0.2s; width: 56px; height: 56px; }
.contact-actions .whatsapp-float svg { width: 32px; height: 32px; fill: #fff; display: block; }
.contact-actions .whatsapp-float span { display: none; color: #fff; font-weight: 500; margin-left: 10px; font-size: 16px; }
.contact-actions .whatsapp-ribbon { position: absolute; top: -7px; right: -7px; background: #d61617; color: #fff; font-size: 12px !important; margin-left: 0 !important; font-weight: bold; border-radius: 12px; padding: 2px 7px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); z-index: 2; display: none; animation: fadeInRibbon 0.5s; }
.form-control:focus { border-color: transparent; border: 0; box-shadow: none; }
.py-set { padding: 4rem 0; }
.primary-button { white-space: nowrap; color: #fff; background-color: #a03516; padding: 14px 25px; border-radius: 10px; display: inline-block; border: 0; }
.primary-button img { width: 20px; height: 20px; fill: #fff; margin-right: 7px; margin-top: -4px; }
.primary-button:hover { transform: scale(1.04); transition: all ease .3s; color: #fff; background-color: #a14127d7; }
section { width: 100%; overflow: hidden; }
/* GENEL END */

/* HEADER */
/* ================================================
   TWO-ROW HEADER LAYOUT
   ================================================ */
.header-space { height: 138px; }
header { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; background-color: #ffffff; transition: box-shadow 0.3s ease; }
header.set-header { box-shadow: 0 6px 30px rgba(0, 0, 0, 0.08); }

/* ---- TOP ROW ---- */
.header-top { height: 90px; border-bottom: 1px solid rgba(0, 0, 0, 0.06); display: flex; align-items: center; }
.header-top-inner { display: flex; align-items: center; gap: 20px; width: 100%; }
.header-top .brand-logo { display: flex; align-items: center; flex-shrink: 0; text-decoration: none; }
.header-top .brand-logo img { height: 80px; width: auto; }

/* Search Bar */
.header-search-main { flex: 1; display: flex; align-items: center; background: #f4f4f4; border-radius: 10px; padding: 0 8px 0 16px; height: 44px; gap: 10px; border: 1.5px solid transparent; transition: border-color 0.2s ease, background 0.2s ease; }
.header-search-main:focus-within { border-color: #a03516; background: #fff; }
.header-search-main .search-icon-left { width: 17px; height: 17px; color: #aaa; flex-shrink: 0; }
.header-search-input { flex: 1; border: none; background: transparent; font-size: 14px; color: #1a1a1a; outline: none; font-family: 'Red Hat Display', sans-serif; font-weight: 400; }
.header-search-input::placeholder { color: #bbb; font-weight: 400; }
.header-search-submit { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; background: #a03516; border-radius: 8px; flex-shrink: 0; text-decoration: none; transition: background 0.2s ease; }
.header-search-submit:hover { background: #a03416a9; }
.header-search-submit svg { width: 15px; height: 15px; color: #bdbdbd; fill: #c0c0c0; }

/* Top-row action icons */
.header-top-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }

/* ---- NAV BAR ---- */
.header-nav-bar { height: 48px; background: #a03516; border-bottom: none; position: relative; }
.header-nav-inner { display: flex; align-items: center; justify-content: space-between; height: 48px; gap: 0; }
.header-nav-inner .navbar-nav { display: flex; align-items: center; flex-direction: row; list-style: none; padding: 0; margin: 0; gap: 0; height: 100%; }
.header-nav-inner .navbar-nav > li > .nav-link { color: #fff !important; font-family: 'Red Hat Display', sans-serif; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px; padding: 0 14px !important; height: 48px; display: flex; align-items: center; position: relative; transition: opacity 0.2s ease; white-space: nowrap; }
.header-nav-inner .navbar-nav > li:first-child a { padding: 5px 10px; }
.header-nav-inner .navbar-nav > li > .nav-link::after { content: ''; position: absolute; bottom: 0; left: 14px; right: 14px; height: 2px; background: #fff; width: 0; transition: width 0.25s ease; }
.header-nav-inner .navbar-nav > li > .nav-link:hover { color: #fff !important; opacity: 0.8; }
.header-nav-inner .navbar-nav > li > .nav-link:hover::after, .header-nav-inner .navbar-nav > li > .nav-link.active::after { width: calc(100% - 28px); }
.header-nav-inner .navbar-nav > li > .nav-link.active { color: #fff !important; }

/* Trade Account in nav bar */
.header-nav-bar .trade-account-btn { background: #000; border-radius: 8px; padding: 8px 16px !important; transition: all 0.25s ease; white-space: nowrap; height: 34px; flex-shrink: 0; }
.header-nav-bar .trade-account-btn span { font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; letter-spacing: 0.3px; }
.header-nav-bar .trade-account-btn svg { color: #fff; }
.header-nav-bar .trade-account-btn:hover { background: #333; transform: translateY(-1px); }
.nav-chevron { display: inline-block; vertical-align: middle; margin-left: 3px; margin-top: -1px; transition: transform 0.2s ease; flex-shrink: 0; }
.mega-dropdown:hover .nav-chevron, .nav-simple-dropdown:hover .nav-chevron { transform: rotate(180deg); }
.nav-right-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; border: 1px solid #000; border-radius: 6px; padding: 7px 10px; background-color: black; color: #fff; margin-bottom: 2px; }
.nav-right-actions a:hover { color: #9d9d9d; }
.nav-blog-link { font-family: 'Red Hat Display', sans-serif; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px; color: #272727; text-decoration: none; padding: 0 4px; white-space: nowrap; transition: opacity 0.2s; }
.nav-blog-link:hover { color: #fff; opacity: 0.8; }
.nav-simple-dropdown { position: relative; }
.nav-simple-menu { position: absolute; top: 100%; left: 0; min-width: 280px; background: #fff; list-style: none; padding: 6px 0; margin: 0; box-shadow: 0 8px 24px rgba(0,0,0,0.10); border-radius: 0 0 8px 8px; border-top: 3px solid #a03516; opacity: 0; visibility: hidden; transition: opacity 0.18s ease, visibility 0.18s ease; z-index: 1000; }
.nav-simple-dropdown:hover .nav-simple-menu { opacity: 1; visibility: visible; }
.nav-simple-menu li a { display: block; padding: 9px 18px; font-size: 13px; font-weight: 500; color: #1a1a1a; text-decoration: none; white-space: nowrap; transition: background 0.15s, color 0.15s; }
.nav-simple-menu li a:hover { background: #fff6ed; color: #a03516; }

/* Mobile Toggle */
header .sidenav-toogle { font-size: 24px; color: #1a1a1a; cursor: pointer; display: none; flex-shrink: 0; }

/* Dropdowns (Bootstrap compatibility) */
.dropdown-menu { border: none; border-radius: 0; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); padding: .5rem .25rem; margin-top: 0; background: #fff; display: block; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease; }
.nav-item.dropdown:hover .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dropdown-item { font-size: 14px; color: #555; padding: 8px 15px; font-weight: 400; transition: all 0.2s ease; border-radius: 4px; }
.dropdown-item:hover { color: #a03516; background-color: #f9f9f9; }

/* Sidebar (Mobile) */
header .side-nav { position: fixed; top: 0; left: -320px; width: 300px; height: 100vh; background: #fff; z-index: 1000; box-shadow: 5px 0 20px rgba(0, 0, 0, 0.1); transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1); overflow-y: auto; padding-bottom: 2rem; }
header .side-nav.shown { left: 0; }
header .side-nav>ul>li { border-bottom: 1px solid #f5f5f5; }
header .side-nav>ul>li a { display: block; padding: 15px 20px; font-size: 15px; font-weight: 500; color: #333; }
/* HEADER END */

/* HERO */
.hero-slider-section { position: relative; width: 100%; overflow: hidden; }
.hero-slider-section .swiper-slide { position: relative; }
.slide-img-wrapper { position: relative; width: 100%; height: 500px; overflow: hidden; }
.slide-img-wrapper .slide-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.hero-content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; z-index: 2; }
.hero-badge { display: inline-block; background-color: #7070709c; color: #fff; padding: 4px 20px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; border-radius: 4px; }
.hero-cta-wrapper { display: flex; align-items: center; gap: 1.5rem; }
.hero-content .text-box { max-width: 650px; padding: 0; }
.hero-content .text-box .slide-title { color: #fff; font-size: 62px; font-weight: 900; margin-bottom: 1.5rem; line-height: 1.1; letter-spacing: -1px; text-shadow: 0px 0px 15px rgb(0 0 0 / 41%); }
.hero-content .text-box .slide-title .highlight-text { position: relative; display: inline-block; font-weight: 900; }
.hero-content .text-box .slide-title .highlight-text::after { display: none; }
.hero-content .text-box .slide-text { font-size: 18px; color: #1a1a1a; font-weight: 400; margin-bottom: 2rem; line-height: 1.6; opacity: 0.8; max-width: 600px; background:#ffffff99; border-radius: 10px; padding: 20px; }
.hero-content .text-box .hero-cta-button { background-color: #6f6f6f; color: #fff; padding: 8px 20px; border-radius: 6px; font-size: 15px; font-weight: 600; text-transform: capitalize; letter-spacing: 0; transition: all 0.3s ease; display: inline-block; border: 2px solid #6f6f6f; }
.hero-content .text-box .hero-cta-button:hover { background-color: #5f5e5e; color: #1a1a1a; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); }
.hero-swiper-next { color: #fff; width: 50px; height: 50px; background-color: rgba(255, 255, 255, 0.2); border-radius: 50%; transition: all 0.3s ease; z-index: 10; }
.hero-swiper-next:hover { background-color: rgba(255, 255, 255, 0.3); }
.hero-swiper-next::after { font-size: 20px; font-weight: bold; }
.hero-swiper-prev { color: #fff; width: 50px; height: 50px; background-color: rgba(255, 255, 255, 0.2); border-radius: 50%; transition: all 0.3s ease; z-index: 10; }
.hero-swiper-prev:hover { background-color: rgba(255, 255, 255, 0.3); }
.hero-swiper-prev::after { font-size: 20px; font-weight: bold; }

/* Hero Slide Nav Strip */
.hero-slide-nav { background: #1a1a1a; position: relative; z-index: 5; }
.hero-slide-nav-inner { display: flex; align-items: stretch; }
.hero-slide-tab { flex: 1; display: flex; align-items: center; gap: 10px; padding: 0 22px; height: 50px; background: transparent; border: none; border-right: 1px solid rgba(255, 255, 255, 0.08); cursor: pointer; position: relative; overflow: hidden; transition: background 0.2s ease; text-align: left; }
.hero-slide-tab:last-child { border-right: none; }
.hero-slide-tab:hover { background: rgba(255, 255, 255, 0.05); }
.tab-dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, 0.25); flex-shrink: 0; transition: background 0.25s ease, transform 0.25s ease; }
.hero-slide-tab.active .tab-dot { background: #a03516; transform: scale(1.3); }
.tab-label { font-size: 11px; font-weight: 700; color: rgba(255, 255, 255, 0.4); text-transform: uppercase; letter-spacing: 1.4px; transition: color 0.25s ease; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hero-slide-tab.active .tab-label { color: #ffffff; }
.tab-progress { position: absolute; bottom: 0; left: 0; height: 3px; background: #a03516; width: 0%; }

/* ================================================
   PROMO BANNERS
   ================================================ */
.promo-banners { padding: 36px 0 0; background: #fff; }
.promo-banners-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.promo-banner { position: relative; display: block; overflow: hidden; border-radius: 14px; min-height: 240px; text-decoration: none; cursor: pointer; }
.promo-banner--wide { grid-column: 1 / -1; min-height: 160px; }
.promo-banner-img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.45s ease; position: absolute; inset: 0; }
.promo-banner:hover .promo-banner-img { transform: scale(1.05); }
.promo-banner-overlay { position: absolute; inset: 0; z-index: 1; }
.promo-banner--navy .promo-banner-overlay { background: linear-gradient(110deg, #1e3a6e 40%, rgba(30, 58, 110, 0.6) 100%); }
.promo-banner--orange .promo-banner-overlay { background: linear-gradient(110deg, #c96a00 40%, rgba(255, 142, 1, 0.65) 100%); }
.promo-banner-overlay--wide { background: linear-gradient(100deg, #0f1f3d 30%, rgba(15, 31, 61, 0.75) 65%, rgba(15, 31, 61, 0.2) 100%); }
.promo-banner-content { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 32px 36px; height: 100%; min-height: inherit; }
.promo-banner-content--wide { flex-direction: row; align-items: center; gap: 40px; padding: 28px 40px; }
.promo-banner-title { font-size: 22px; font-weight: 800; color: #fff; line-height: 1.25; margin: 0 0 20px; max-width: 240px; }
.promo-banner-title--wide { font-size: 32px; font-weight: 900; letter-spacing: -0.5px; max-width: none; margin: 0 0 6px; white-space: nowrap; }
.promo-banner-title--wide span { color: #a03516; }
.promo-banner-subtitle { font-size: 13px; color: rgba(255, 255, 255, 0.65); font-weight: 400; margin: 0; line-height: 1.5; }
.promo-banner-wide-text { flex: 1; }
.promo-banner-btn { display: inline-flex; align-items: center; gap: 7px; padding: 11px 22px; background: #fff; color: #1a1a1a; font-size: 11px; font-weight: 800; border-radius: 8px; text-decoration: none; text-transform: uppercase; letter-spacing: 0.8px; align-self: flex-start; white-space: nowrap; opacity: 0; transform: translateY(10px); transition: opacity 0.22s ease, transform 0.22s ease, background 0.2s ease; flex-shrink: 0; }
.promo-banner:hover .promo-banner-btn { opacity: 1; transform: translateY(0); }
.promo-banner-btn:hover { background: #a03516; color: #fff; }
.promo-banner-btn--wide { padding: 13px 26px; font-size: 12px; }

@media (max-width: 768px) {
    .promo-banners-grid { grid-template-columns: 1fr; }
    .promo-banner--wide { grid-column: auto; min-height: 180px; }
    .promo-banner-content--wide { flex-direction: column; align-items: flex-start; gap: 16px; }
    .promo-banner-title--wide { font-size: 24px; white-space: normal; }
}
/* HERO END */

/* PAGE HERO */
.page-hero { height: 350px; background-image: url('../images/page-hero-bg.png'); background-size: cover; background-position: center; background-repeat: no-repeat; display: flex; align-items: center; color: #fff; position: relative; z-index: 1; }
.page-hero::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 100%); z-index: -1; }
.page-hero h1 { font-size: 48px; font-weight: 800; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px; }
.page-hero .desc { font-size: 18px; max-width: 600px; opacity: 0.9; margin: 0; line-height: 1.5; }

/* ABOUT US SECTION */
.about-us { background-color: #fff; position: relative; overflow: hidden; }
.sidebar-title { font-size: 20px; font-weight: 700; color: #1a1a1a; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 2px solid #a03516; display: inline-block; }
.sidebar-nav .nav-list { display: flex; flex-direction: column; gap: 10px; }
.sidebar-nav .nav-item { display: block; padding: 12px 20px; background-color: #f8f9fa; border-radius: 8px; color: #444; font-weight: 500; transition: all 0.3s ease; border: 1px solid transparent; }
.sidebar-nav .nav-item:hover { background-color: #fff; border-color: #a03516; color: #a03516; transform: translateX(5px); }
.sidebar-nav .nav-item.active { background-color: #a03516; color: #fff; border-color: #a03516; box-shadow: 0 4px 12px rgba(255, 142, 1, 0.2); }
.about-main-content .content-title { font-size: 28px; font-weight: 700; color: #1a1a1a; margin-bottom: 10px; position: relative; }
.btn-outline-brand { color: #a03516; border-color: #a03516; background: transparent; transition: all 0.3s ease; }
.btn-outline-brand:hover { background-color: #a03516; color: #fff; border-color: #a03516; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(255, 142, 1, 0.2); }
.btn-outline-brand.btn-sm { padding: 0.4rem 1.2rem; font-size: 0.85rem; }
.btn-orange { background-color:#a03516; border-color: #a03516; }
.btn-orange:hover { background-color:#a03416a9; border-color: #a03516; }
.about-main-content .text-primary { color: #a03516 !important; }
.about-main-content .text-primary svg { width: 50px; height: 50px; stroke: #fff; }
.about-main-content .content-body p { font-size: 17px; line-height: 1.8; color: #555; margin-bottom: 20px; }
.highlight-quote { background: linear-gradient(135deg, #1a1a1a 0%, #2c2c2c 100%); color: #fff; border-left: 5px solid #a03516; }
.highlight-quote h3 { font-weight: 400; line-height: 1.5; color: #fff; }

@media (max-width: 991px) {
    .sidebar-nav-wrapper { position: static; margin-bottom: 40px; }
}

/* SERVICES SLIDER */
.services-slider-section { background-color: #faf8f5; }
.services-slider-section .about-content { padding-right: 2rem; }
.services-slider-section .about-subtitle { font-size: 14px; font-weight: 500; color: #a03516; margin-bottom: 0.5rem; text-transform: uppercase; letter-spacing: 1px; }
.services-slider-section .about-title { font-size: 36px; font-weight: 700; color: #272727; margin-bottom: 1.5rem; line-height: 1.2; }
.services-slider-section .about-content p { font-size: 16px; color: #555; line-height: 1.8; margin-bottom: 1rem; font-weight: 300; }
.services-slider-section .about-content p strong { color: #272727; font-weight: 500; }
.services-slider-wrapper { position: relative; padding: 0 50px; }
.services-swiper .swiper-wrapper { align-items: stretch; }
.services-swiper .swiper-slide { height: auto; }
.service-card { background-color: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); transition: all 0.3s ease; height: 100%; display: flex; flex-direction: column; }
.service-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); }
.service-card-image { width: 100%; height: 140px; overflow: hidden; border-radius: 12px 12px 0 0; }
.service-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.service-card:hover .service-card-image img { transform: scale(1.05); }
.service-card-content { padding: 1rem; text-align: center; display: flex; flex-direction: column; gap: 0.75rem; align-items: center; }
.service-card-title { font-size: 15px; font-weight: 600; color: #1a1a1a; margin: 0; line-height: 1.3; }
.service-card-button { display: inline-block; padding: 6px 18px; border: 1.5px solid #a03516; border-radius: 18px; color: #a03516; text-decoration: none; font-weight: 500; font-size: 12px; transition: all 0.3s ease; }
.service-card-button:hover { background-color: #a03516; color: #fff; border-color: #a03516; }
.services-next { width: 38px; height: 38px; background-color: #fff; border: 1.5px solid #ddd; border-radius: 50%; color: #333; transition: all 0.3s ease; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); }
.services-next:hover { background-color: #a03516; border-color: #a03516; color: #fff; box-shadow: 0 4px 10px rgba(67, 147, 74, 0.25); }
.services-prev { left: 0; }
.services-next { right: 0; }
.services-next::after { font-size: 16px; font-weight: bold; }
/* SERVICES SLIDER END */

/* Page Banner - Alt Sayfa Hero */
.page-banner { position: relative; width: 100%; height: 500px; overflow: hidden; }
.banner-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.banner-img img { width: 100%; height: 100%; object-fit: cover; }
.banner-img::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.6) 100%); z-index: 1; }
.banner-content { position: relative; height: calc(100% - 50px); z-index: 2; display: flex; align-items: center; }
.banner-content .text-box { color: #fff; }
.banner-content .text-box h1 { font-size: 48px; font-weight: 700; color: #fff; margin-bottom: 1.5rem; line-height: 1.2; }
.banner-content .text-box .text { font-size: 18px; color: #fff; font-weight: 300; line-height: 1.6; margin-bottom: 2rem; opacity: 0.95; }
.breadcrumb-wrapper { position: relative; z-index: 4; height: 50px; background: #00000038; display: flex; align-items: center; border-top: 1px solid #dddddd73; border-bottom: 1px solid #dddddd73; overflow: hidden; }
.breadcrumb-wrapper::after { content: ""; }
.breadcrumb-wrapper .container { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; padding: 0 15px; }
.breadcrumb-wrapper .container::-webkit-scrollbar { display: none; }
.breadcrumb { display: flex; align-items: center; gap: 0.5rem; list-style: none; padding: 0; margin: 0; flex-wrap: nowrap; white-space: nowrap; min-width: max-content; width: max-content; }
.breadcrumb li { display: flex; align-items: center; gap: 0.5rem; font-size: 14px; color: #fff; opacity: 0.9; flex-shrink: 0; }
.breadcrumb li a { color: #222; text-decoration: none; transition: opacity 0.3s ease; white-space: nowrap; }
.breadcrumb li a:hover { opacity: 0.7; }
.breadcrumb li svg { width: 16px; height: 16px; stroke: #fff; flex-shrink: 0; }
.breadcrumb li:last-child { opacity: 1; font-weight: 500; white-space: nowrap; }
.breadcrumb li:last-child h1 { font-size: inherit; font-weight: 500; color: inherit; margin: 0; padding: 0; line-height: inherit; display: inline; }

/* CONTENT */
/* Page Title Styles - Genel Başlık Stilleri */
.page-title { margin-bottom: 4rem; text-align: left; position: relative; }
.page-title .sup-title { font-size: 14px; font-weight: 500; color: #a03516; display: inline-block; padding: 0; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0.5rem; background: none; }
.page-title .title { font-size: 36px; font-weight: 700; color: #272727; margin: 0 0 1.5rem 0; line-height: 1.2; }
.page-title .title-divider { display: none; }
.page-title.text-center { text-align: center; }
.page-title.text-center .sup-title { margin-left: auto; margin-right: auto; }

/* About Us Section */
.about-us { background-color: #fff; }
.about-content p { font-size: 16px; color: #555; line-height: 1.8; margin-bottom: 1.5rem; font-weight: 300; }
.about-content .highlight-text { font-size: 18px; color: #272727; margin: 2rem 0; padding: 1.5rem; background-color: #f8f9fa; border-left: 4px solid #a03516; border-radius: 5px; }
.service-list { list-style: none; padding: 0; margin: 2rem 0; }
.service-list li { font-size: 16px; color: #272727; font-weight: 500; margin-bottom: 1rem; padding-left: 2rem; position: relative; line-height: 1.6; }
.service-list li:before { content: ''; position: absolute; left: 0; top: 0.5rem; width: 12px; height: 12px; background-color: #a03516; border-radius: 2px; }
.about-image { border-radius: 15px; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); }
.about-image img { width: 100%; height: auto; object-fit: cover; }
.about-info { padding: 2rem 0; }
.about-info .info-subtitle { font-size: 16px; font-weight: 400; color: #7f8c8d; margin-bottom: 0.5rem; text-transform: uppercase; letter-spacing: 1px; }
.about-info .info-title { font-size: 28px; font-weight: 700; color: #272727; margin-bottom: 1.5rem; line-height: 1.2; }
.about-info p { font-size: 16px; color: #555; line-height: 1.8; margin-bottom: 2rem; font-weight: 300; }
.feature-card { background-color: #fff; padding: 2rem; border-radius: 10px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); transition: all 0.3s ease; height: 100%; }
.feature-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); }
.feature-icon { width: 60px; height: 60px; background: #a03516; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem; }
.feature-icon svg { fill: #fff; width: 30px; height: 30px; }
.feature-title { font-size: 18px; font-weight: 600; color: #272727; margin-bottom: 1rem; }
.feature-text { font-size: 14px; color: #555; line-height: 1.6; font-weight: 300; margin: 0; }

/* CTA Section */
.cta { position: relative; background-image: url('../images/cta-bg.webp'); background-size: cover; background-position: center; background-attachment: fixed; background-repeat: no-repeat; }
.cta-commitment-bar { background-color: #a03516; padding: 2rem 0; position: relative; z-index: 2; }
.commitment-text h2 { font-size: 24px; font-weight: 500; color: #fff; margin: 0; line-height: 1.5; }
.cta-quote-button { background-color: #a03516; color: #fff; padding: 15px 40px; border-radius: 8px; text-decoration: none; font-weight: 600; font-size: 16px; display: inline-block; transition: all 0.3s ease; letter-spacing: 0.5px; }
.cta-quote-button:hover { background-color: #3a7e40; color: #fff; transform: translateY(-2px); }

/* Process Section */
.cta-process-section { position: relative; background-image: url('../images/cta-bg.webp'); background-size: cover; background-position: center; background-attachment: fixed; overflow: hidden; }
.cta-process-section::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); z-index: 1; }
.cta-process-section .container { position: relative; z-index: 3; }

/* Floating Bubbles */
.bubbles-container { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.bubble { position: absolute; bottom: -100px; opacity: 0; animation: floatUp linear infinite; }
.bubble-1 { left: 5%; width: 40px; animation-duration: 12s; animation-delay: 0s; }
.bubble-2 { left: 15%; width: 60px; animation-duration: 15s; animation-delay: 2s; }
.bubble-3 { left: 25%; width: 35px; animation-duration: 10s; animation-delay: 4s; }
.bubble-4 { left: 40%; width: 50px; animation-duration: 14s; animation-delay: 1s; }
.bubble-5 { left: 55%; width: 45px; animation-duration: 13s; animation-delay: 3s; }
.bubble-6 { left: 70%; width: 55px; animation-duration: 16s; animation-delay: 5s; }
.bubble-7 { left: 85%; width: 40px; animation-duration: 11s; animation-delay: 2.5s; }
.bubble-8 { left: 95%; width: 48px; animation-duration: 14s; animation-delay: 4.5s; }

@keyframes floatUp {
    0% { bottom: -100px; opacity: 0; transform: translateX(0) rotate(0deg); }
    10% { opacity: 0.8; }
    50% { opacity: 1; transform: translateX(20px) rotate(180deg); }
    90% { opacity: 0.6; }
    100% { bottom: 110%; opacity: 0; transform: translateX(-20px) rotate(360deg); }
}

.process-main-title { font-size: 29px; font-weight: 500; color: #fff; margin-bottom: 3rem; line-height: 1.3; }
.process-steps { position: relative; }
.process-card { background: linear-gradient(135deg, #1a1f2e 0%, #252b3d 100%); border-radius: 16px; padding: 3rem 2rem; text-align: center; height: 100%; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); transition: all 0.3s ease; border: 1px solid rgba(255, 255, 255, 0.1); position: relative; z-index: 2; }
.process-card:hover { transform: translateY(-10px); border-color: rgba(67, 147, 74, 0.3); }
.process-icon { width: 90px; height: 90px; background: linear-gradient(135deg, #a03516 0%, #3a7e40 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 2rem; border: 3px solid rgba(67, 147, 74, 0.3); }
.process-icon svg { fill: #fff; width: 40px; height: 40px; overflow: visible; }
.process-title { font-size: 22px; font-weight: 600; color: #fff; margin-bottom: 1.5rem; line-height: 1.3; }
.process-description { font-size: 16px; color: rgba(255, 255, 255, 0.8); line-height: 1.7; margin: 0; font-weight: 300; }
.process-arrow { display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; right: -30px; transform: translateY(-50%); z-index: 3; }
.process-arrow svg { fill: #a03516; width: 24px; height: 24px; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)); }
.process-steps .col-lg-4:last-child .process-arrow { display: none; }
.process-video-button { background: transparent; color: #fff; padding: 15px 35px; border: 2px solid #fff; border-radius: 50px; text-decoration: none; font-weight: 600; font-size: 16px; display: inline-flex; align-items: center; gap: 12px; transition: all 0.3s ease; letter-spacing: 0.5px; }
.process-video-button:hover { background-color: #fff; color: #a03516; transform: translateY(-2px); }
.process-video-button svg { fill: currentColor; width: 20px; height: 20px; }

/* Category Product Cards */
.category .why-card { display: block; background-color: #fff; border-radius: 12px; overflow: hidden; transition: all 0.3s ease; text-decoration: none; border: 1px solid #e8e8e8; height: 100%; }
.category .why-card:hover { transform: translateY(-8px); border-color: #a03516; }
.category .why-card-image { position: relative; overflow: hidden; aspect-ratio: 4/3; }
.category .why-card-image img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease; }
.category .why-card:hover .why-card-image img { transform: scale(1.05); }
.category .why-card-content { padding: 1.5rem; }
.category .why-card-title { font-size: 18px; font-weight: 600; color: #272727; margin-bottom: .25rem; transition: all 0.3s ease; }
.category .why-card:hover .why-card-title { color: #a03516; }
.category .why-card-divider { width: 40px; height: 2px; background-color: #a03516; margin-bottom: .5rem; }
.category .why-card-text { font-size: 14px; color: #666; line-height: 1.7; margin: 0; font-weight: 300; }

/* Why Us Section */
.why-us { background-color: #fafafa; }
.page-title .title-subtitle { font-size: 17px; color: #666; margin-top: 1.2rem; font-weight: 300; line-height: 1.8; max-width: 600px; margin-left: auto; margin-right: auto; }
.why-feature-box { background-color: transparent; padding: 0; display: flex; flex-direction: column; align-items: flex-start; height: 100%; margin-bottom: 3rem; }
.why-feature-icon { width: 28px; height: 28px; border-radius: 50%; background-color: transparent; border: 2px solid #e0e0e0; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-bottom: .8rem; }
.why-feature-icon svg { width: 14px; height: 14px; }
.why-feature-title { font-size: 20px; font-weight: 500; color: #333; margin-bottom: .8rem; line-height: 1.4; letter-spacing: -0.3px; }
.why-feature-text { font-size: 15px; color: #666; line-height: 1.8; font-weight: 300; margin: 0; }
.why-satisfaction-card { background-color: transparent; border-radius: 16px; padding: 2rem; box-shadow: none; border: none; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; }
.satisfaction-image { text-align: center; opacity: 0.9; }
.satisfaction-image img { max-width: 100%; height: auto; filter: drop-shadow(0 10px 30px rgba(67, 147, 74, 0.12)); }

/* User Reviews Section */
.user-reviews { background-image: url('../images/comment-bg.webp'); background-size: cover; background-position: center; background-attachment: fixed; position: relative; }
.user-reviews::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: linear-gradient(120deg, #FFFFFF00 30%, #252b3d 60%); z-index: 1; }
.user-reviews .container { position: relative; z-index: 2; }
.reviews-wrapper { position: relative; padding: 3rem; max-width: 550px; margin: 0 auto; }
.reviews-section-title { font-size: 36px; font-weight: 700; color: #fff; margin-bottom: 2rem; text-align: center; }
.reviews-swiper { position: relative; overflow: hidden; width: 100%; }
.reviews-swiper .swiper-wrapper { align-items: stretch; }
.reviews-swiper .swiper-slide { height: auto; width: 100%; }
.review-card { border-radius: 16px; padding: 2rem; display: flex; flex-direction: column; }
.review-content { display: flex; flex-direction: column; height: 100%; }
.review-text { font-size: 18px; line-height: 1.8; color: #fff; margin-bottom: 2.5rem; font-weight: 300; font-style: italic; flex-grow: 1; }
.review-author-info { display: flex; align-items: center; gap: 1.5rem; margin-top: auto; }
.review-avatar { width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(135deg, #a03516 0%, #a03516 100%); display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); }
.review-avatar span { font-size: 22px; font-weight: 700; color: #fff; text-transform: uppercase; }
.review-author-details { display: flex; flex-direction: column; gap: 0.3rem; }
.review-author-details strong { font-size: 18px; font-weight: 600; color: #fff; display: block; }
.review-author-details span { font-size: 14px; color: #fff; font-weight: 400; }
.reviews-next { width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; color: #fff; cursor: pointer; transition: all 0.3s ease; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; }
.reviews-next:hover { color: #a03516; transform: translateY(-50%) scale(1.1); }
.reviews-prev { left: -10px; }
.reviews-next { right: -10px; }
.reviews-next svg { width: 100%; height: 100%; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3)); }
.reviews-next::after { display: none; }

/* Main References Section */
.main-references { background-color: #f8f9fa; }
.references-swiper { padding: 2rem 0; }
.reference-item { background-color: #fff; border-radius: 10px; padding: 1.5rem; display: flex; align-items: center; justify-content: center; height: 150px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05); transition: all 0.3s ease; overflow: hidden; }
.reference-item:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); }
.reference-item img { max-width: 100%; max-height: 100%; object-fit: contain; filter: grayscale(100%); opacity: 0.6; transition: all 0.3s ease; }
.reference-item:hover img { filter: grayscale(0%); opacity: 1; }
.references-pagination { position: relative; margin-top: 2rem; }
.references-pagination .swiper-pagination-bullet { width: 12px; height: 12px; background-color: #a03516; opacity: 0.3; transition: all 0.3s ease; }
.references-pagination .swiper-pagination-bullet-active { opacity: 1; background-color: #a03516; }

/* Sidebar Menu */
.sidebar-menu { background-color: #fff; border-radius: 10px; padding: 1.5rem 1rem; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); margin-bottom: 2rem; }
.sidebar-title { font-size: 20px; font-weight: 700; color: #272727; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid #f0f0f0; position: relative; }
.sidebar-arrow { display: none; }
.sidebar-nav { list-style: none; padding: 0; margin: 0; }
.sidebar-item { margin-bottom: 0.5rem; }
.sidebar-link { display: block; padding: 0.75rem 1rem; color: #555; font-size: 15px; text-decoration: none; border-radius: 5px; transition: all 0.3s ease; border-left: 3px solid transparent; }
.sidebar-link:hover { background-color: #f8f9fa; color: #a03516; border-left-color: #a03516; padding-left: 1.25rem; }

/* General CSS */
.zed-form-container { background: white; border-radius: 16px; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); padding: 40px; position: relative; overflow: hidden; height: 100%; }
.zed-form-container::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #12314e, #e74c3c); }
.zed-form-title { text-align: center; color: #2c3e50; font-size: 28px; margin-bottom: 30px; font-weight: 600; }
.zed-form-group { position: relative; }
.zed-form-label { display: block; margin-bottom: 8px; color: #555; font-weight: 500; font-size: 14px; }
.zed-form-input, .zed-form-textarea { width: 100%; padding: 12px 16px; border: 2px solid #e1e5e9; border-radius: 10px; font-size: 16px; transition: all 0.3s ease; background-color: #f8f9fa; }
.zed-form-input:focus, .zed-form-textarea:focus { outline: none; border-color: #6CA5A3; background-color: white; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); }
.zed-form-textarea { resize: vertical; min-height: 120px; font-family: inherit; }
.zed-form-error { color: #e74c3c; font-size: 12px; margin-top: 5px; opacity: 0; transform: translateY(-10px); transition: all 0.3s ease; }
.zed-form-error.zed-show-error { opacity: 1; transform: translateY(0); }
.zed-form-input.zed-error, .zed-form-textarea.zed-error { border-color: #e74c3c; background-color: #fdf2f2; }
.zed-form-submit { width: 100%; padding: 14px; background: linear-gradient(135deg, #6CA5A3 0%, #764ba2 100%); color: white; border: none; border-radius: 10px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; position: relative; overflow: hidden; }
.zed-form-submit:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3); }
.zed-form-submit:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }
.zed-toast { position: fixed; top: 20px; right: 20px; padding: 16px 20px; border-radius: 8px; color: white; font-weight: 500; z-index: 1000; transform: translateX(400px); transition: transform 0.3s ease; }
.zed-toast.zed-success { background-color: #27ae60; }
.zed-toast.zed-error { background-color: #e74c3c; }
.zed-toast.zed-show { transform: translateX(0); }
.zed-contact-info { background: white; border-radius: 16px; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); overflow: hidden; }
.zed-map-container { width: 100%; height: 350px; position: relative; border-radius: 16px; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); overflow: hidden; }
.primary-button { display: flex; align-items: center; justify-content: center; color: white; border: none; border-radius: 10px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; position: relative; overflow: hidden; }
.primary-button svg { width: 20px; height: 20px; fill: #fff; }
.zed-map-container iframe { width: 100%; height: 100%; border: none; filter: grayscale(0.3); transition: filter 0.3s ease; }
.zed-map-container iframe:hover { filter: grayscale(0); }
.zed-info-content { padding: 40px; position: relative; }
.zed-info-content::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #12314e, #e74c3c); }
.zed-info-title { font-size: 24px; font-weight: 600; color: #2c3e50; margin-bottom: 30px; display: flex; align-items: center; gap: 10px; }
.zed-info-item { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 25px; padding: 20px; background: #f8f9fa; border-radius: 12px; transition: all 0.3s ease; }
.zed-info-item:hover { background: #e9ecef; transform: translateX(5px); }
.zed-info-icon { width: 20px; height: 20px; margin-top: 2px; flex-shrink: 0; fill: #a03516; }
.zed-info-details h4 { font-size: 16px; font-weight: 600; color: #2c3e50; margin-bottom: 5px; }
.zed-info-details p { color: #7f8c8d; font-size: 14px; line-height: 1.5; }
.whatsapp-float { position: fixed; right: 20px; bottom: 20px; z-index: 9999; background: #25d366; border-radius: 50px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: box-shadow 0.2s; width: 56px; height: 56px; }
.whatsapp-float svg { width: 32px; height: 32px; fill: #fff; display: block; }
.whatsapp-float span { display: none; color: #fff; font-weight: 500; margin-left: 10px; font-size: 16px; }
.whatsapp-ribbon { position: absolute; top: -7px; right: -7px; background: #d61617; color: #fff; font-size: 12px !important; margin-left: 0 !important; font-weight: bold; border-radius: 12px; padding: 2px 7px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); z-index: 2; display: none; animation: fadeInRibbon 0.5s; }

@keyframes fadeInRibbon {
    from { opacity: 0; transform: scale(0.7); }
    to { opacity: 1; transform: scale(1); }
}

.whatsapp-float.shake { animation: shakeWhatsapp 0.5s; }

@keyframes shakeWhatsapp {
    0% { transform: translateX(0); }
    20% { transform: translateX(-4px); }
    40% { transform: translateX(4px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(4px); }
    100% { transform: translateX(0); }
}

/* CONTENT END */

/* FOOTER */
footer { position: relative; z-index: 3; background-size: cover; background-color: #002d3b; }
footer .footer-wrapper { padding: 50px 40px; }
footer .header-social { display: flex; align-items: center; gap: 1rem; list-style: none; }
footer .header-social li a { display: flex; align-items: center; justify-content: center; width: 45px; height: 45px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; transition: all 0.3s ease; }
footer .header-social li a:hover { background: #a03516; border-color: #a03516; transform: translateY(-3px); }
footer .header-social li a svg { fill: #fff; width: 22px; height: 22px; transition: all 0.3s ease; }
footer .header-social li a:hover svg { transform: scale(1.05); }
footer .footer-text { font-size: 14px; color: #fff; opacity: .6; margin-top: 1rem; font-weight: 300; }
footer h5 { font-size: 1.25rem; font-weight: 500; color: #fff; position: relative; }
footer h5::after { content: ""; height: 1px; width: 65%; background-color: #fff; display: block; margin-top: 0.5rem; opacity: .6; }
footer .footer-top { padding: 50px 0; border-bottom: 1px solid #4b4b4b; }
footer .footer-call { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; color: #222; }
footer .footer-call h3 { font-weight: 300; margin-bottom: 0; font-size: 1.25rem; }
footer .brand-logo { margin-bottom: 1.5rem; display: block; }
footer .brand-logo img { max-width: 100%; height: 70px; object-fit: contain; filter: brightness(0) invert(1); }
footer .footer-thin { font-size: 12px; font-weight: 300; margin: 0; color: #BAB7B7; display: block; margin-top: 20px; }
footer .footer-thin-social { margin-top: 40px; margin-bottom: 5px; color: #222; }
footer .footer-social { padding-inline-start: 0px; margin-block-start: 1rem; margin-block-end: 2rem; display: flex; }
footer .footer-social li { margin-right: 10px; text-align: center; line-height: 25px; }
footer .footer-social li i { color: #222; font-size: 18px; }
footer .footer-link-list { margin-bottom: 25px; }
footer .footer-link-list li a { margin-bottom: 10px; color: #fff; font-weight: 300; font-size: 14px; display: flex; align-items: flex-start; gap: 10px; cursor: pointer !important; }
footer .footer-link-list li svg { fill: #7C7C7C; min-width: 20px; margin-top: 3px; }
footer .footer-link-list li a:hover { opacity: 1; transition: all ease .3s; }
footer .footer-link-list li { opacity: .5; transition: all ease .3s; }
footer .footer-link-list li:hover { opacity: 1; transition: all ease .3s; }
footer .footer-bottom-image { margin: 50px 0 -50px; width: 100%; overflow: hidden; }
footer .footer-bottom-image img { width: 100%; }
footer .footer-copyright { color: #8e8e8e; padding: 15px 10px; font-size: 13px; height: 50px; font-weight: 400; }
footer .footer-copyright .right a { margin-right: 16px; font-weight: 300; font-size: 13px; color: #8e8e8e; }
footer .footer-copyright .web-tasarim { white-space: nowrap; margin-top: 0; -webkit-transition: all .3s linear; transition: all .3s linear; }
footer .footer-copyright .web-tasarim:hover { opacity: 1; }
footer .footer-copyrights { border-top: 1px solid #BCBCBC; padding-top: 20px; padding-bottom: 20px; }
footer .footer-copyrights ul { margin: 0; padding: 0; float: right; }
footer .footer-copyrights ul li { float: left; }
footer .footer-copyrights ul li a { color: #222 !important; font-weight: 100; cursor: pointer; }
footer .footer-copyrights ul li a:hover { color: #a03516 !important; }
footer .copyright-wrapper { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
footer .zedtech-logo { height: 20px; opacity: .5; transition: all ease .3s; }
footer .zedtech-logo:hover { opacity: 1; }
footer .footer-input { width: 80%; overflow: hidden; border-radius: 8px; border: 1px solid #a03516; }
/* FOOTER END */

/* MODAL */
.modal .modal-body { height: 500px; overflow-y: scroll; }
.modal .modal-body p { font-size: 15px; }
.modal .modal-body ul { margin-left: 30px; margin-bottom: 20px; }
.modal .modal-body ul li { font-size: 15px; font-weight: 300; list-style: circle; }
.modal .modal-body ol li { font-size: 15px; font-weight: 300; }
.modal .modal-body a { color: #a03516; }
.modal .modal-body .teklif-al { background: #a03516; color: #fff; float: right; padding: 8px 15px; border-radius: 5px; font-size: 14px; cursor: pointer; }
.modal .modal-body .teklif-al i { margin-right: 7px; }
.modal-header .btn-close:focus { outline: none; box-shadow: none; }
/* MODAL END */

/* RESPONSIVE */
@media only screen and (min-width: 992px) {
    .container { width: 90%; }
    .header-link { position: relative; z-index: 3; }
    .product-swiper .swiper-pagination { display: none; }
    .hero-content .text-box .slide-title { font-size: 64px; }
    .hero-content .text-box .slide-text { font-size: 20px; }
}

@media only screen and (min-width: 1440px) {
    .container { max-width: 1360px; }
    .hero-content .text-box .slide-title { font-size: 72px; }
    .slide-img-wrapper { height: 500px; }
}

@media only screen and (max-width: 1200px) {
    .navbar-expand-lg .navbar-collapse .navbar-nav { gap: .5rem; }
    header .header-link { padding-left: 1.24rem; margin-left: 1.24rem; }
}

@media only screen and (max-width: 992px) {
    .table-hide { display: none; }
    header .sidenav-toogle { transition: all ease 200ms; display: flex; align-items: center; font-size: 23px; z-index: 3; }
    .header-space { height: 60px; }
    .header-top { height: 60px; }
    .header-top .brand-logo { margin: 0 auto; }
    .header-search-main { display: none; }
    .header-top-actions .login-btn, .header-top-actions .account-btn { display: none; }
    .header-nav-bar { display: none; }
    .container { max-width: 90%; }
    .py-set { padding: 3rem 0; }
    footer .brand-logo { text-align: center; }
    footer .header-social { justify-content: center; }
    footer .footer-text { text-align: center; }
    .page-title .title { font-size: 36px; }
    .about-info .info-title { font-size: 30px; }
    .about-content .highlight-text { font-size: 16px; padding: 1.2rem; }
    .services-slider-section .about-content { padding-right: 0; margin-bottom: 2rem; }
    .services-slider-section .about-title { font-size: 28px; }
    .services-slider-wrapper { padding: 0 45px; }
    .service-card-image { height: 130px; }
    .service-card-content { padding: 0.85rem; }
    .service-card-title { font-size: 14px; }
    .service-card-button { padding: 5px 15px; font-size: 11px; }
    .services-next { width: 35px; height: 35px; }
    .services-next::after { font-size: 14px; }
}

@media only screen and (max-width: 768px) {
    footer .container { max-width: 95%; }
    header .header-top { display: none; }
    header .header-7-24-link { display: none; }
    header.set-header nav .brand-logo img { height: 35px; transition: all ease 200ms; }
    .hero-content h2 { font-size: 22px; }
    .hero-content p { font-size: 14px; }
    .t-quote { font-size: 17px; }
    .t-card { width: 90%; }
    .slider-content .title { font-size: 2.25rem; }
    .slider-content .text { font-size: 1rem; }
    .content-header .title { font-size: 1.5rem; }
    .content-header .text { font-size: 1rem; }
    .custom-form-container { margin-top: 0; }
    .zed-contact-page { padding: 20px 10px; }
    .zed-info-content { padding: 30px 20px; }
    .zed-page-title { font-size: 28px; }
    .zed-page-subtitle { font-size: 16px; }
    .zed-map-container { height: 250px; }
    .bg-pattern { width: 100px; }
    .slide-img-wrapper { height: 500px; }
    .hero-content .text-box { padding: 0 1rem; }
    .hero-content .text-box .slide-title { font-size: 32px; margin-bottom: 1rem; }
    .hero-content .text-box .slide-title .highlight-text::after { height: 3px; bottom: 5px; }
    .hero-content .text-box .slide-text { font-size: 16px; margin-bottom: 2rem; }
    .hero-content .text-box .hero-cta-button { padding: 12px 30px; font-size: 14px; }
    .services-slider-section .about-content { margin-bottom: 2rem; }
    .services-slider-section .about-title { font-size: 26px; }
    .services-slider-section .about-content p { font-size: 15px; }
    .services-slider-wrapper { padding: 0 40px; }
    .service-card { border-radius: 10px; }
    .service-card-image { height: 120px; border-radius: 10px 10px 0 0; }
    .service-card-content { padding: 0.85rem; }
    .service-card-title { font-size: 14px; }
    .service-card-button { padding: 5px 15px; font-size: 11px; }
    .services-next { width: 32px; height: 32px; }
    .services-next::after { font-size: 14px; }
    *[data-aos-delay] { transition-delay: 0 !important; }
    .page-title .title-text { width: calc(100% - 140px); }
    .product-card { height: 310px; }
    .page-title .sup-title { font-size: 12px; padding: 0.35rem 1rem; letter-spacing: 1px; }
    .page-title .title { font-size: 28px; }
    .page-banner { height: 400px; }
    .banner-content .text-box h1 { font-size: 36px; }
    .banner-content .text-box .text { font-size: 16px; }
    .references-swiper { padding: 1.5rem 0; }
    .reference-item { height: 120px; padding: 1.2rem; }
    .sidebar-menu { padding: 1.5rem; margin-bottom: 1.5rem; position: relative; top: 0; }
    .sidebar-title { font-size: 18px; margin-bottom: 0; padding-bottom: 0.8rem; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: space-between; }
    .sidebar-arrow { display: block; width: 20px; height: 20px; fill: #272727; transition: transform 0.3s ease; }
    .sidebar-menu.active .sidebar-arrow { transform: rotate(180deg); }
    .sidebar-nav { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; margin-top: 0; }
    .sidebar-menu.active .sidebar-nav { max-height: 1000px; margin-top: 1rem; }
    .sidebar-link { padding: 0.6rem 0.8rem; font-size: 14px; }
    .about-content p { font-size: 15px; }
    .about-content .highlight-text { font-size: 15px; padding: 1rem; }
    .service-list li { font-size: 15px; margin-bottom: 0.8rem; }
    .about-info .info-subtitle { font-size: 14px; }
    .about-info .info-title { font-size: 22px; }
    .about-info p { font-size: 15px; }
    .feature-card { padding: 1.5rem; margin-bottom: 1.5rem; }
    .feature-icon { width: 50px; height: 50px; margin-bottom: 1rem; }
    .feature-icon svg { width: 25px; height: 25px; }
    .feature-title { font-size: 16px; }
    .feature-text { font-size: 13px; }
    .cta { background-attachment: scroll; }
    .cta-process-section { background-attachment: scroll; }
    .cta-commitment-bar { padding: 1.5rem 0; }
    .commitment-text h2 { font-size: 20px; }
    .cta-quote-button { font-size: 15px; padding: 12px 30px; }
    .process-main-title { font-size: 32px; font-weight: 600; margin-bottom: 3rem; }
    .process-card { padding: 2.5rem 1.5rem; }
    .bubble { display: none; }
    .bubble-7 { display: block; width: 28px; }
    .bubble-1 { width: 30px; }
    .bubble-3 { width: 25px; }
    .bubble-5 { width: 32px; }
    .process-icon { width: 75px; height: 75px; }
    .process-icon svg { width: 35px; height: 35px; }
    .process-title { font-size: 20px; font-weight: 600; }
    .process-description { font-size: 15px; }
    .process-arrow { right: -20px; }
    .process-video-button { font-size: 14px; padding: 12px 25px; }
    .why-us { padding: 4.5rem 0; }
    .page-title .title { font-size: 34px; }
    .page-title .title-subtitle { font-size: 16px; }
    .why-feature-box { margin-bottom: 2.5rem; }
    .why-feature-icon { width: 26px; height: 26px; margin-bottom: 1.5rem; }
    .why-feature-icon svg { width: 12px; height: 12px; }
    .why-feature-title { font-size: 19px; margin-bottom: 0.8rem; }
    .why-feature-text { font-size: 14px; }
    .why-satisfaction-card { padding: 2rem; margin-top: 2rem; }
    .satisfaction-image img { max-width: 100%; }
    .user-reviews { background-attachment: scroll; }
    .reviews-wrapper { padding: 2rem 1.5rem; }
    .reviews-section-title { font-size: 28px; margin-bottom: 2rem; }
    .review-card { padding: 2rem; }
    .review-text { font-size: 16px; margin-bottom: 2rem; }
    .review-avatar { width: 50px; height: 50px; }
    .review-avatar span { font-size: 18px; }
    .review-author-details strong { font-size: 16px; }
    .reviews-next { width: 40px; height: 40px; }
}

@media only screen and (max-width: 570px) {
    .slide-img-wrapper { height: 400px; }
    .hero-content .text-box .slide-title { font-size: 24px; margin-bottom: 0.8rem; }
    .hero-content .text-box .slide-title .highlight-text::after { height: 2px; bottom: 3px; }
    .hero-content .text-box .slide-text { font-size: 14px; margin-bottom: 1.5rem; }
    .hero-content .text-box .hero-cta-button { padding: 10px 25px; font-size: 13px; }
    .hero-swiper-prev { width: 40px; height: 40px; }
    .hero-swiper-prev::after { font-size: 16px; }
    .hero-swiper-next { width: 40px; height: 40px; }
    .hero-swiper-next::after { font-size: 16px; }
    .services-slider-section .about-title { font-size: 22px; margin-bottom: 1rem; }
    .services-slider-section .about-subtitle { font-size: 12px; }
    .services-slider-section .about-content p { font-size: 14px; margin-bottom: 0.8rem; }
    .services-slider-wrapper { padding: 0 35px; }
    .service-card { border-radius: 8px; }
    .service-card-image { height: 100px; border-radius: 8px 8px 0 0; }
    .service-card-content { padding: 0.7rem; gap: 0.5rem; }
    .service-card-title { font-size: 13px; }
    .service-card-button { padding: 4px 12px; font-size: 10px; }
    .services-next { width: 30px; height: 30px; }
    .services-next::after { font-size: 13px; }
    .contact-actions .whatsapp-float { right: 0; left: 0; bottom: 0; width: 50%; height: 40px; border-radius: 0; justify-content: center; box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.10); }
    .contact-actions .whatsapp-float span { display: inline; font-weight: 400; }
    .contact-actions .phone-float span { display: inline; font-weight: 400; }
    .contact-actions .whatsapp-ribbon { display: none !important; }
    .contact-actions .phone-float { display: flex; right: 0; bottom: 0; width: 50%; height: 40px; border-radius: 0; justify-content: center; box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.10); position: fixed; background: #2E55AF; color: #fff; fill: #fff; align-items: center; }
    .contact-actions .phone-float svg { width: 27px; height: 27px; margin-right: 10px; }
    .container { width: 95%; }
    .page-hero { justify-content: flex-end; height: 300px; background-position: left bottom; background-size: 220%; padding-top: 0; }
    .page-hero .ustm-title { font-size: 25px; }
    .bread-crumbs li a { font-size: 14px; }
    footer .footer-bottom-image { margin-bottom: 0; }
    footer .brand-logo { margin-bottom: 1.5rem; display: block; }
    footer .footer-social li a { margin-top: 1rem; }
    .py-set { padding: 3em 0; }
    .feature-card { margin-bottom: 1.5rem; }
    .main-about .rounded-3 { margin-bottom: 1rem; }
    footer .footer-call { justify-content: center; }
    footer .header-social { margin-bottom: 1.5rem; }
    .page-hero .page-hero-content .hero-title { font-size: 2.2rem; margin-bottom: 1rem; }
    .page-hero .page-hero-content { padding: 2rem .5rem; }
    .page-hero .page-hero-content .hero-subtitle { font-size: 1rem; margin-bottom: 1rem; }
    .page-hero .tertiary-button { font-size: 14px; padding: 10px 20px; }
    .primary-button { font-size: 14px; padding: 7px 21px; }
    .cta-commitment-bar { padding: 1.2rem 0; }
    .commitment-text h2 { font-size: 17px; }
    .cta-quote-button { font-size: 14px; padding: 10px 25px; display: block; text-align: center; margin-top: 1rem; }
    .process-main-title { font-size: 26px; font-weight: 600; margin-bottom: 2.5rem; }
    .process-card { padding: 2rem 1.2rem; margin-bottom: 2rem; }
    .process-icon { width: 65px; height: 65px; margin-bottom: 1.5rem; }
    .process-icon svg { width: 30px; height: 30px; }
    .process-title { font-size: 18px; font-weight: 600; margin-bottom: 1rem; }
    .process-description { font-size: 14px; }
    .process-arrow { display: none; }
    .process-video-button { font-size: 14px; padding: 12px 25px; }
    .why-us { padding: 3.5rem 0; }
    .page-title .title { font-size: 30px; }
    .page-title .sup-title { font-size: 11px; letter-spacing: 1.5px; }
    .page-title .title-subtitle { font-size: 15px; }
    .why-feature-box { margin-bottom: 2rem; text-align: center; align-items: center; }
    .why-feature-icon { width: 24px; height: 24px; margin-bottom: 1.2rem; }
    .why-feature-icon svg { width: 12px; height: 12px; }
    .why-feature-title { font-size: 18px; margin-bottom: 0.7rem; }
    .why-feature-text { font-size: 14px; line-height: 1.7; }
    .why-satisfaction-card { padding: 1.5rem; margin-top: 2rem; }
    .satisfaction-image img { max-width: 80%; }
    .reviews-wrapper { padding: 1.5rem 0rem; }
    .reviews-section-title { font-size: 24px; margin-bottom: 1.5rem; text-align: center; }
    .review-card { padding: 1.5rem; }
    .review-text { font-size: 15px; margin-bottom: 1.5rem; }
    .review-avatar { width: 45px; height: 45px; }
    .review-avatar span { font-size: 16px; }
    .review-author-details strong { font-size: 15px; }
    .review-author-details span { font-size: 13px; }
    .category .why-card-content { padding: 1.2rem; }
    .category .why-card-title { font-size: 16px; }
    .category .why-card-text { font-size: 13px; }
    .reviews-next { width: 35px; height: 35px; }
    .reviews-prev { left: -5px; }
    .reviews-next { right: -5px; }
    .page-banner { height: 300px; }
    .banner-content .text-box h1 { font-size: 28px; margin-bottom: 1rem; }
    .banner-content .text-box .text { font-size: 15px; margin-bottom: 1.5rem; }
    .breadcrumb { font-size: 13px; }
    .breadcrumb-wrapper .container { width: 100%; max-width: 100%; padding: 0 15px; }
    .references-swiper { padding: 1rem 0; }
    .reference-item { height: 100px; padding: 1rem; }
    .sidebar-menu { padding: 1.2rem; margin-bottom: 1rem; }
    .sidebar-title { font-size: 16px; margin-bottom: 0; padding-bottom: 0.6rem; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: space-between; }
    .sidebar-arrow { display: block; width: 18px; height: 18px; fill: #272727; transition: transform 0.3s ease; }
    .sidebar-menu.active .sidebar-arrow { transform: rotate(180deg); }
    .sidebar-nav { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; margin-top: 0; }
    .sidebar-menu.active .sidebar-nav { max-height: 1000px; margin-top: 0.8rem; }
    .sidebar-link { padding: 0.5rem 0.7rem; font-size: 13px; }
    .user-text p { font-size: 15px; }
    footer h5 { font-size: 1rem; }
    footer .footer-copyright { height: auto; }
    footer .footer-copyright .left { text-align: center; display: block; font-size: 14px; float: none; }
    footer .footer-copyright .right { display: flex; justify-content: center; width: 100%; gap: 1rem; align-items: center; margin-top: 1rem; }
    footer .footer-copyright .right .web-tasarim { margin: 0 !important; }
    footer .footer-copyright .right a { margin-right: 0px; display: block; float: none; margin: auto; }
    .user-reviews::after { background-image: linear-gradient(120deg, #4b505dc9 30%, #252b3dd1 60%); }
    .header-cta-button { display: none; }
    body { padding-bottom: 40px; }
}

@media only screen and (max-width: 350px) {
    header .header-top .brand-logo { width: 210px; }
    header .header-top .brand-logo img { max-width: 100%; }
}
/* RESPONSIVE END */

/* Video Modal */
.video-modal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); animation: fadeIn 0.3s ease; }
.video-modal.active { display: flex; align-items: center; justify-content: center; }

/* Header Actions */
.header-action-btn { color: #1a1a1a; font-size: 20px; font-weight: 500; text-decoration: none; transition: all 0.3s ease; padding: 10px; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; width: 45px; height: 45px; background-color: transparent; border: 0; }
.header-action-btn:hover { color: #a03516; background-color: rgba(67, 147, 74, 0.05); transform: translateY(-2px); }
.header-action-btn svg { width: 20px; height: 20px; }
.login-btn span { font-size: 14px; font-weight: 600; margin-left: 8px; letter-spacing: 0.5px; text-transform: uppercase; }
.cart-count { position: absolute; top: 5px; right: 5px; background-color: #a03516; color: white; font-size: 10px; font-weight: bold; width: 16px; height: 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); }

/* Header Search Bar */
.header-search-bar { border-top: 1px solid #e0e0e0; padding: 15px 0; animation: slideDown 0.3s ease-out; }
#cartOffcanvas { width: 100%; max-width: 450px; border: none; box-shadow: -5px 0 30px rgba(0, 0, 0, 0.18); }
#cartOffcanvas .offcanvas-header { padding: 20px 25px; border-bottom: 1px solid #eee; background: #fff; }
#cartOffcanvas .offcanvas-title { font-size: 20px; font-weight: 600; color: #272727; margin: 0; }
#cartOffcanvas .btn-close { border: none; font-size: 22px; cursor: pointer; color: #333 !important; opacity: 1; transition: color 0.3s; padding: 0; display: flex; align-items: center; justify-content: center; box-shadow: none; }
#cartOffcanvas .btn-close:hover { color: #a03516; opacity: 1; }
#cartOffcanvas .offcanvas-body { padding: 0; display: flex; flex-direction: column; background: #fff; }

/* Empty state */
#cartOffcanvas #cart-empty-msg { flex-grow: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 20px; }
#cartOffcanvas #cart-empty-msg .bi { font-size: 4rem; color: #ccc; }
#cartOffcanvas #cart-empty-msg p { font-size: 15px; color: #999; margin-top: 12px; margin-bottom: 0; }

/* Items wrapper */
#cartOffcanvas #cart-items-wrapper { flex-grow: 1; overflow-y: auto; padding: 0 25px; }

/* Reuse existing .cart-item styles — wrapper keeps consistent padding */
#cartOffcanvas #cart-items-wrapper .cart-item { padding: 15px 0; border-bottom: 1px solid #eee; display: flex; align-items: center; gap: 14px; }
#cartOffcanvas #cart-items-wrapper .cart-item:last-child { border-bottom: none; padding-bottom: 0; }

/* Footer */
#cartOffcanvas #cart-footer { padding: 20px 25px 25px; border-top: 1px solid #eee; background-color: #f9f9f9; flex-shrink: 0; }
#cartOffcanvas #cart-footer .d-flex span { font-size: 15px; color: #1a1a1a; }
#cartOffcanvas #cart-footer #offcanvas-total { font-size: 18px; color: #a03516 !important; font-weight: 700; }
#cartOffcanvas #cart-footer .d-grid { gap: 10px; }

/* View Cart button */
#cartOffcanvas #cart-footer a[href="/cart"], #cartOffcanvas #cart-footer a[href="cart.html"] { display: block; width: 100%; padding: 12px 16px; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: #a03516; background: #fff; border: 2px solid #a03516; border-radius: 4px; text-decoration: none; transition: background 0.2s, color 0.2s; }
#cartOffcanvas #cart-footer a[href="/cart"]:hover, #cartOffcanvas #cart-footer a[href="cart.html"]:hover { background: #a03516; color: #fff; }

/* Checkout button */
#cartOffcanvas #cart-footer a[href="/order"], #cartOffcanvas #cart-footer a[href="checkout.html"] { display: block; width: 100%; padding: 13px 16px; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: #fff; background: #a03516; border: 2px solid #a03516; border-radius: 4px; text-decoration: none; transition: background 0.2s, border-color 0.2s; }
#cartOffcanvas #cart-footer a[href="/order"]:hover, #cartOffcanvas #cart-footer a[href="checkout.html"]:hover { background: ##9d3a1dd1; border-color: ##9d3a1dd1; color: #fff; }

/* Clear All button */
#cartOffcanvas #cart-footer button[onclick] { display: block; width: 100%; padding: 10px 16px; text-align: center; font-size: 13px; font-weight: 600; color: #e53935; background: #fff; border: 1.5px solid rgba(229, 57, 53, 0.32); border-radius: 4px; cursor: pointer; transition: background 0.2s, color 0.2s; margin-top: 2px; }
#cartOffcanvas #cart-footer button[onclick]:hover { background: #fdecea; }
.text-primary { --bs-text-opacity: 1; color: rgb(160 53 22) !important; }
.text-danger { --bs-text-opacity: 1; color: rgb(160 53 22) !important; }

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.header-search-bar .container { display: flex; justify-content: center; align-items: center; }

/* Search Input */
.search-container { position: relative; display: flex; align-items: center; max-width: 600px; width: 100%; gap: 10px; }
.search-btn { color: #1a1a1a; font-size: 20px; cursor: pointer; transition: all 0.3s ease; padding: 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; background: #a03516; border: none; flex-shrink: 0; }
.search-btn:hover { color: #ffffff; background: #e67004; transform: translateY(-2px); }
.search-btn svg { width: 20px; height: 20px; color: #ffffff; }
.search-input-wrapper { position: relative; flex: 1; width: 100%; }
.search-input-wrapper.active { width: 100%; }
.search-icon-left { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: #999; pointer-events: none; z-index: 1; }
.search-input { width: 100%; height: 50px; padding: 0 20px 0 50px; border: 1px solid #e0e0e0; border-radius: 25px; font-size: 14px; outline: none; transition: all 0.3s ease; background: #fff; }
.search-input:focus { border-color: #a03516; box-shadow: 0 0 0 3px rgba(255, 127, 5, 0.1); }

/* Full Screen Cart Drawer */
.cart-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 9999; opacity: 0; visibility: hidden; transition: all 0.3s ease; }
.cart-overlay.active { opacity: 1; visibility: visible; }
.cart-drawer { position: absolute; top: 0; right: -100%; width: 100%; max-width: 450px; height: 100%; background-color: white; box-shadow: -5px 0 30px rgba(0, 0, 0, 0.2); transition: right 0.4s cubic-bezier(0.19, 1, 0.22, 1); display: flex; flex-direction: column; }
.cart-overlay.active .cart-drawer { right: 0; }
.cart-header { padding: 20px 25px; border-bottom: 1px solid #eee; }
.cart-header h3 { margin: 0; font-size: 20px; font-weight: 600; color: #272727; }
.close-cart-btn { background: none; border: none; font-size: 24px; cursor: pointer; color: #333; transition: color 0.3s; padding: 0; display: flex; align-items: center; justify-content: center; }
.close-cart-btn:hover { color: #a03516; }
.cart-body { flex-grow: 1; padding: 0 30px; overflow-y: auto; display: flex; width: 100%; flex-direction: column; justify-content: flex-end; }
.cart-footer { padding: 20px 25px 25px; border-top: 1px solid #eee; background-color: #f9f9f9; }

@media (max-width: 768px) {
    .header-search-bar { padding: 12px 0; }
    .search-container { max-width: 100%; padding: 0 15px; }
    .search-input { height: 45px; }
    .search-btn { width: 45px; height: 45px; }
}

@media (max-width: 576px) {
    .cart-drawer { max-width: 100%; }
}

.video-modal-content { position: relative; width: 90%; max-width: 800px; aspect-ratio: 9/16; background-color: #000; border-radius: 12px; overflow: hidden; animation: slideIn 0.3s ease; }
.video-modal-close { position: absolute; top: -50px; right: 0; color: #fff; font-size: 40px; font-weight: 300; background: none; border: none; cursor: pointer; z-index: 10000; padding: 0; width: 40px; height: 40px; line-height: 40px; transition: all 0.3s ease; }
.video-modal-close:hover { transform: rotate(90deg); color: #a03516; }
.video-modal-body { width: 100%; height: 100%; }
.video-modal-body iframe { border: none; }

@keyframes slideIn {
    from { transform: scale(0.7); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

@media only screen and (max-width: 768px) {
    .video-modal-content { width: 95%; max-width: none; }
    .video-modal-close { top: -45px; font-size: 35px; }
}

/* FEATURES SECTION */
.features-section { background-color: #fff; }
.feature-card { display: flex; align-items: center; gap: 20px; padding: 25px; background-color: #f8f8f8; border-radius: 15px; transition: all 0.3s ease; height: 100%; border: 1px solid rgba(0, 0, 0, 0.02); }
.feature-card:hover { background-color: #fff; box-shadow: 0 15px 40px rgba(0, 0, 0, 0.05); transform: translateY(-5px); border-color: #a03516; }
.feature-card-icon { width: 45px; height: 45px; flex-shrink: 0; color: #1a1a1a; }
.feature-card-icon svg, .feature-card-icon img { width: 100%; height: 100%; object-fit: contain; }
.feature-card-content h4 { font-size: 17px; font-weight: 700; margin-bottom: 4px; color: #1a1a1a; letter-spacing: -0.3px; }
.feature-card-content p { font-size: 14px; margin-bottom: 0; color: #777; font-weight: 400; }

/* CATEGORIES SECTION */
.categories-section { background-color: #fff; }
.category-card { position: relative; border-radius: 20px; overflow: hidden; height: 350px; transition: all 0.5s ease; cursor: pointer; }
.category-card-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: transform 0.8s ease; }
.category-card-image img { width: 100%; height: 100%; object-fit: cover; }
.category-card:hover .category-card-image { transform: scale(1.1); }
.category-card-content { position: absolute; bottom: 20px; left: 20px; right: 20px; background: #fff; padding: 25px; border-radius: 15px; transform: translateY(0); transition: all 0.4s ease; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); text-align: left; }
.category-card:hover .category-card-content { padding-bottom: 35px; }
.category-badge { display: inline-block; padding: 4px 12px; background: #f5f5f5; border-radius: 20px; font-size: 11px; font-weight: 600; color: #666; margin-bottom: 12px; text-transform: uppercase; }
.category-card-content h3 { font-size: 20px; font-weight: 800; color: #1a1a1a; margin-bottom: 15px; line-height: 1.2; }
.category-link { font-size: 13px; font-weight: 700; color: #1a1a1a; text-decoration: underline; text-underline-offset: 4px; transition: color 0.3s ease; }
.category-link:hover { color: #a03516; }

/* PRODUCTS SECTION */
.section-title .subtitle { display: block; font-size: 13px; font-weight: 600; color: #777; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px; }
.section-title .title { font-size: 42px; font-weight: 800; color: #1a1a1a; margin-bottom: 0; }
.product-card { background: #fff; border-radius: 20px; overflow: hidden; transition: all 0.3s ease; height: 100%; border: 1px solid rgba(0, 0, 0, 0.02); }
.product-card:hover { background: #fff; box-shadow: 0 15px 40px rgba(0, 0, 0, 0.05); transform: translateY(-5px); border-color: #a03516; }
.card-grey .product-card { background: #f5f5f5; }
.card-grey .product-card:hover { background: #f5f5f5; }
.product-image { position: relative; height: 280px; overflow: hidden; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: opacity 0.5s ease; }
.product-image .hover-img { position: absolute; top: 0; left: 0; opacity: 0; }
.product-card:hover .main-img { opacity: 0; }
.product-card:hover .hover-img { opacity: 1; }
.product-info { padding: 20px; display: flex; align-items: center; justify-content: space-between; }
.product-info .info-left .category { display: block; font-size: 11px; font-weight: 600; color: #888; margin-bottom: 5px; text-transform: uppercase; }
.product-info .info-left .product-title { font-size: 17px; font-weight: 700; color: #1a1a1a; margin-bottom: 5px; }
.product-info .info-left .price { display: block; font-size: 15px; font-weight: 800; color: #1a1a1a; }
.product-info .add-to-cart-btn { width: 45px; height: 45px; border-radius: 50%; border: 1px solid #e0e0e0; background: #fff; display: flex; align-items: center; justify-content: center; color: #1a1a1a; transition: all 0.3s ease; cursor: pointer; flex-shrink: 0; }
.product-info .add-to-cart-btn:hover { background: #a03516; border-color: #a03516; color: #fff; }
.product-info .add-to-cart-btn svg { width: 20px; height: 20px; }

/* =========================================
   CART PAGE
   ========================================= */
.cart { display: flex; gap: 28px; align-items: flex-start; }

/* --- Cart Table Wrapper --- */
.cart-table-wrapper { flex: 1 1 0; min-width: 0; }
.cart-table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #e8e8e8; border-radius: 10px; overflow: hidden; }
.cart-table thead tr { background-color: #f4f5f7; }
.cart-table thead th { padding: 14px 18px; font-size: 13px; font-weight: 700; color: #1a1a1a; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid #e8e8e8; white-space: nowrap; }
.cart-table thead th:first-child { border-radius: 10px 0 0 0; }
.cart-table thead th:last-child { border-radius: 0 10px 0 0; text-align: right; }
.cart-table thead th:not(:first-child):not(:last-child), .cart-table tbody td:not(:first-child):not(:last-child) { text-align: center; }
.cart-table tbody td:last-child { text-align: right; }
.cart-row td { padding: 18px 18px; border-bottom: 1px solid #f0f0f0; font-size: 14px; color: #2a2a2a; vertical-align: middle; }
.cart-row:last-child td { border-bottom: none; }

/* Product cell */
.cart-row-product-inner { display: flex; align-items: center; gap: 14px; }
.cart-row-img { flex-shrink: 0; width: 72px; height: 72px; border: 1px solid #e0e0e0; border-radius: 8px; overflow: hidden; background: #fafafa; display: flex; align-items: center; justify-content: center; }
.cart-row-img img { width: 100%; height: 100%; object-fit: cover; }
.cart-row-info { display: flex; flex-direction: column; gap: 5px; }
.cart-row-name { font-size: 14px; font-weight: 700; color: #1a1a1a; text-decoration: none; line-height: 1.3; transition: color 0.2s; }
.cart-row-name:hover { color: #a03516; }
.cart-row-vat-badge { display: inline-block; font-size: 11px; font-weight: 600; color: #666; background: #f0f0f0; border-radius: 4px; padding: 2px 7px; width: fit-content; }
.cart-row-remove { background: none; border: none; padding: 0; font-size: 12px; font-weight: 600; color: #a03516; cursor: pointer; width: fit-content; transition: color 0.2s; }
.cart-row-remove:hover { color: #e53935; }
.cart-row-price, .cart-row-vat { font-size: 14px; font-weight: 500; color: #444; white-space: nowrap; }
.cart-row-total { font-size: 15px; font-weight: 700; color: #a03516; white-space: nowrap; }
.qty-stepper { display: inline-flex; align-items: center; border: 1px solid #d8d8d8; border-radius: 8px; overflow: hidden; }
.qty-btn { background: #f4f5f7; border: none; width: 32px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #444; transition: background 0.15s, color 0.15s; }
.qty-btn:hover { background: #a03516; color: #fff; }
.qty-input { width: 40px; height: 36px; border: none; border-left: 1px solid #d8d8d8; border-right: 1px solid #d8d8d8; text-align: center; font-size: 14px; font-weight: 600; color: #1a1a1a; outline: none; -moz-appearance: textfield; }
.qty-input::-webkit-inner-spin-button, .qty-input::-webkit-outer-spin-button { -webkit-appearance: none; }
.cart-table-actions { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; flex-wrap: wrap; gap: 10px; }
.cart-action-btn { display: inline-block; font-size: 13px; font-weight: 600; padding: 9px 22px; border-radius: 30px; border: 1.5px solid #d0d0d0; background: transparent; color: #444; cursor: pointer; text-decoration: none; transition: all 0.2s; }
.cart-action-btn--outline:hover { border-color: #a03516; color: #a03516; }
.cart-action-btn--danger { border-color: #e0e0e0; color: #888; }
.cart-action-btn--danger:hover { border-color: #e53935; color: #e53935; }

/* --- Order Summary Box --- */
.order-summary { flex: 0 0 300px; background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; padding: 26px 24px; position: sticky; top: 100px; }
.order-summary-title { font-size: 20px; font-weight: 700; color: #1a1a1a; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid #f0f0f0; }
.order-summary-rows { display: flex; flex-direction: column; gap: 0; margin-bottom: 6px; }
.order-summary-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; font-size: 14px; color: #555; border-bottom: 1px solid #f4f4f4; }
.order-summary-row span:last-child { font-weight: 600; color: #1a1a1a; }
.order-summary-total { display: flex; justify-content: space-between; align-items: center; padding: 16px 0 18px; font-size: 16px; font-weight: 700; color: #1a1a1a; }
.order-summary-total-price { font-size: 24px; font-weight: 800; color: #a03516; letter-spacing: -0.5px; }
.order-summary-checkout-btn { display: block; width: 100%; text-align: center; background: #a03516; color: #fff; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 14px 20px; border-radius: 8px; text-decoration: none; transition: background 0.2s, transform 0.15s; }
.order-summary-checkout-btn:hover { background: #a65841c9; transform: translateY(-1px); color: #fff; }

@media (max-width: 900px) {
    .cart { flex-direction: column; }
    .order-summary { flex: none; width: 100%; position: static; }
    .cart-table thead th:nth-child(3), .cart-row td:nth-child(3) { display: none; }
}
@media (max-width: 600px) {
    .cart-table thead th:nth-child(2), .cart-row td:nth-child(2) { display: none; }
    .cart-row-img { width: 54px; height: 54px; }
    .cart-table thead th, .cart-row td { padding: 12px 10px; }
}

/* CART ITEMS */
.cart-items-list { padding: 20px 0; }
.cart-item { display: flex; align-items: center; gap: 14px; padding: 15px 0; border-bottom: 1px solid #eee; }
.cart-item:last-child { border-bottom: 0; padding-bottom: 0; }
.cart-item-img { width: 64px; height: 64px; border: 1px solid #e0e0e0; border-radius: 6px; overflow: hidden; flex-shrink: 0; background: #fafafa; }
.cart-item-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.cart-item-info { flex-grow: 1; min-width: 0; }
.cart-item-info h4 { font-size: 14px; font-weight: 700; margin-bottom: 3px; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cart-item-info h4 a { color: #1a1a1a; text-decoration: none; }
.cart-item-vat { display: block; font-size: 12px; color: #999; margin-bottom: 4px; }
.cart-item-qty { display: block; font-size: 13px; color: #444; font-weight: 500; }
.cart-item-price-col { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; }
.cart-item-price-col .item-price { font-size: 15px; color: #a03516; font-weight: 700; }
.cart-item-remove { background: none; border: none; color: #ccc; cursor: pointer; transition: color 0.3s ease; padding: 0; display: flex; align-items: center; }
.cart-item-remove:hover { color: #e53935; }
.cart-summary { margin-bottom: 16px; }
.cart-summary-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 14px; color: #555; border-bottom: 1px solid #eee; }
.cart-summary-row:last-child { border-bottom: none; }
.cart-summary-total { padding-top: 10px; font-size: 16px; color: #1a1a1a; }
.cart-summary-total strong:last-child { color: #a03516; font-size: 18px; }
.cart-actions { display: flex; flex-direction: column; gap: 10px; }
.cart-btn-view { display: block; width: 100%; padding: 12px 16px; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: #a03516; background: #fff; border: 2px solid #a03516; border-radius: 4px; text-decoration: none; transition: background 0.2s, color 0.2s; }
.cart-btn-view:hover { background: #a03516; color: #fff; }
.cart-btn-checkout { display: block; width: 100%; padding: 13px 16px; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: #fff; background: #a03516; border: 2px solid #a03516; border-radius: 4px; text-decoration: none; transition: background 0.2s; }
.cart-btn-checkout:hover { background: ##9d3a1dd1; border-color: ##9d3a1dd1; color: #fff; }
.cart-btn-clear { display: block; width: 100%; padding: 10px 16px; text-align: center; font-size: 13px; font-weight: 600; color: #e53935; background: #fff; border: 1.5px solid #e5393550; border-radius: 4px; cursor: pointer; transition: background 0.2s, color 0.2s; }
.cart-btn-clear:hover { background: #fdecea; }

/* CTA SECTION */
.cta-section { position: relative; padding: 100px 0; background: url('../images/footer-bg.png') no-repeat center center / cover; color: #fff; text-align: center; overflow: hidden; }
.cta-section::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1; }
.cta-section .container { position: relative; z-index: 2; }
.cta-subtitle { display: block; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 20px; color: #a03516; }
.cta-title { font-size: 48px; font-weight: 900; margin-bottom: 40px; line-height: 1.2; }
.cta-title span { color: #a03516; }
.countdown-wrapper { display: flex; justify-content: center; gap: 30px; margin-bottom: 50px; }
.countdown-item { display: flex; flex-direction: column; align-items: center; }
.countdown-item .number { font-size: 42px; font-weight: 900; line-height: 1; color: #fff; }
.countdown-item .label { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: rgba(255, 255, 255, 0.6); margin-top: 10px; }
.countdown-separator { font-size: 32px; font-weight: 900; color: rgba(255, 255, 255, 0.3); padding-top: 5px; }
.cta-button { display: inline-block; padding: 18px 45px; background: #a03516; color: #fff; font-weight: 700; border-radius: 5px; text-transform: uppercase; letter-spacing: 1px; transition: all 0.3s ease; border: 2px solid #a03516; }
.cta-button:hover { background: transparent; color: #a03516; }

/* DARK FOOTER REFACTOR */
footer { position: relative; background: url('../images/footer-bg-2.jpg') no-repeat center center / cover; color: #222; overflow: hidden; }
footer::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); z-index: 1; }
footer .footer-wrapper, footer .footer-copyright { position: relative; z-index: 2; }
footer .footer-wrapper { padding: 80px 0 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
footer h5 { color: #fff; font-weight: 700; margin-bottom: 25px; }
footer .footer-link-list li a { color: rgb(215 215 215); transition: all 0.3s ease; }
footer .footer-link-list li a:hover { color: #a03516; padding-left: 5px; }
footer .footer-text { color: rgb(215 215 215); }
footer .copyright-wrapper { color: rgb(215 215 215); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
footer .brand-logo img { filter: brightness(0) invert(1); }

/* FOOTER TOP FEATURES */
.footer-top-features { position: relative; z-index: 2; padding: 40px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.footer-feature-item { display: flex; align-items: center; justify-content: center; gap: 15px; color: #fff; }
.footer-feature-item img { width: 30px; height: 30px; object-fit: contain; filter: brightness(0) invert(1); }
.footer-feature-item h4 { font-size: 14px; font-weight: 700; margin: 0; letter-spacing: 1px; text-transform: uppercase; }

/* PAYMENT ICONS */
.footer-secondary { display: flex; align-items: center; gap: 15px; }
.payment-icons { display: flex; align-items: center; gap: 38px; width: 100%; justify-content: center; padding-top: 1.5rem; border-top: 1px solid #dddddd4f; }
.payment-icon { width: 45px; height: 25px; display: flex; align-items: center; justify-content: center; opacity: 0.6; transition: opacity 0.3s ease; }
.payment-icon:hover { opacity: 1; }
.payment-icon svg { width: 100%; height: 100%; fill: #fff; }

/* OUR PRODUCTS SECTION */
.premium-product-card { background: #fff; border-radius: 24px; overflow: hidden; height: 100%; display: flex; flex-direction: column; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid rgba(0, 0, 0, 0.05); position: relative; }
.premium-product-card:hover { transform: translateY(-12px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); border-color: rgba(255, 127, 5, 0.2); }
.premium-product-card .card-image { position: relative; overflow: hidden; aspect-ratio: 16/10; }
.premium-product-card .card-image::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.2) 100%); opacity: 0; transition: opacity 0.5s ease; }
.premium-product-card:hover .card-image::after { opacity: 1; }
.premium-product-card .card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
.premium-product-card:hover .card-image img { transform: scale(1.12); }
.premium-product-card .card-content { padding: 35px; display: flex; flex-direction: column; flex-grow: 1; }
.premium-product-card .card-title { font-size: 1.45rem; font-weight: 800; margin-bottom: 18px; color: #1a1a1a; transition: color 0.3s ease; line-height: 1.3; }
.premium-product-card:hover .card-title { color: #a03516; }
.premium-product-card .card-description { font-size: 0.95rem; line-height: 1.7; color: #555; margin-bottom: 30px; flex-grow: 1; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.premium-product-card .card-link { display: inline-flex; align-items: center; gap: 8px; color: #a03516; font-weight: 700; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1.5px; transition: all 0.3s ease; width: fit-content; position: relative; }
.premium-product-card .card-link svg { width: 18px; height: 18px; transition: transform 0.3s ease; }
.premium-product-card .card-link:hover { gap: 12px; color: #a03516; }
.premium-product-card .card-link:hover svg { transform: translateX(5px); }

/* BLOG CARD */
.blog-card { background: #fff; border-radius: 24px; overflow: hidden; height: 100%; display: flex; flex-direction: column; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid rgba(0, 0, 0, 0.05); position: relative; }
.blog-card:hover { transform: translateY(-12px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); border-color: rgba(255, 127, 5, 0.2); }
.blog-card .card-image { position: relative; overflow: hidden; aspect-ratio: 16/10; }
.blog-card .card-image::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.2) 100%); opacity: 0; transition: opacity 0.5s ease; }
.blog-card:hover .card-image::after { opacity: 1; }
.blog-card .card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
.blog-card:hover .card-image img { transform: scale(1.12); }
.blog-card .card-content { padding: 24px; display: flex; flex-direction: column; flex-grow: 1; }
.blog-card .blog-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; font-size: 0.85rem; }
.blog-card .blog-date { color: #999; font-weight: 500; }
.blog-card .blog-category { color: #a03516; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.5px; }
.blog-card .card-title { font-size: 1.45rem; font-weight: 800; margin-bottom: 18px; color: #1a1a1a; transition: color 0.3s ease; line-height: 1.3; }
.blog-card .card-title a { color: inherit; text-decoration: none; }
.blog-card:hover .card-title { color: #a03516; }
.blog-card .card-description { font-size: 0.95rem; line-height: 1.7; color: #555; margin-bottom: 30px; flex-grow: 1; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.blog-card .card-link { display: inline-flex; align-items: center; gap: 8px; color: #a03516; font-weight: 700; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1.5px; transition: all 0.3s ease; width: fit-content; text-decoration: none; }
.blog-card .card-link svg { width: 18px; height: 18px; transition: transform 0.3s ease; }
.blog-card .card-link:hover { gap: 12px; color: #9d3a1dd1; }
.blog-card .card-link:hover svg { transform: translateX(5px); }

/* AUTH MODAL */
.auth-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.82); z-index: 11000; justify-content: center; align-items: center; backdrop-filter: blur(10px); padding: 20px; }
.auth-modal.active { display: flex; }
.auth-modal-content { background: #fff; width: 100%; max-width: 750px; max-height: 90vh; border-radius: 30px; position: relative; padding: 0; overflow: hidden; box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3); animation: modalAppear 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); }

@keyframes modalAppear {
    from { opacity: 0; transform: scale(0.95) translateY(40px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.auth-modal-close { position: absolute; top: 25px; right: 25px; background: #f1f3f5; border: none; width: 45px; height: 45px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #1a1a1a; transition: all 0.3s ease; z-index: 100; }
.auth-modal-close:hover { background: #a03516; color: #fff; transform: rotate(90deg); }
.auth-modal-body { padding: 40px 50px; overflow-y: auto; max-height: calc(90vh - 80px); }
.auth-modal-header { margin-bottom: 30px; text-align: center; }
.auth-modal-header h2 { font-size: 2.2rem; font-weight: 800; color: #1a1a1a; margin-bottom: 12px; }
.auth-modal-header p { color: #6b7280; font-size: 1rem; max-width: 400px; margin: 0 auto; }
.auth-login-form, .keremiya-form-register { display: none; }
.auth-login-form.active, .keremiya-form-register.active { display: block; }
.form-row { margin-bottom: 18px; position: relative; }
.form-row-wide { width: 100%; }
.auth-modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 20px; }
.auth-modal-grid .form-row { margin-bottom: 0; }
.auth-modal-grid .form-row-wide { grid-column: span 2; }
.form-section-title { grid-column: span 2; font-size: 0.95rem; font-weight: 800; color: #1a1a1a; margin-top: 10px; margin-bottom: 5px; padding-bottom: 8px; border-bottom: 1px solid #f3f4f6; }
.form-section-title:first-child { margin-top: 0; }
.input-text, .input-password, .auth-modal select, .static-auth-wrapper select { width: 100%; padding: 10px 15px; border: 1.5px solid #e5e7eb; border-radius: 12px; font-size: 0.9rem; color: #1a1a1a; transition: all 0.3s ease; background: #fcfcfc; }
.input-text:focus, .input-password:focus, .auth-modal select:focus, .static-auth-wrapper select:focus { border-color: #a03516; background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(255, 127, 5, 0.08); }
.form-row label { font-weight: 700; margin-bottom: 5px; color: #4b5563; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; }
.form-row label.fw-bold { text-transform: none; font-size: 0.95rem; color: #1a1a1a; letter-spacing: normal; }
.required { color: #ef4444; margin-left: 2px; }
.auth-modal .button-large, .static-auth-wrapper .button-large { background: #a03516; color: #fff; padding: 16px 30px; border: none; border-radius: 16px; font-weight: 800; font-size: 1rem; cursor: pointer; transition: all 0.3s ease; display: inline-block; width: 100%; margin-top: 10px; text-align: center; }
.auth-modal .button-large:hover, .static-auth-wrapper .button-large:hover { background: #9d3a1dd1; transform: translateY(-3px); box-shadow: 0 10px 20px rgba(255, 127, 5, 0.2); }
.form-step { display: none; animation: fadeIn 0.4s ease; }
.form-step.active { display: block; }

.auth-modal-footer { border-top: 1px solid #f3f4f6; padding: 25px 50px; text-align: center; background: #f9fafb; }
.auth-modal-footer p { margin-bottom: 0; font-size: 0.95rem; color: #6b7280; }
.auth-modal-footer a { color: #a03516; font-weight: 800; text-decoration: none; margin-left: 5px; transition: color 0.3s ease; }
.auth-modal-footer a:hover { color: #9d3a1dd1; }
.radio { display: flex; align-items: center; gap: 8px; padding: 3px 0; background: transparent; border: none; cursor: pointer; transition: all 0.2s ease; margin-bottom: 0; }
.radio:hover { opacity: 0.8; }
.radio input[type="radio"] { width: 15px; height: 15px; accent-color: #a03516; margin: 0; flex-shrink: 0; }
.radio span { font-weight: 600; color: #374151; font-size: 0.8rem; line-height: 1.2; }
.radio-group { display: grid !important; grid-template-columns: repeat(2, 1fr); gap: 5px 10px; }

@media (max-width: 991px) {
    .auth-modal-grid, .radio-group { grid-template-columns: 1fr; }
}

.other-text { margin-top: 10px; }
.select-style { display: block; position: relative; }
.select-style::after { content: '▼'; font-size: 10px; color: #6b7280; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.auth-modal select, .static-auth-wrapper select { appearance: none; padding-right: 35px; }
.text-align-right { text-align: right; }

/* Static Auth Wrapper Styles */
.static-auth-wrapper { background: #fff; padding: 40px; border-radius: 30px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.05); border: 1px solid #f1f3f5; }
.static-auth-wrapper .auth-modal-header { text-align: left; margin-bottom: 30px; }
.static-auth-wrapper .auth-modal-header h2 { font-size: 2rem; margin-bottom: 8px; }
.static-auth-wrapper .auth-modal-header p { margin: 0; }

@media (max-width: 768px) {
    .static-auth-wrapper { padding: 30px 20px; }
}

/* ================================================
   MEGA DROPDOWN MENU
   ================================================ */
.nav-item.mega-dropdown { position: static !important; }
.mega-menu { position: absolute; top: 100%; left: 0; width: 100%; background: #fff; border-top: 3px solid #a03516; box-shadow: 0 28px 70px rgba(0, 0, 0, 0.11); padding: 30px 0 28px; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 0.22s ease, visibility 0.22s ease, transform 0.22s ease; z-index: 1000; }
.mega-dropdown:hover .mega-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.mega-menu-inner { display: flex; align-items: flex-start; gap: 0; }

/* ---- Left Navigation Panel (single column) ---- */
.mega-menu-nav { display: flex; flex-direction: column; flex-shrink: 0; padding-right: 32px; margin-right: 32px; border-right: 1px solid #ebebeb; gap: 0; }
.mega-nav-group { min-width: 185px; }
.mega-nav-group--second { margin-top: 8px; padding-top: 8px; border-top: 1px solid #ebebeb; }
.mega-nav-label { display: block; font-size: 10px; font-weight: 700; color: #b5b5b5; letter-spacing: 2px; text-transform: uppercase; padding-bottom: 12px; border-bottom: 1px solid #ebebeb; margin-bottom: 8px; }
.mega-nav-list { list-style: none; padding: 0; margin: 0; }
.mega-nav-list li { line-height: 1; }
.mega-nav-list li a { display: block; font-size: 14px; font-weight: 400; color: #2a2a2a; padding: 9px 0; text-decoration: none; border-bottom: 1px solid transparent; transition: color 0.18s ease, border-color 0.18s ease; white-space: nowrap; line-height: 1.2; }
.mega-nav-list li a:hover, .mega-nav-list li.mega-nav-item-active a { color: #a03516; border-bottom-color: rgba(255, 142, 1, 0.25); }

/* ---- Middle Product Cards ---- */
.mega-menu-products-wrapper { position: relative; flex: 8; margin-right: 24px; min-width: 0; min-height: 220px; }
.products-panel { display: flex; gap: 12px; position: absolute; top: 0; left: 0; width: 100%; opacity: 0; pointer-events: none; transition: opacity 0.22s ease; }
.products-panel.active { opacity: 1; pointer-events: auto; position: relative; }
.products-panel .product-card { flex: 1; min-width: 0; }
.products-panel .product-image { height: 150px !important; }
.mega-menu-products { display: flex; gap: 12px; flex: 8; margin-right: 24px; min-width: 0; }
.mega-menu-products .product-card { flex: 1; min-width: 0; }
.mega-menu-products .product-image { height: 150px !important; }

/* ---- Right CTA Banner ---- */
.mega-menu-cta { flex: 5; flex-shrink: 0; width: auto; min-height: 280px; border-radius: 16px; background: linear-gradient(150deg, #1a1a2e 0%, #16213e 45%, #0f3460 100%); position: relative; overflow: hidden; display: flex; align-items: flex-end; }
.mega-cta-deco-circle { position: absolute; border-radius: 50%; pointer-events: none; }
.mega-cta-deco-circle--top { top: -40px; right: -40px; width: 190px; height: 190px; background: radial-gradient(circle, rgba(255, 142, 1, 0.18) 0%, transparent 70%); }
.mega-cta-deco-circle--bottom { bottom: 55%; left: -25px; width: 130px; height: 130px; background: radial-gradient(circle, rgba(255, 142, 1, 0.1) 0%, transparent 70%); }
.mega-cta-content { position: relative; z-index: 2; padding: 22px 20px; }
.mega-cta-tag { display: inline-block; font-size: 9px; font-weight: 700; color: #a03516; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 10px; }
.mega-cta-title { font-size: 15px; font-weight: 700; color: #fff; line-height: 1.45; margin-bottom: 10px; }
.mega-cta-desc { font-size: 11px; color: rgba(255, 255, 255, 0.55); line-height: 1.65; margin-bottom: 18px; }
.mega-cta-btn { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; color: #1a1a1a; background: #a03516; padding: 9px 16px; border-radius: 8px; text-decoration: none; letter-spacing: 0.6px; text-transform: uppercase; transition: background 0.2s ease, transform 0.2s ease; }
.mega-cta-btn:hover { background: #e07e00; color: #fff; transform: translateY(-1px); }

@media (max-width: 991px) {
    .mega-menu { display: none !important; }
}

/* =================== CHECKOUT PAGE =================== */
.small-hero { height: 200px; }
.checkout-steps { display: flex; align-items: center; justify-content: center; }
.checkout-step { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #bbb; }
.checkout-step.active { color: #a03516; }
.checkout-step.done { color: #22c55e; }
.checkout-step-num { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; background: #eee; color: #bbb; flex-shrink: 0; }
.checkout-step.active .checkout-step-num { background: #a03516; color: #fff; }
.checkout-step.done .checkout-step-num { background: #22c55e; color: #fff; }
.checkout-step-divider { width: 60px; height: 2px; background: #e8e8e8; margin: 0 10px; }
.checkout-section-card { background: #fff; border-radius: 16px; box-shadow: 0 2px 24px rgba(0,0,0,0.06); padding: 28px 32px; margin-bottom: 20px; border: 1px solid rgba(0,0,0,0.05); }
.checkout-section-title { font-size: 15px; font-weight: 700; color: #1a1a1a; margin-bottom: 24px; display: flex; align-items: center; gap: 10px; padding-bottom: 16px; border-bottom: 1px solid #f0f0f0; }
.section-icon { width: 34px; height: 34px; background: #fff5eb; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #a03516; flex-shrink: 0; }
.checkout-label { font-size: 11px; font-weight: 700; color: #777; text-transform: uppercase; letter-spacing: 0.6px; margin-bottom: 6px; display: block; }
.checkout-input { width: 100%; border: 1.5px solid #e8e8e8; border-radius: 10px; padding: 11px 15px; font-size: 14px; font-weight: 500; color: #1a1a1a; background: #fafafa; font-family: "Red Hat Display", sans-serif; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; outline: none; display: block; }
.checkout-input:focus { border-color: #a03516; background: #fff; box-shadow: 0 0 0 3px rgba(255,127,2,0.1); }
select.checkout-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23888'%3E%3Cpath d='M12 15L7 10h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 18px; padding-right: 38px; cursor: pointer; }
textarea.checkout-input { resize: vertical; min-height: 90px; }
.ship-toggle-label { display: flex; align-items: center; gap: 12px; background: #f8f8f8; border: 1.5px solid transparent; border-radius: 10px; padding: 13px 16px; cursor: pointer; transition: all 0.2s; }
.ship-toggle-label:hover { border-color: #a03516; background: #fff8f2; }
.ship-toggle-label input[type="checkbox"] { accent-color: #a03516; width: 17px; height: 17px; flex-shrink: 0; cursor: pointer; }
.order-summary-card { background: #fff; border-radius: 16px; box-shadow: 0 2px 24px rgba(0,0,0,0.07); border: 1px solid rgba(0,0,0,0.05); top: 100px; overflow: hidden; }
.order-summary-header { padding: 22px 26px 18px; border-bottom: 1px solid #f0f0f0; display: flex; align-items: center; justify-content: space-between; }
.order-summary-header h4 { font-size: 15px; font-weight: 700; color: #1a1a1a; margin: 0; display: flex; align-items: center; gap: 8px; }
.order-summary-header .cart-count-badge { background: #a03516; color: #fff; font-size: 10px; font-weight: 700; border-radius: 20px; padding: 1px 8px; }
.order-items-list { padding: 0 26px; max-height: 280px; overflow-y: auto; }
.order-items-list::-webkit-scrollbar { width: 4px; }
.order-items-list::-webkit-scrollbar-thumb { background: #e0e0e0; border-radius: 4px; }
.co-cart-item { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 13px 0; border-bottom: 1px solid #f5f5f5; }
.co-cart-item:last-child { border-bottom: none; }
.co-cart-item-name { font-size: 13px; font-weight: 600; color: #1a1a1a; line-height: 1.4; margin-bottom: 4px; }
.co-cart-item-meta { font-size: 11px; color: #aaa; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 2px; }
.badge-vat { background: #f0f0f0; color: #888; font-size: 10px; padding: 2px 6px; border-radius: 4px; font-weight: 600; }
.badge-project { background: #e8f4ff; color: #0070cc; font-size: 10px; padding: 2px 6px; border-radius: 4px; font-weight: 600; }
.co-cart-item-price { font-size: 13px; font-weight: 700; color: #1a1a1a; white-space: nowrap; }
.order-totals { padding: 14px 26px 0; border-top: 1px solid #f0f0f0; background: #fafafa; }
.totals-row { display: flex; justify-content: space-between; font-size: 13px; color: #777; padding: 5px 0; }
.totals-row.grand-total { font-size: 18px; font-weight: 800; color: #1a1a1a; padding-top: 12px; padding-bottom: 12px; margin-top: 6px; }
.totals-row.grand-total span:last-child { color: #a03516; }
.pay-method-card { border: 2px solid #e8e8e8; border-radius: 12px; padding: 14px 16px; cursor: pointer; transition: all 0.2s; margin-bottom: 10px; display: flex; align-items: flex-start; gap: 12px; user-select: none; }
.pay-method-card:hover { border-color: #ffb46e; }
.pay-method-card.selected { border-color: #a03516; background: #fff9f5; }
.pay-method-card input[type="radio"] { accent-color: #a03516; width: 17px; height: 17px; flex-shrink: 0; margin-top: 2px; cursor: pointer; }
.pay-method-icon { width: 36px; height: 36px; background: #f0f0f0; border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pay-method-label { font-size: 13px; font-weight: 700; color: #1a1a1a; display: block; margin-bottom: 2px; }
.pay-method-desc { font-size: 11px; color: #999; line-height: 1.5; }
.card-brand-pills { display: flex; gap: 5px; margin-top: 4px; }
.card-brand-pill { border: 1px solid #ddd; border-radius: 5px; padding: 2px 7px; font-size: 9px; font-weight: 800; color: #555; background: #fafafa; letter-spacing: 0.3px; }
.stripe-ui-wrapper { background: #f8f8f8; border: 1.5px solid #e8e8e8; border-radius: 12px; padding: 16px; margin-top: 4px; }
#card-element { background: #fff; border: 1.5px solid #e0e0e0; border-radius: 9px; padding: 13px 14px; transition: border-color 0.2s; }
#card-errors { color: #e53e3e; font-size: 12px; font-weight: 600; margin-top: 8px; display: flex; align-items: center; gap: 5px; }
.place-order-btn { background: linear-gradient(197deg, #9a2807 0%, #d55151 100%); color: #fff; border: none; border-radius: 12px; padding: 15px 20px; font-size: 15px; font-weight: 700; width: 100%; cursor: pointer; font-family: "Red Hat Display", sans-serif; letter-spacing: 0.3px; transition: all 0.25s; display: flex; align-items: center; justify-content: center; gap: 9px; }
.place-order-btn:hover { background: linear-gradient(135deg, #9a2807 0%, #d55151 100%); box-shadow: 0 6px 22px rgba(255,127,2,0.32); transform: translateY(-1px); }
.place-order-btn:disabled { opacity: 0.68; transform: none; cursor: not-allowed; box-shadow: none; }
.secure-checkout-note { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 11px; color: #bbb; padding: 10px 0 0; }

#shippingSection { animation: fadeIn 0.25s ease; }

@media (max-width: 768px) {
    .checkout-section-card { padding: 20px; }
    .order-summary-card { position: static; margin-top: 0; }
    .checkout-steps { gap: 0; }
    .checkout-step-divider { width: 30px; margin: 0 6px; }
    .checkout-step span { display: none; }
}

/* =================== DASHBOARD =================== */
.db-sidebar { position: sticky; top: 0px; }
.db-nav { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); overflow: hidden; margin-bottom: 16px; }
.db-nav-item { display: flex; align-items: center; gap: 10px; padding: 13px 20px; font-size: 13px; font-weight: 600; color: #555; border-left: 3px solid transparent; transition: all 0.2s; text-decoration: none; border-bottom: 1px solid #f5f5f5; }
.db-nav-item:last-child { border-bottom: none; }
.db-nav-item:hover { background: #fff8f2; color: #a03516; border-left-color: #a03516; }
.db-nav-item.active { background: #a03516; color: #fff; border-left-color: #a03516; }
.db-nav-item.active svg { fill: #fff; }
.db-nav-logout { color: #e53e3e; }
.db-nav-logout:hover { background: #fff5f5; color: #e53e3e; border-left-color: #e53e3e; }
.db-account-status { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; }
.db-status-label { font-size: 12px; font-weight: 700; color: #aaa; text-transform: uppercase; letter-spacing: 0.5px; }
.db-status-badge { display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; border-radius: 20px; padding: 5px 14px; width: fit-content; }
.db-status-pending { background: #a03516; color: #fff; }
.db-status-approved { background: #22c55e; color: #fff; }
.db-status-rejected { background: #e53e3e; color: #fff; }
.db-welcome-banner { background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 60%, #3a2800 100%); border-radius: 16px; padding: 28px 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.db-welcome-title { font-size: 22px; font-weight: 800; color: #fff; margin: 0 0 4px; }
.db-welcome-sub { font-size: 13px; color: rgba(255,255,255,0.6); margin: 0; }
.db-welcome-btn { background: #fff; color: #1a1a1a; font-size: 13px; font-weight: 700; border-radius: 10px; padding: 10px 20px; text-decoration: none; white-space: nowrap; transition: all 0.2s; flex-shrink: 0; }
.db-welcome-btn:hover { background: #a03516; color: #fff; }
.db-stat-card { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.db-stat-num { display: block; font-size: 34px; font-weight: 800; color: #1a1a1a; line-height: 1; margin-bottom: 4px; }
.db-stat-label { display: block; font-size: 10px; font-weight: 700; color: #aaa; text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 10px; }
.db-stat-link { font-size: 12px; font-weight: 700; color: #a03516; text-decoration: none; transition: gap 0.2s; }
.db-stat-link:hover { color: #a03516; }
.db-stat-icon { width: 52px; height: 52px; background: #fff5eb; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #a03516; flex-shrink: 0; }
.db-stat-icon--green { background: #f0fdf4; color: #22c55e; }
.db-empty-activity { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); padding: 48px 24px; text-align: center; }
.db-empty-icon { color: #d0d0d0; margin-bottom: 16px; }
.db-empty-title { font-size: 16px; font-weight: 700; color: #1a1a1a; margin-bottom: 6px; }
.db-empty-desc { font-size: 13px; color: #aaa; max-width: 360px; margin: 0 auto 24px; line-height: 1.6; }
.db-empty-actions { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.db-btn-primary { background: #a03516; color: #fff; font-size: 13px; font-weight: 700; border-radius: 10px; padding: 10px 22px; text-decoration: none; transition: all 0.2s; border:1px solid #a03516; }
.db-btn-primary:hover { background: #a03516; color: #fff; box-shadow: 0 4px 14px rgba(255,127,2,0.3); }
.db-btn-secondary { background: #f5f5f5; color: #1a1a1a; font-size: 13px; font-weight: 700; border-radius: 10px; padding: 10px 22px; text-decoration: none; transition: all 0.2s; border: 1.5px solid #e8e8e8; }
.db-btn-secondary:hover { background: #ebebeb; color: #1a1a1a; }

@media (max-width: 767px) {
    .db-sidebar { position: static; }
    .db-welcome-banner { padding: 22px 20px; }
    .db-welcome-title { font-size: 18px; }
    .db-stat-card { padding: 18px 20px; }
    .db-stat-num { font-size: 28px; }
}

/* =================== PROJECT FORM =================== */
.pf-card { background: #fff; border-radius: 16px; box-shadow: 0 2px 24px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); overflow: hidden; }
.pf-card-header { display: flex; align-items: flex-start; gap: 16px; padding: 24px 30px; border-bottom: 1px solid #f0f0f0; background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 60%, #3a2800 100%); }
.pf-card-header-icon { width: 44px; height: 44px; background: rgba(255,127,2,0.2); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #a03516; flex-shrink: 0; margin-top: 2px; }
.pf-card-title { font-size: 17px; font-weight: 800; color: #fff; margin: 0 0 3px; }
.pf-card-sub { font-size: 12px; color: rgba(255,255,255,0.55); margin: 0; }
.pf-section { padding: 24px 30px; border-bottom: 1px solid #f5f5f5; }
.pf-section:last-of-type { border-bottom: none; }
.pf-section-title { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 800; color: #888; text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 18px; }
.pf-section-title svg { color: #a03516; flex-shrink: 0; }
.pf-agent-info { background: #fafafa; border: 1.5px solid #f0f0f0; border-radius: 12px; padding: 16px 20px; }
.pf-label { font-size: 11px; font-weight: 700; color: #777; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; display: block; }
.pf-input { width: 100%; border: 1.5px solid #e8e8e8; border-radius: 10px; padding: 10px 14px; font-size: 13px; font-weight: 500; color: #1a1a1a; background: #fafafa; font-family: "Red Hat Display", sans-serif; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s; outline: none; display: block; }
.pf-input:focus { border-color: #a03516; background: #fff; box-shadow: 0 0 0 3px rgba(255,127,2,0.1); }
.pf-input:disabled { background: #f0f0f0; color: #aaa; cursor: not-allowed; }
select.pf-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23888'%3E%3Cpath d='M12 15L7 10h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 18px; padding-right: 36px; cursor: pointer; }
textarea.pf-input { resize: vertical; min-height: 80px; }
.pf-radio-group { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pf-radio-card { border: 2px solid #e8e8e8; border-radius: 12px; padding: 16px; cursor: pointer; transition: all 0.2s; display: flex; flex-direction: column; gap: 10px; user-select: none; }
.pf-radio-card:hover { border-color: #ffb46e; background: #fffaf5; }
.pf-radio-card.selected, .pf-radio-card:has(input:checked) { border-color: #a03516; background: #fff9f5; }
.pf-radio-card input[type="radio"] { display: none; }
.pf-radio-icon { width: 38px; height: 38px; background: #f0f0f0; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #888; transition: all 0.2s; }
.pf-radio-card.selected .pf-radio-icon, .pf-radio-card:has(input:checked) .pf-radio-icon { background: #fff5eb; color: #a03516; }
.pf-radio-label { display: block; font-size: 13px; font-weight: 700; color: #1a1a1a; margin-bottom: 2px; }
.pf-radio-desc { display: block; font-size: 11px; color: #aaa; line-height: 1.4; }
.pf-toggle-check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; padding: 8px 0; font-size: 13px; font-weight: 500; color: #444; user-select: none; }
.pf-toggle-check input[type="checkbox"] { display: none; }
.pf-toggle-box { width: 18px; height: 18px; border: 2px solid #d0d0d0; border-radius: 5px; flex-shrink: 0; margin-top: 1px; transition: all 0.2s; position: relative; background: #fff; display: inline-block; margin-bottom: -3px; margin-right: 5px; }
.pf-toggle-check input:checked ~ .pf-toggle-box { background: #a03516; border-color: #a03516; }
.pf-toggle-check input:checked ~ .pf-toggle-box::after { content: ''; position: absolute; left: 4px; top: 1px; width: 6px; height: 10px; border: 2px solid #fff; border-top: none; border-left: none; transform: rotate(45deg); }
.pf-checks-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-bottom: 16px; }
.pf-agree-check { background-color: #ffc58b1c; border: 1px solid #ff871252; padding: 10px; border-radius: 5px; }
.pf-agree-check input[type="checkbox"] { display: none; }
.pf-agree-check input:checked ~ .pf-toggle-box { background: #a03516; border-color: #a03516; }
.pf-agree-check input:checked ~ .pf-toggle-box::after { content: ''; position: absolute; left: 4px; top: 1px; width: 6px; height: 10px; border: 2px solid #fff; border-top: none; border-left: none; transform: rotate(45deg); }
.pf-upload-area { border: 2px dashed #d8d8d8; border-radius: 12px; padding: 32px 20px; text-align: center; cursor: pointer; transition: all 0.2s; background: #fafafa; }
.pf-upload-area:hover, .pf-upload-area.drag-over { border-color: #a03516; background: #fff9f5; }
.pf-upload-area.drag-over { transform: scale(1.01); }
.pf-upload-icon { color: #ccc; margin-bottom: 10px; }
.pf-upload-area:hover .pf-upload-icon, .pf-upload-area.drag-over .pf-upload-icon { color: #a03516; }
.pf-upload-text { font-size: 13px; font-weight: 600; color: #888; margin-bottom: 4px; }
.pf-upload-hint { font-size: 11px; color: #bbb; margin: 0; }
.pf-file-name { margin-top: 10px; font-size: 12px; font-weight: 600; color: #22c55e; display: flex; align-items: center; gap: 5px; }
.pf-field-note { font-size: 11px; color: #aaa; margin-top: 5px; display: block; }
.pf-password-wrap { position: relative; }
.pf-password-wrap .pf-input { padding-right: 42px; }
.pf-pwd-toggle { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 0; cursor: pointer; color: #bbb; opacity: 0.5; transition: opacity 0.2s, color 0.2s; display: flex; align-items: center; }
.pf-pwd-toggle:hover { opacity: 1; color: #a03516; }
.pf-submit-row { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 20px 30px 28px; border-top: 1px solid #f0f0f0; }
.pf-cancel-btn { font-size: 13px; font-weight: 600; color: #888; text-decoration: none; padding: 11px 22px; border-radius: 10px; border: 1.5px solid #e8e8e8; background: #fafafa; transition: all 0.2s; }
.pf-cancel-btn:hover { background: #f0f0f0; color: #555; }
.pf-submit-btn { background: linear-gradient(135deg, #a03516 0%, #ff9d3d 100%); color: #fff; border: none; border-radius: 10px; padding: 12px 28px; font-size: 14px; font-weight: 700; font-family: "Red Hat Display", sans-serif; cursor: pointer; display: flex; align-items: center; gap: 8px; transition: all 0.25s; }
.pf-submit-btn:hover { background: linear-gradient(135deg, #a03516 0%, #ff8c1f 100%); box-shadow: 0 6px 20px rgba(255,127,2,0.3); transform: translateY(-1px); }

@media (max-width: 991px) {
    .pf-radio-group { grid-template-columns: 1fr; }
    .pf-checks-grid { grid-template-columns: 1fr; }
    .pf-section { padding: 20px; }
    .pf-card-header { padding: 20px; }
    .pf-submit-row { padding: 16px 20px 20px; }
}

/* =================== MY PROJECTS PAGE =================== */
.mp-card { background: #fff; border-radius: 16px; box-shadow: 0 2px 24px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.05); overflow: hidden; }
.mp-card-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 24px; border-bottom: 1px solid #f0f0f0; background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 60%, #3a2800 100%); }
.mp-toolbar-left { display: flex; align-items: flex-start; gap: 14px; }
.mp-card-header-icon { width: 40px; height: 40px; background: rgba(255,127,2,0.2); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #a03516; flex-shrink: 0; }
.mp-card-title { font-size: 15px; font-weight: 800; color: #fff; margin: 0 0 3px; }
.mp-card-sub { font-size: 11px; color: rgba(255,255,255,0.5); margin: 0; }
.mp-new-btn { display: inline-flex; align-items: center; gap: 6px; background: linear-gradient(135deg, #a03516 0%, #ff9d3d 100%); color: #fff; font-size: 12px; font-weight: 700; padding: 9px 18px; border-radius: 8px; text-decoration: none; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; }
.mp-new-btn:hover { background: linear-gradient(135deg, #a03516 0%, #ff8c1f 100%); box-shadow: 0 4px 14px rgba(255,127,2,0.35); color: #fff; transform: translateY(-1px); }
.mp-filters { display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-bottom: 1px solid #f5f5f5; flex-wrap: wrap; background: #fafafa; }
.mp-search-wrap { position: relative; flex: 1; min-width: 180px; }
.mp-search-wrap svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #bbb; pointer-events: none; }
.mp-search { width: 100%; border: 1.5px solid #e8e8e8; border-radius: 8px; padding: 8px 12px 8px 32px; font-size: 12px; font-family: "Red Hat Display", sans-serif; color: #1a1a1a; background: #fff; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
.mp-search:focus { border-color: #a03516; box-shadow: 0 0 0 3px rgba(255,127,2,0.1); }
.mp-filter-tabs { display: flex; gap: 5px; flex-wrap: wrap; }
.mp-filter-tab { border: 1.5px solid #e8e8e8; background: #fff; border-radius: 7px; padding: 6px 13px; font-size: 11px; font-weight: 700; font-family: "Red Hat Display", sans-serif; color: #888; cursor: pointer; transition: all 0.18s; }
.mp-filter-tab:hover { border-color: #ffb46e; color: #a03516; }
.mp-filter-tab.active { background: #a03516; border-color: #a03516; color: #fff; }
.mp-table-wrap { overflow-x: auto; }
.mp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mp-table thead tr { background: #f9f9f9; border-bottom: 2px solid #f0f0f0; }
.mp-table th { padding: 11px 16px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.6px; color: #999; white-space: nowrap; }
.mp-table tbody tr { border-bottom: 1px solid #f5f5f5; transition: background 0.15s; }
.mp-table tbody tr:last-child { border-bottom: none; }
.mp-table tbody tr:hover { background: #fffaf5; }
.mp-table td { padding: 13px 16px; vertical-align: middle; }
.mp-td-id { font-size: 11px; font-weight: 700; color: #bbb; white-space: nowrap; }
.mp-name-link { font-weight: 700; color: #1a1a1a; text-decoration: none; transition: color 0.15s; }
.mp-name-link:hover { color: #a03516; }
.mp-type-pill { font-size: 10px; font-weight: 700; padding: 3px 9px; border-radius: 20px; background: #f0f0f0; color: #666; white-space: nowrap; }
.mp-td-city, .mp-td-date { font-size: 12px; color: #888; white-space: nowrap; }
.mp-badge { font-size: 10px; font-weight: 700; padding: 3px 10px; border-radius: 20px; text-transform: uppercase; letter-spacing: 0.4px; white-space: nowrap; display: inline-block; }
.mp-badge--active { background: #f0fdf4; color: #16a34a; }
.mp-badge--quoted { background: #eff6ff; color: #0ea5e9; }
.mp-badge--cancel { background: #dc3545; color: #fff; }
.mp-badge--pending { background: #fffbeb; color: #d97706; }
.mp-badge--reviewing { background: #eef2ff; color: #6366f1; }
.mp-badge--approved { background: #f0fdf4; color: #22c55e; }
.mp-badge--rejected { background: #fef2f2; color: #ef4444; }
.mp-badge--completed { background: #f3f4f6; color: #6b7280; }
.mp-badge--merged { background: #f5f3ff; color: #8b5cf6; }
.mp-view-btn { font-size: 11px; font-weight: 700; color: #a03516; text-decoration: none; transition: color 0.15s; white-space: nowrap; }
.mp-view-btn:hover { color: #a03516; }

@media (max-width: 767px) {
    .mp-card-header { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px; }
    .mp-filters { padding: 12px 16px; }
    .mp-search-wrap { min-width: unset; }
    .mp-td-city, .mp-td-date { display: none; }
}

.cat-sidebar { background: #f5f5f5; border-radius: 10px; padding: 24px 20px; }
.cat-sidebar-title { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #888; margin-bottom: 12px; padding-bottom: 0; }
.cat-sidebar-list, .cat-sidebar-sub { list-style: none; padding: 0; margin: 0; }
.cat-sidebar-list > li > .cat-sidebar-link { font-weight: 700; color: #1a1a1a; padding-left: 0; margin-left: 0; border-left: none; }
.cat-sidebar-list > li > .cat-sidebar-link:hover { color: #a03516; border-left: none; }
.cat-sidebar-list > li > .cat-sidebar-link.active { color: #a03516; border-left: none; }
.cat-sidebar-group { margin-bottom: 6px; }
.cat-group-label { display: block; font-size: 14px; font-weight: 700; color: #1a1a1a; padding: 7px 0 5px; cursor: default; user-select: none; }
.cat-sidebar-sub { padding-left: 12px; margin-bottom: 4px; }
.cat-sidebar-link { display: block; font-size: 14px; color: #555; padding: 5px 0; text-decoration: none; border-left: 2px solid transparent; padding-left: 10px; margin-left: -12px; transition: color .15s, border-color .15s; }
.cat-sidebar-link:hover { color: #a03516; border-left-color: #a03516; }
.cat-sidebar-link.active { color: #a03516; font-weight: 600; border-left-color: #a03516; }

@media (max-width: 767px) {
    .cat-sidebar { position: static; margin-bottom: 24px; }
}

/* MULTI-LEVEL DROPDOWN CSS */
.nav-simple-dropdown { position: relative; }
.nav-simple-menu { display: none; position: absolute; top: 100%; left: 0; background: #fff; min-width: 250px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); padding: 10px 0; z-index: 1000; border-radius: 0 0 8px 8px; border: 1px solid #eee; border-top: 3px solid #8B2519; }
.nav-simple-dropdown:hover > .nav-simple-menu { display: block; animation: menuFade 0.2s ease-in-out; }
.nav-simple-menu li { position: relative; padding: 0 15px; }
.nav-simple-menu li a { display: flex; align-items: center; justify-content: space-between; padding: 10px 5px; color: #333; text-decoration: none; border-bottom: 1px solid #f9f9f9; font-size: 14px; font-weight: 500; transition: 0.2s; }
.nav-simple-menu li a:hover { color: #8B2519; padding-left: 12px; border-bottom-color: #eee; }
.nav-simple-menu li:last-child a { border-bottom: none; }

/* 3. Seviye Açılır Menü (Right Flyout) */
.has-sub-dropdown > .nav-simple-sub-menu { display: none; position: absolute; top: -3px; left: 100%; background: #fff; min-width: 250px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); padding: 10px 0; border-radius: 8px; border: 1px solid #eee; border-top: 3px solid #8B2519; margin-left: 2px; }
.has-sub-dropdown:hover > .nav-simple-sub-menu { display: block; animation: menuFade 0.2s ease-in-out; }

/* =========================================
   MEGA MENU PROFESYONEL CSS YAPISI
   ========================================= */
.mega-dropdown .mega-menu { padding: 15px 0 25px 0; border-top: 3px solid #8B2519; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.mega-menu-inner { display: flex; gap: 30px; }

/* Sol Taraf (Linkler) */
.mega-menu-left { width: 20%; border-right: 1px solid #eee; padding-right: 20px; }
.mega-col-title { color: #8B2519; font-size: 12px; letter-spacing: 1px; font-weight: 800; text-transform: uppercase; margin-bottom: 10px; }
.mega-col-list { list-style: none; padding: 0; margin: 0; }
.mega-col-list li { margin-bottom: 2px; }
.mega-hover-link { text-decoration: none; font-size: 14px; display: block; padding: 5px 12px; transition: 0.2s ease; border-radius: 4px; color: #444; }
.mega-hover-link:hover, .mega-hover-link.active { color: #8B2519; background-color: #f9f9f9; font-weight: 700; }

/* Sağ Taraf (AJAX Konteyneri) */
.mega-menu-right { width: 80%; position: relative; display: flex; min-height: 320px; }
.mega-pane { display: flex; width: 100%; gap: 20px; animation: menuFade 0.3s ease-in-out; }
.mega-products-grid { flex: 1; }
.mega-loader { display: flex; justify-content: center; align-items: center; width: 100%; color: #8B2519; }

/* Sağ Taraf - Ürün Kartları */
.mega-product-card { text-decoration: none; display: flex; flex-direction: column; border: 1px solid #eee; border-radius: 6px; padding: 15px 10px; transition: 0.2s ease; background: #fff; text-align: center; height: 100%; }
.mega-product-card:hover { border-color: #8B2519; box-shadow: 0 4px 15px rgba(139, 37, 25, 0.12); transform: translateY(-3px); }
.mega-product-img { height: 140px; width: 100%; object-fit: contain; margin-bottom: 12px; }
.mega-product-title { font-size: 13px; font-weight: 700; margin-bottom: 4px; color: #111; line-height: 1.3; }
.mega-product-cat { font-size: 10px; font-weight: 700; color: #777; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.mega-product-price { font-size: 14px; font-weight: 800; color: #8B2519; }

/* Sağ Taraf - Banner Alanı CSS */
.mega-banner-wrapper { flex-shrink: 0 !important; transition: all 0.3s ease-in-out; }
.mega-banner-vertical { width: 260px !important; } 
.mega-banner-square { width: 400px !important; max-height: 400px!important; }
.mega-banner-box { position: relative; border-radius: 8px; overflow: hidden; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 30px 25px; color: #fff; background: #1a1c23; text-align: center; box-shadow: inset 0 0 20px rgba(0,0,0,0.5); }
.mega-banner-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-size: cover; opacity: 0.35; z-index: 0; }
.mega-banner-content { position: relative; z-index: 1; }
.mega-banner-tag { display: inline-block; background: #8B2519; color: #fff; font-size: 10px; font-weight: 800; padding: 4px 10px; border-radius: 4px; margin-bottom: 15px; letter-spacing: 1px; text-transform: uppercase; }
.mega-banner-title { font-size: 20px; font-weight: 800; margin-bottom: 12px; line-height: 1.2; }
.mega-banner-desc { font-size: 13px; margin-bottom: 25px; color: #d1d5db; }
.mega-banner-btn { padding: 8px 20px; }

.tab-content > .tab-pane { display: none !important; visibility: hidden !important; height: 0 !important; overflow: hidden !important; }
.tab-content > .tab-pane.active { display: block !important; visibility: visible !important; height: auto !important; overflow: visible !important; }

/* --- MEGA MENU TOGGLE STYLES --- */
.mega-col-toggle { font-size: 11px; letter-spacing: 1px; color: #999; margin-bottom: 15px; border-bottom: 1px solid #eaeaea; padding-bottom: 8px; font-weight: 600; cursor: pointer; position: relative; display: block; padding-right: 25px; user-select: none; }
.mega-col-toggle .mega-col-title { display: block; width: 100%; }
.mega-col-toggle .toggle-icon { position: absolute; right: 0; top: 0; font-size: 14px; font-weight: bold; line-height: 1; }
ul.mega-col-list { list-style: none; padding: 0; margin: 0; }

/* Spinner Sizes */
.mega-loader .spinner-border.mega-spinner-lg { width: 3rem; height: 3rem; }
.mega-loader .spinner-border.mega-spinner-sm { width: 2rem; height: 2rem; }

/* --- PRODUCTS & CATEGORIES CUSTOM STYLES --- */
.cat-link-wrapper { text-decoration: none; display: flex; justify-content: space-between; align-items: center; }
.tag-clear-btn { font-size: 11px; }
.cursor-pointer { cursor: pointer; }
.custom-cat-btn { background-color: #fffaf9; color: #a03516; border: 1px solid #a03516; }
.custom-cat-btn:hover { background-color: #a03516; color: #ffffff; }
.category-match-box { border-left: 4px solid #a03516 !important; }
.category-match-icon { color: #a03516; }
.system-card-img { height: 160px; object-fit: contain; }
.system-card-body { background-color: #fcfcfc; }
.system-code-badge { background-color: #7b7b7b; border-radius: 4px; font-weight: 600; font-size: 11px; letter-spacing: 0.5px; }
.system-title { font-size: 16px; line-height: 1.3; }
.system-desc { font-size: 13px; line-height: 1.6; }
.btn-system { background-color: #a43f21; border-radius: 6px; font-size: 13px; }
.btn-system:hover { background-color: #8c351b; color: white; }
.unit-price-label { font-size: 0.85rem; opacity: 0.8; font-weight: normal; }