:root {
  --primary: #4300ff;
  --secondary: #000;
  --thirdbg: #fff;
  --cta: #4300ff;
  
  --bg: #f9f9f9 ;
  --bg2: #dbdbdb;
  --text: #222;
  --cyan: #008eff;
  --text-muted: #555;
  --text-primary: #5536ff;
  --radius: 5px;
  
  --font-size: 12px;
  --font-family: 'Inter', Poppins;
  --font-sec:  'Roboto';
  
  --card-backdrop-filter:blur(12px);
  
  --border: rgba(0,0,0,0.08);
  --shadow: rgba(0,0,0,0.1);
  --glass-bg: rgba(255,255,255,0.1);
  --glass-border: rgba(255,255,255,0.18);
  
  --btn-sm-pd: 8px 16px;
  --btn-md-pd: 11px 21px;
  --btn-lg-pd: 15px 28px;
}

[theme="dark"] {
  --primary: #4300ff;
  --secondary: #fff;
  --thirdbg: #000;
  --cta: #4300ff;
  
  --bg: #000 ;
  --bg2: #151515;
  --text: #fff;
  --text-muted: #888;
  --radius: 5px;
  
  --font-size: 12px;
  --font-family: 'Inter', Poppins;
  --font-sec: 'Roboto';
  
  --card-backdrop-filter:blur(12px);

  --border: rgba(255,255,255,0.08);
  --shadow: rgba(0,0,0,0.5);
  --glass-bg: rgba(0,0,0,0.4);
  --glass-border: rgba(255,255,255,0.1);
}

[data-animate] { will-change: transform, opacity;transition: transform .2s ease-out; }

#toggleBtn .hi{color:var(--primary);}
[theme='dark'] #toggleBtn .hi{color:#fff;}

body{background: var(--bg);color:var(--text);font-size:var(--font-size);font-family:var(--font-family), var(--font-sec);overflow-x:hidden!important;max-width:100vw;}
a{text-decoration:none;color:inherit;}

glass, .glass{backdrop-filter:blur(12px);} 



button.glass{background:#00000020!important;color:inherit;}
glass, .glass{border-top:1px solid #00000050;border-left:1px solid #00000030;border-right:1px solid #00000030;border-bottom:1px solid #00000050;}
[theme='dark'] button.glass{background:#ffffff20!important;color:#fff;}
[theme='dark'] glass, .glass{border-top:1px solid #ffffff50;border-left:1px solid #ffffff50;border-right:1px solid #ffffff30;border-bottom:1px solid #ffffff30;}

button, .btn{background:var(--secondary);color:var(--text);padding:7px 18px;font-size:12px;border-radius:11px;} .btn:hover, button:hover{background:#fff;color:#000; }
.articleBtn:hover{background:#00000050;}

.bgg-1 { background: linear-gradient(135deg, #FF6A00, #EE0979); }
.bgg-2 { background: linear-gradient(135deg, #0F2027, #203A43, #2C5364); }
.bgg-3 { background: linear-gradient(135deg, #654EA3, #2A0845); }
.bgg-4 { background: linear-gradient(135deg, #00F260, #0575E6); }
.bgg-5 { background: linear-gradient(135deg, #F2994A, #F2C94C); }
.bgg-6 { background: linear-gradient(135deg, #232526, #414345); }
.bgg-7 { background: linear-gradient(135deg, #8E2DE2, #4A00E0); }
.bgg-8 { background: linear-gradient(135deg, #11998E, #38EF7D); }
.bgg-9 { background: linear-gradient(135deg, #CB2D3E, #EF473A); }

.hso, [hso]{font-family:'Hammersmith One'} #toggleBtn{padding:0px 3px;}
.lgbtn{display:flex;align-items: center;gap:8px;text-align:left}


.submenu{display:none;} menu li:hover .submenu{display:block!important;} menu a:hover .d-flex{background:#00000050;}
menu li{display:block;position:relative;}  .link{text-decoration:none;color:var(--text);opacity:0.5;}
menu li a {text-decoration:none;padding:11px 10px;color:var(--text);opacity:0.5;} menu li:hover a, .link:hover{opacity:1;}
.submenu{padding:0px 0px;background:var(--primary);margin-top:8px;border-radius:11px;overflow:hidden;}
.submenu a .d-flex{padding:11px 11px;align-items: center;}

[theme='light'] header{background:#ffffffbd!important;}
header {position: fixed;left:0;right:0;top:0;z-index: 2000;}


.vtoph {width: max-content;padding: 8px 16px;margin-left: 11px;border: 1px solid #333;font-size: 12px;margin-bottom: 0;background:#2b2b2b57;}
[theme='light'] .vtoph{background:#333;opacity:1;color:#fff;}
[theme='light'] .monstra{color:#fff;}
[theme='light'] .submenu a{color:#fff;}


.itemsShow h2 {margin: 0;margin-top: 16px;font-weight: 700;}.itemsShow p {font-weight: 300;margin: 0;font-size: 100%;}.itemsShow .items {margin-bottom: 36px;}
.thumb {display: block;overflow: hidden;border-radius: 28px;position: relative;}.thumb img {aspect-ratio: 1/1.1;object-fit: cover;width: 100%;transition: 0.21s all;display: block;}
.items:hover img {transform: scale(1.051);}.items:hover h2 {color: #673ab7;}.items:hover .rd {color: #ff0008;}.items:hover .yl {color: orange;}.items:hover .tr {color: #14306f;}
.overlay {position: absolute;inset: 0;background: rgba(0, 0, 0, 0.76);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity .25s ease;border-radius: 10px;}
.thumb:hover .overlay {opacity: 1;} 


.chip, chip {background: rgba(122, 140, 255, 0.2);color: #7a8cff;font-weight: 600;border-radius: 16px;padding: 4px 10px;margin: 0 4px 6px 0;display: inline-block;font-size: 0.8rem;}
#faqAccordion .accordion-item{background:#222;border-radius:16px;padding:10px 0px;transform:scale(0.96);margin-bottom:8px;} .accordion-button, .accordion-header{border:none;box-shadow:none!important;outline:none;}


.case-cta {background: rgba(255, 255, 255, 0.1);padding: 10px 18px;border-radius: 999px;font-size: .75rem;text-decoration: none;color: #fff;letter-spacing: .5px;font-weight: 600;backdrop-filter: blur(4px);border: 1px solid rgba(255, 255, 255, 0.2);transition: background .2s ease, transform .2s ease;}
.case-cta:hover {background: rgba(255, 255, 255, 0.15);transform: translateY(-1px);}


.vxaLp{background:linear-gradient(45deg, #000 25%, #111 75%);border-radius:16px;overflow:none;}
.vxaLp::before {content: "";position: absolute;inset: 0;border-radius:16px;overflow:none;background: url('/mediahq/assets/img/t41.gif') repeat;opacity: 0.15;pointer-events: none;mix-blend-mode: difference;}
.section-noise {position: relative;background: linear-gradient(45deg, #000 25%, #111 75%);overflow: hidden;}
.section-noise::before {content: "";position: absolute;inset: 0;background: url('/mediahq/assets/img/noise.png') repeat;opacity: 0.25;pointer-events: none;mix-blend-mode: overlay;}


.service-row {cursor: pointer;user-select: none;margin:0px;}
.service-row:hover {background: rgba(255 255 255 / 0.05);} .service-row .col-lg-9{border-bottom: 1px solid rgba(255 255 255 / 0.2);padding-top: 1.51rem;padding-bottom: 1.51rem;}
.service-content {max-height: 0;overflow: hidden;transition: max-height 0.5s ease, opacity 0.3s ease;opacity: 0;}
.service-row.active .service-content {max-height: 400px;opacity: 1;margin-top: 1rem;}
.service-number {font-size: 1.2rem;color: #999;user-select: none;padding-top: 1.51rem;}
.service-title {font-weight: 700;font-size: 1.8rem;color: #fff;}
.service-desc small {color: #bbb;line-height: 1.5;font-size:1.21em;}
.service-categories small {color: #ffffff50;transform:scale(0.9);font-weight: 600;padding-bottom:6px;display:inline-block;text-transform:uppercase;}


.tab-btn {cursor: pointer;font-family: 'Hammersmith One';font-weight: 800;opacity: .45;transition: .3s ease;}
.tab-btn.active {opacity: 1;}
.tab-pane {display: none;}
.tab-pane.active {display: block;}





.brand-swiper .swiper-slide {flex-shrink: 0;width: auto;max-width: 160px;opacity: 1;transition: transform .3s ease;}
.brand-img {width: 100%;height: auto;filtar: grayscale(100%);opacity: 0.5;padding: 10px 30px;object-fit: contain;max-height: 80px;transition: transform .3s ease, opacity .3s ease;pointer-events: none;user-select: none;}
img {pointer-events: none;user-select: none;} .swiper-slide:hover .brand-img{filter:none;opacity:1;scale:1.1;}
[theme='light'] .lightInv{filter:invert(1) hue-rotate(180deg) saturate(2) contrast(2) !important;} 
.loica{font-size:96%}

@media(min-width:840px){
    .mobileonly, mobileonly, [mobileonly]{display:none!important}
    .ipsica{height:369px;}
    
    header .container{display: flex;flex-wrap: nowrap;justify-content: space-between;align-items: center;}
    header menu{gap:0px;display:flex!important;} menu li a{padding:15px 21px!important;}
    menu li:hover .submenu{position:absolute;} .submenu{width:80vw;max-width:200px;}
    menu li a hr{width:0%!important;margin:0px!important;} menu li:hover a hr{width:50%;}
    .d-home{padding-top:36px;padding-bottom:36px;}
    .loica{font-size:176%}
    
    .footblur{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(0deg, #000, transparent);opacity:0.75;padding:30px 0px;z-index:1;}
}

.show{display:initial!important;} .plain{background:none!important;outline:none;border:0!important;box-shadow:none!important;}

@media(max-width:840px){
    pconly, [pconly], .pconly{display:none!important}
    
    .mt95{transform:scale(0.95);} .mt90{transform:scale(0.9);}
    .ipsica{height:600px;}
    
    .mb-group{display: flex;justify-content: space-between;} .submenu{width:95vw;display:none!important;height:0px;transform:scale(0.001);margin:0;padding:0;}
    
    .service-row .col-lg-9{border-bottom:0px;}
    
    .d-home{padding-top:2px;padding-bottom:11px;}
    
    #menuItems {
        position: fixed;
        top: 0;
        left: 0;
        width: 75vw;
        height: 100vh;
        background: var(--bg2);
        box-shadow: 3px 0 12px rgba(0,0,0,0.15);
        transform: translateX(-100%);
        opacity: 0;
        visibility: hidden;
        font-size:200%;
        
        transition:
            transform 0.35s cubic-bezier(0.25, 0.8, 0.25, 1),
            opacity 0.25s ease,
            visibility 0.25s ease;
    
        padding-top: 80px;
        padding-left: 21px;
        z-index:2222;
    }
    
    #menuOverlay {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(0,0,0,0.45);
        opacity: 0;
        visibility: hidden;
        transition: opacity .25s ease, visibility .25s ease;
        z-index: 1999;
    }
    
    #menuOverlay.show {
        opacity: 1;
        visibility: visible;
    }

    
    /* WHEN OPEN */
    #menuItems.menu-open {
        transform: translateX(0);
        opacity: 1;
        visibility: visible;
    }
    
    /* FADE + SLIDE ANIMATION FOR MENU ITEMS */
    #menuItems li {
        transform: translateX(-15px);
        opacity: 0;
        transition: transform .25s ease, opacity .25s ease;
    }
    
    #menuItems li a{display:block;}
    
    #menuItems.menu-open li {
        transform: translateX(0);
        opacity: 1;
    }
    
    /* Stagger effect */
    #menuItems.menu-open li:nth-child(1){transition-delay:.05s;}
    #menuItems.menu-open li:nth-child(2){transition-delay:.10s;}
    #menuItems.menu-open li:nth-child(3){transition-delay:.15s;}
    #menuItems.menu-open li:nth-child(4){transition-delay:.20s;}
    #menuItems.menu-open li:nth-child(5){transition-delay:.25s;}


    .hero-swiper .swiper-slide{background:var(--bg2);color:var(--text);height:-webkit-fill-available;padding: 30px 25px;border-radius:24px;min-height:432px;}
    .swiper-slide li num{display:block;font-weight:800;font-size:26px;margin-top:26px;margin-bottom:4px;opacity:1;color:var(--cyan)}
}




.loaderlogo {
  animation: fadeAnimation 0.69s infinite;
}

@keyframes fadeAnimation {0% {opacity: 1;}50% {opacity: 0.5;}100% {opacity: 1;}}

@keyframes slideUp {  0% { transform: translateY(100%); opacity: 0; }  100% { transform: translateY(0);  opacity: 1; }}

.element-to-animate {animation: slideUp 1s ease-in-out forwards;}

