@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;800&display=swap');/* Color Variables Concept: Dark Purple: #1a0033 (Primary Deep) Light Blue: #00adef (Primary Light) Background Dark: #0d001a*/html, button, input, select, textarea { color: #222; text-align: right; font-family: 'Cairo', sans-serif;}::-moz-selection { background: #00adef; color: #fff; text-shadow: none;}::selection { background: #00adef; color: #fff; text-shadow: none;}hr { display: block; height: 2px; border: 0; margin: 3em 0; padding: 0; background-image: linear-gradient(to right, #fff, #00adef, #fff); width: 50%; right: 25%; position: relative; border: none;}img { vertical-align: middle;} textarea { resize: vertical;}/* =============================================== General styles ============================================== */html { background-color: #0d001a; /* Dark Purple matching footer */ overflow-x: hidden; margin: 0; padding: 0;}/* Custom Scrollbar */::-webkit-scrollbar { width: 12px;}::-webkit-scrollbar-track { background: #0d001a;}::-webkit-scrollbar-thumb { background: #1a0033; border: 3px solid #0d001a; border-radius: 10px;}::-webkit-scrollbar-thumb:hover { background: #00adef;}body { min-height: 100vh; overflow-x: hidden; margin: 0; padding: 0; background-color: #fff; font-family: 'Cairo', sans-serif; font-weight: 400; font-size: 16px; color: #444; -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; line-height: 1.6; display: flex; flex-direction: column;}#footer-advanced { background: #0d001a; color: #e0e0e0; padding: 80px 0 20px; border-top: 2px solid #00adef; margin-top: auto; /* Push footer to bottom */ margin-bottom: 0 !important;}.footer-bottom { margin-top: 50px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.1); text-align: center; font-size: 14px; padding-bottom: 40px; /* Added some padding to ensure no gap */ margin-bottom: 0 !important;}.logo a {margin: 0 auto; display: inline-block; } .logo a img{background:transparent;}.navbar-inverse{background-color:rgba(255,255,255,.8)!important;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-bottom:1px solid rgba(0,173,239,.2);padding:10px 0;box-shadow:0 4px 30px rgba(0,0,0,.05);transition:all .4s ease}.navbar-inverse .navbar-nav>li>a{color:#1a0033;padding:10px 20px;font-weight:700;font-size:15px;position:relative;transition:.3s}.navbar-inverse .navbar-nav>li>a::after{content:'';position:absolute;bottom:5px;left:50%;width:0;height:2px;background:#00adef;transition:.3s;transform:translateX(-50%)}.navbar-inverse .navbar-nav>li>a:hover::after{width:20px}.navbar-inverse .navbar-nav>li>a:hover{color:#00adef}.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:hover{color:#fff!important;background-color:#1a0033!important;border-radius:25px}.nav-cta-btn{background:#00adef;color:#fff!important;border-radius:25px;margin-right:15px;padding:10px 25px!important;box-shadow:0 4px 15px rgba(0,173,239,.3)}.nav-cta-btn:hover{background:#1a0033!important;transform:scale(1.05)}@media (max-width:991px){.navbar-collapse{background:#fff;margin-top:15px;border-radius:15px;box-shadow:0 10px 30px rgba(0,0,0,.1)}.navbar-nav{margin:15px 0}.nav-cta-btn{margin:10px 0;display:inline-block}}@media (max-width:767px){.navbar-header{display:flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;padding:0 15px}.navbar-header .logo,.navbar-header .navbar-toggle{float:none!important;margin:0!important}.navbar-header .logo{margin-left:15px!important}}.navbar-inverse .navbar-toggle{border-color:#1a0033;background:#00adef}.navbar-inverse .navbar-toggle .icon-bar { background-color: #fff;}.tb {display: table;width: 100%;}.tb-cell {display: table-cell;vertical-align: middle;}.text-center {text-align: center;}.col-md-4 { padding-bottom: 20px;}.row { margin-left: 0px; margin-right: -15px;}.modal-header { background: #00adef;}.modal-header h4 { color: white; font-weight: 700; letter-spacing: 1px;}.modal-footer { background: #0d001a;}.navbar-default { border-color: transparent; background-color: #f8f9fa;}.navbar-inverse .navbar-brand { font-weight: 700; font-size: 22px; color: #1a0033 !important;}.navbar-toggle { border-color: transparent; border: 0px solid transparent;}.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { background-color: #00adef; color: white;}a img { background: transparent;}.odd a img { background: #f5f5f5;}/* Titles */h1, h2, h3, h4, h5, h6 { font-weight: 700; color: #1a0033;}h2 { font-size: 34px; position: relative; padding-bottom: 15px;}h2::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 60px; height: 3px; background: #00adef;}h3 { font-size: 24px;}/* Paragraph & Typographic */p { line-height: 1.8; margin-bottom: 20px; font-size: 15px; color: #555;}ul, ol { padding-left: 0; padding-right: 25px;}#footer-advanced ul { list-style: none; padding: 0;}p.large { font-size: 17px; margin-bottom: 50px;}.centered { text-align: center; margin-top: 20px;}strong { font-weight: 700;}em { font-weight: 300;}pre { background: #f4f4f4; border: none; font-size: 16px; color: #1a0033; padding: 20px; line-height: 28px; border-right: 4px solid #00adef;}small { font-size: 12px;}blockquote, blockquote p { line-height: 28px; color: #666; font-weight: 300; font-style: italic;}blockquote { position: relative; margin: 0 -30px 40px 0; padding-right: 30px; border-right: 5px solid #00adef;}/* Links */a { color: #00adef; word-wrap: break-word; transition: all 0.3s ease;}a:hover, a:focus { color: #1a0033; text-decoration: none; outline: 0;}/* ========================================================================== Wrap Sections ========================================================================== */#headerwrap { background: linear-gradient(rgba(13, 0, 26, 0.8), rgba(26, 0, 51, 0.7)), url(../img/connect-tag-main-banner.webp) no-repeat center center; margin-top: -50px; padding-top: 150px; text-align: center; min-height: 750px; width: 100%; background-size: cover; padding-bottom: 100px; display: flex; align-items: center; justify-content: center;}#headerwrap h1 { color: #ffffff; font-size: 42px; font-weight: 800; text-align: center; letter-spacing: 1px; text-shadow: 0 2px 10px rgba(0,0,0,0.3);}#headerwrap p { color: #fff; font-size: 24px; font-weight: 400; text-align: center; margin-top: 20px;}#headerwrap .icon { color: #00adef; padding-bottom: 30px; font-size: 90px;}#headerwrap .btn { font-weight: 700; font-size: 20px; margin: 40px 0; background-color: #00adef; color: #fff; border-radius: 30px; padding: 12px 45px; border: none;}#headerwrap .btn:hover, #headerwrap .btn:focus { background-color: #fff; color: #1a0033; transform: scale(1.05);} .img-circle { border-radius: 20%; border: 3px solid #00adef; padding: 5px; background: #fff;}.img-circle2 { border-radius: 15%; border: 5px solid #1a0033; background: #fff;}#about { background: #FFF; padding: 100px 0;}#services { background: #fdfdfd; padding: 100px 0; text-align: center;}.services-flex-row { display: flex; flex-wrap: wrap; justify-content: center; margin-right: -15px; margin-left: -15px;}.services-flex-row > [class*='col-'] { display: flex; flex-direction: column;}.service-card { background: #fff; padding: 45px 30px; margin-bottom: 30px; border-radius: 25px; box-shadow: 0 15px 35px rgba(26, 0, 51, 0.05); transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); border: 1px solid #f0f0f0; flex: 1; display: flex; flex-direction: column; text-align: center;}.service-btns { margin-top: auto; padding-top: 25px;}.service-card:hover { transform: translateY(-15px); box-shadow: 0 25px 50px rgba(26, 0, 51, 0.12); border-color: #00adef;}.icon-wrapper { width: 90px; height: 90px; line-height: 90px; background: #f0faff; border-radius: 50%; margin: 0 auto 30px; color: #00adef; font-size: 38px; transition: all 0.4s ease;}.service-card:hover .icon-wrapper { background: #1a0033; color: #fff; transform: rotateY(360deg);}.service-card h3 { font-weight: 800; font-size: 22px; margin-bottom: 20px; color: #1a0033;}.service-card p { font-size: 15px; color: #666; line-height: 1.8;}.service-card .btn-sm { border-radius: 20px; font-weight: 700; padding: 8px 20px;}.mb-50 { margin-bottom: 50px; }.hero-section { background: linear-gradient(135deg, #1a0033 0%, #0d001a 100%); padding: 80px 0; color: #fff;}.hero-section p { color: #e0e0e0; font-size: 20px;}.reservation-btn { background: #00adef; border-radius: 30px; padding: 15px 40px; color: #fff; font-weight: 700; border: none;}.reservation-btn:hover { background: #fff; color: #1a0033; transform: translateY(-3px);}#work { background: #f8f9fa; padding: 100px 0;}#work H4 { color: #1a0033;}#work p { color: #666;}#work .fa { width: 45px; height: 45px; border-radius: 50%; font-size: 20px; line-height: 45px; color: #fff; background-color: #00adef;}#work .fa:hover { background-color: #1a0033;}#contact { background: #fdfdfd; padding: 100px 0;}#contact .fa { color: #00adef;}#contact .btn { background-color: #00adef; color: #fff; border-radius: 30px; padding: 12px 50px;}#contact .btn:hover { background-color: #1a0033;}/* Blog Styles */.blog-card { transition: transform 0.3s ease, box-shadow 0.3s ease; border: 1px solid #eee;}.blog-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(26, 0, 51, 0.1) !important;}.blog-card h4 { color: #1a0033 !important; font-weight: 700;}.blog-card:hover h4 { color: #00adef !important;}/* Statistics Section */#stats { padding: 100px 0; background: linear-gradient(135deg, #1a0033 0%, #0d001a 100%); color: #fff;}.stat-item i { color: #00adef; font-size: 50px;}.stat-item .counter { color: #fff; font-size: 45px;}/* Advanced Footer */#footer-advanced h4 { color: #fff; font-weight: bold; margin-bottom: 25px; font-size: 18px; border-right: 4px solid #00adef; padding-right: 15px;}#footer-advanced ul { padding: 0; list-style: none; margin: 0;}#footer-advanced ul li { margin-bottom: 12px;}#footer-advanced ul li a { color: #bbb; transition: 0.3s; font-size: 14px;}#footer-advanced ul li a:hover { color: #00adef; padding-right: 5px;}#footer-advanced .social-icons { margin-top: 25px;}#footer-advanced .social-icons a { background: rgba(255,255,255,0.05); width: 38px; height: 38px; display: inline-block; line-height: 38px; text-align: center; border-radius: 50%; margin-left: 5px; margin-bottom: 8px; font-size: 16px; color: #fff;}#footer-advanced .social-icons a:hover { background: #00adef; color: #fff; transform: translateY(-3px);}/* Unified Page Header */.page-header-unified { padding: 160px 0 80px; background: linear-gradient(rgba(13, 0, 26, 0.9), rgba(26, 0, 51, 0.85)), url('../img/connect-tag-main-banner.webp'); background-size: cover; background-position: center; color: #fff; text-align: center;}.page-header-unified h1 { color: #fff !important;}.breadcrumb-custom { background: transparent; padding: 0; margin: 0;}.breadcrumb-custom li { color: rgba(255,255,255,0.7) !important;}.breadcrumb-custom li a { color: #00adef !important; font-weight: 600;}.breadcrumb-custom li.active { color: #fff !important;}/* Navigation Active Highlighting */.navbar-nav li.active a { color: #00adef !important;}/* Back to Top Button */#back-to-top { background-color: #00adef;}/* Social Share Buttons */.social-share{margin-top:50px;padding-top:30px;border-top:1px solid #eee}.social-share h4{margin-bottom:20px;font-size:18px;font-weight:700;color:#1a0033}.share-btn{display:inline-block;width:45px;height:45px;line-height:45px;text-align:center;border-radius:50%;color:#fff!important;font-size:20px;margin-left:10px;transition:.3s;box-shadow:0 4px 10px rgba(0,0,0,.1)}.share-btn:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,.2);opacity:.9}.share-whatsapp{background:#25d366}.share-facebook{background:#3b5998}.share-twitter{background:#1da1f2}/* Micro-interactions & Image Hover Effects */.work-teaser, .app-card, .web-project-card, .blog-card { transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s ease;}.work-teaser img, .app-card img, .web-project-card .project-img-wrapper img, .blog-card img { transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);}.work-teaser:hover img, .app-card:hover img, .web-project-card:hover .project-img-wrapper img { transform: scale(1.08);}.work-teaser:hover, .app-card:hover, .web-project-card:hover { box-shadow: 0 20px 40px rgba(0, 173, 239, 0.1) !important;}/* AOS Customization Support */.aos-animate { pointer-events: auto; }/* Glassmorphism Cards */.glass-card { background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 20px; padding: 30px; transition: 0.3s;}.glass-card:hover { background: rgba(255, 255, 255, 0.1); transform: translateY(-5px);}/* Timeline Styles */.timeline { position: relative; padding: 20px 0;}.timeline::before { content: ''; position: absolute; top: 0; right: 50%; width: 2px; height: 100%; background: #00adef;}.timeline-item { margin-bottom: 50px; position: relative;}.timeline-dot { position: absolute; right: 50%; width: 20px; height: 20px; background: #1a0033; border: 3px solid #00adef; border-radius: 50%; margin-right: -10px; z-index: 10;}.timeline-content { width: 45%; padding: 25px; background: #fdfdfd; border-radius: 15px; box-shadow: 0 5px 15px rgba(0,0,0,0.05); border-right: 4px solid #00adef;}.timeline-item:nth-child(even) .timeline-content { margin-right: 55%;}@media (max-width: 767px) { .timeline::before { right: 20px; } .timeline-dot { right: 20px; } .timeline-content { width: 85%; margin-right: 45px !important; }}/* Tech Slider */.tech-slider { overflow: hidden; padding: 50px 0; background: #fdfdfd; white-space: nowrap; position: relative;}.tech-slide-track { display: inline-block; animation: scroll-rtl 40s linear infinite;}.tech-slider i { font-size: 60px; margin: 0 50px; color: #e0e0e0; transition: 0.3s;}.tech-slider i:hover { color: #00adef; }@keyframes scroll-rtl { 0% { transform: translateX(0); } 100% { transform: translateX(100%); }}
#cookie-consent{position:fixed;bottom:20px;right:20px;left:20px;background:rgba(13,0,26,.95);backdrop-filter:blur(10px);color:#fff;padding:20px;border-radius:15px;box-shadow:0 10px 40px rgba(0,0,0,.3);z-index:9999;display:none;align-items:center;justify-content:space-between;border:1px solid rgba(0,173,239,.3)}.cookie-content{flex:1;padding-left:20px}.cookie-content p{color:#e0e0e0;margin:0;font-size:14px}.cookie-content a{color:#00adef;text-decoration:underline}.cookie-btn{background:#00adef;color:#fff;border:none;padding:8px 25px;border-radius:25px;font-weight:700;cursor:pointer;transition:.3s;white-space:nowrap}.cookie-btn:hover{background:#fff;color:#1a0033}@media (max-width:767px){#cookie-consent{flex-direction:column;text-align:center}.cookie-content{padding-left:0;margin-bottom:15px}}
