/* ═══════════════════════════════════════════
           HERO BANNER  (dark navy – matches re.pdf)
        ═══════════════════════════════════════════ */
        .sky-hero {
            background: linear-gradient(135deg, #0d1b2a 0%, #1a2e45 60%, #0d2236 100%);
            padding: 70px 0 60px;
            position: relative;
            overflow: hidden;
        }
        .sky-hero::before {
            content: '';
            position: absolute; inset: 0;
            background: url('images/bg/bg-img7.jpg') center/cover no-repeat;
            opacity: .08;
        }
        .sky-hero .hero-inner { position: relative; z-index: 2; }
        .sky-hero .hero-label {
            display: inline-block; font-size: 13px; font-weight: 600;
            letter-spacing: 2px; text-transform: uppercase;
            color: #0fc5fc; margin-bottom: 14px;
        }
        .sky-hero h1 {
            font-size: clamp(32px, 5vw, 52px); font-weight: 800;
            color: #fff; line-height: 1.15; margin-bottom: 18px;
        }
        .sky-hero p { color: rgba(255,255,255,.72); font-size: 16px; max-width: 560px; }

        /* ═══════════════════════════════════════════
           CATEGORY SECTION HEADER
        ═══════════════════════════════════════════ */
        .sky-cat-section { padding: 60px 0 30px; }
        .sky-cat-section + .sky-cat-section { padding-top: 10px; }

        .sky-cat-header {
            display: flex; align-items: center;
            justify-content: space-between; flex-wrap: wrap;
            gap: 12px;
            border-bottom: 2px solid #e8edf2;
            padding-bottom: 16px; margin-bottom: 32px;
        }
        .sky-cat-header h2 {
            font-size: 28px; font-weight: 800; color: #0d1b2a;
            margin: 0;
        }
        .sky-cat-badge {
            background: #0d1b2a; color: #fff;
            font-size: 12px; font-weight: 700; letter-spacing: 1.5px;
            text-transform: uppercase; padding: 7px 16px; border-radius: 4px;
        }

        /* ═══════════════════════════════════════════
           PRODUCT CARDS
        ═══════════════════════════════════════════ */
        .sky-card {
            background: #fff; border: 1px solid #e4eaf0;
            border-radius: 10px; overflow: hidden;
            transition: box-shadow .28s, transform .28s;
            height: 100%; display: flex; flex-direction: column;
        }
        .sky-card:hover {
            box-shadow: 0 12px 40px rgba(13,27,42,.12);
            transform: translateY(-4px);
        }
        .sky-card-img {
            width: 100%; height: 200px;
            object-fit: cover; display: block;
            background: #f0f4f8;
        }
        .sky-card-img-placeholder {
            width: 100%; height: 200px;
            background: linear-gradient(135deg,#e8f4fb,#d0e8f5);
            display: flex; align-items: center; justify-content: center;
        }
        .sky-card-img-placeholder i { font-size: 42px; color: #0fc5fc; opacity: .5; }
        .sky-card-body { padding: 22px 22px 18px; flex: 1; display: flex; flex-direction: column; }
        .sky-card-title {
            font-size: 17px; font-weight: 700; color: #0d1b2a;
            margin-bottom: 10px; line-height: 1.35;
        }
        .sky-card-title a { color: inherit; text-decoration: none; }
        .sky-card-title a:hover { color: #0fc5fc; }
        .sky-card-desc {
            font-size: 14px; color: #6b7b8d; line-height: 1.65;
            flex: 1; margin-bottom: 16px;
        }
        .sky-read-more {
            display: inline-block; font-size: 12px; font-weight: 700;
            letter-spacing: 1.5px; text-transform: uppercase;
            color: #0fc5fc; text-decoration: none;
            border-bottom: 1.5px solid #0fc5fc; padding-bottom: 2px;
            transition: color .2s, border-color .2s;
        }
        .sky-read-more:hover { color: #0099cc; border-color: #0099cc; }

        /* ═══════════════════════════════════════════
           CTA SECTION  (dark – matches re.pdf)
        ═══════════════════════════════════════════ */
        .sky-cta {
            background: linear-gradient(135deg,#0d1b2a 0%,#112233 50%,#1a0a0a 100%);
            padding: 80px 0; margin-top: 70px; position: relative; overflow: hidden;
        }
        .sky-cta::before {
            content:''; position:absolute; inset:0;
            background: url('images/bg/bg-img7.jpg') center/cover no-repeat;
            opacity: .05;
        }
        .sky-cta .inner { position:relative; z-index:2; }
        .sky-cta .cta-label {
            display:inline-block; font-size:13px; font-weight:700;
            letter-spacing:2px; text-transform:uppercase;
            color:#0fc5fc; margin-bottom:14px;
        }
        .sky-cta h2 {
            font-size: clamp(28px,4vw,46px); font-weight:800;
            color:#fff; line-height:1.2; margin-bottom:0;
        }
        .sky-cta .cta-sub {
            font-size:16px; color:rgba(255,255,255,.72);
            margin-bottom:32px; max-width:480px;
        }
        .sky-cta-btns { display:flex; gap:14px; flex-wrap:wrap; }
        .sky-btn-primary {
            display:inline-block; background:#0fc5fc; color:#0d1b2a;
            font-size:13px; font-weight:700; letter-spacing:1.5px;
            text-transform:uppercase; padding:14px 28px; border-radius:4px;
            text-decoration:none; transition:background .25s, color .25s;
        }
        .sky-btn-primary:hover { background:#0099cc; color:#fff; }
        .sky-btn-outline {
            display:inline-block; border:2px solid rgba(255,255,255,.4);
            color:#fff; font-size:13px; font-weight:700; letter-spacing:1.5px;
            text-transform:uppercase; padding:13px 28px; border-radius:4px;
            text-decoration:none; transition:border-color .25s, background .25s;
        }
        .sky-btn-outline:hover { border-color:#0fc5fc; background:rgba(15,197,252,.08); color:#fff; }

        /* ═══════════════════════════════════════════
           FOOTER
        ═══════════════════════════════════════════ */
        .sky-footer {
            background:#0d1b2a; color:rgba(255,255,255,.7);
            padding: 60px 0 0;
        }
        .sky-footer h4 {
            color:#fff; font-size:18px; font-weight:700; margin-bottom:24px;
        }
        .sky-footer p { font-size:14px; line-height:1.75; }
        .sky-footer-links { list-style:none; padding:0; margin:0; }
        .sky-footer-links li { margin-bottom:10px; }
        .sky-footer-links li a {
            font-size:15px; color:rgba(255,255,255,.65);
            text-decoration:none; transition:color .2s;
        }
        .sky-footer-links li a:hover { color:#0fc5fc; }
        .sky-contact-item { display:flex; align-items:flex-start; gap:12px; margin-bottom:14px; }
        .sky-contact-item i { color:#0fc5fc; margin-top:3px; min-width:16px; }
        .sky-contact-item a { color:rgba(255,255,255,.7); text-decoration:none; font-size:14px; }
        .sky-contact-item a:hover { color:#0fc5fc; }
        .sky-contact-item span { font-size:14px; }
        .sky-footer-bottom {
            border-top:1px solid rgba(255,255,255,.08);
            padding:20px 0; margin-top:40px; text-align:center;
            font-size:13px; color:rgba(255,255,255,.45);
        }
        .sky-footer-bottom a { color:rgba(255,255,255,.6); text-decoration:none; }

        /* ═══════════════════════════════════════════
           BACK TO TOP
        ═══════════════════════════════════════════ */
        #sky-totop {
            position:fixed; bottom:28px; right:28px; z-index:999;
            width:42px; height:42px; border-radius:50%;
            background:#0fc5fc; color:#fff; font-size:18px;
            display:flex; align-items:center; justify-content:center;
            text-decoration:none; opacity:0; pointer-events:none;
            transition:opacity .3s, transform .3s;
        }
        #sky-totop.show { opacity:1; pointer-events:all; }
        #sky-totop:hover { transform:translateY(-3px); }

        /* Breadcrumb row */
        .sky-breadcrumb { background:#f5f8fb; padding:14px 0; border-bottom:1px solid #e4eaf0; }
        .sky-breadcrumb a { color:#0fc5fc; text-decoration:none; font-size:14px; }
        .sky-breadcrumb span { color:#6b7b8d; font-size:14px; }
        .sky-breadcrumb .sep { margin:0 8px; color:#c0c8d0; }

        /* Row spacing for cards */
        .sky-cards-row > [class*="col-"] { margin-bottom: 28px; }

        /* Empty state */
        .sky-empty { text-align:center; padding:50px 20px; color:#aab; font-size:15px; }
        .sky-empty i { font-size:36px; margin-bottom:14px; display:block; color:#dde; }