/* =========================
   HOSTKART CORE VARIABLES
========================= */

:root{

--hk-green:#009B4D;
--hk-yellow:#FFCC00;
--hk-ivory:#FAF5E9;

--hk-dark:#111827;
--hk-card:#FFFFFF;

--hk-text:#1F2937;
--hk-muted:#6B7280;

--hk-radius:18px;

}

/* =========================
   GLOBAL
========================= */

body{

background:var(--hk-ivory);

font-family:'Poppins',sans-serif;

color:var(--hk-text);

overflow-x:hidden;

}

/* =========================
   NAVBAR
========================= */



/* =========================
   BUTTONS
========================= */

.btn-primary{

background:var(--hk-green)!important;

border:none!important;

border-radius:12px;

transition:.3s;

}

.btn-primary:hover{

background:#00b85a!important;

transform:translateY(-2px);

}

/* =========================
   CARDS
========================= */

.panel{

border:none;

border-radius:18px;

box-shadow:
0 10px 30px rgba(0,0,0,.05);

overflow:hidden;

}

/* =========================
   LOADER
========================= */

#hk-loader{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:var(--hk-ivory);

display:flex;

justify-content:center;
align-items:center;

z-index:999999;

}

.hk-spinner{

width:70px;
height:70px;

border-radius:50%;

border:5px solid rgba(0,0,0,.1);

border-top:5px solid var(--hk-green);

animation:hkSpin 1s linear infinite;

}

@keyframes hkSpin{

100%{

transform:rotate(360deg);

}

}

/* =========================
   SCROLLBAR
========================= */

::-webkit-scrollbar{

width:8px;

}

::-webkit-scrollbar-thumb{

background:var(--hk-green);

border-radius:20px;

}
/* =========================
   FOOTER
========================= */

#hk-footer{

background:#101827;

color:white;

padding:80px 0 30px;

margin-top:80px;

}

#hk-footer h3,
#hk-footer h4{

color:white;

margin-bottom:20px;

}

.hk-footer-links{

padding:0;

list-style:none;

}

.hk-footer-links li{

margin-bottom:10px;

}

.hk-footer-links a{

color:#d1d5db;

transition:.3s;

}

.hk-footer-links a:hover{

color:#FFCC00;

padding-left:5px;

}

.hk-copyright{

text-align:center;

color:#9ca3af;

}

/* =========================
   REVEAL EFFECT
========================= */

.hk-reveal{

opacity:0;

transform:
translateY(40px);

transition:
all .8s ease;

}

.hk-visible{

opacity:1;

transform:
translateY(0);

}

/* ==================================
   HOSTKART HERO
================================== */

.hk-hero{

padding:120px 0;

position:relative;

overflow:hidden;

}

.hk-hero-bg{

position:absolute;

width:700px;
height:700px;

right:-150px;
top:-200px;

background:
radial-gradient(
circle,
rgba(0,155,77,.18),
transparent
);

filter:blur(80px);

}

.hk-badge{

display:inline-block;

background:#FFCC00;

padding:10px 18px;

border-radius:999px;

font-weight:700;

margin-bottom:20px;

}

.hk-hero h1{

font-size:64px;

font-weight:800;

line-height:1.1;

margin-bottom:20px;

}

.hk-hero p{

font-size:18px;

color:#6b7280;

margin-bottom:30px;

}

.hk-hero-actions{

display:flex;

gap:15px;

flex-wrap:wrap;

}

.hk-server-box{

display:flex;

justify-content:center;

align-items:center;

height:100%;

}

.hk-server-card{

background:#fff;

padding:40px;

border-radius:24px;

box-shadow:
0 25px 60px rgba(0,0,0,.08);

animation:
hkFloat 4s ease-in-out infinite;

}

.hk-server-dot{

width:16px;
height:16px;

border-radius:50%;

background:#009B4D;

margin-bottom:15px;

}

.hk-domain-search{

margin-top:80px;

background:#fff;

padding:30px;

border-radius:24px;

box-shadow:
0 20px 50px rgba(0,0,0,.06);

}

.hk-domain-search .form-control{

height:60px;

border-radius:14px;

}

.hk-domain-search .btn{

height:60px;

padding:0 30px;

}

/* FLOATING */

@keyframes hkFloat{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-15px);
}

100%{
transform:translateY(0px);
}

}

/* MOBILE */

@media(max-width:768px){

.hk-hero{

padding:80px 0;

}

.hk-hero h1{

font-size:42px;

}

.hk-server-box{

margin-top:40px;

}

}

/* HERO */

.hk-hero{

padding:120px 0;

position:relative;

overflow:hidden;

}

.hk-bg-orb{

position:absolute;

border-radius:50%;

filter:blur(80px);

}

.hk-bg-orb-1{

display:none;

}

.hk-bg-orb-2{

display:none;

}

.hk-badge{

display:inline-block;

background:#FFCC00;

padding:10px 18px;

border-radius:999px;

font-weight:700;

margin-bottom:20px;

}

.hk-hero h1{

font-size:62px;

font-weight:800;

line-height:1.1;

margin-bottom:20px;

}

.hk-floating-card{

background:white;

padding:40px;

border-radius:24px;

box-shadow:
0 25px 60px rgba(0,0,0,.08);

max-width:420px;

margin:0 auto;

animation:hkFloat 4s ease infinite;

}

.hk-domain-box{

margin-top:70px;

background:white;

padding:25px;

border-radius:24px;

box-shadow:0 20px 40px rgba(0,0,0,.06);

}

.hk-shortcuts{

margin-top:40px;

}

.hk-shortcut-card{

display:block;

background:white;

padding:30px;

text-align:center;

border-radius:20px;

box-shadow:0 10px 30px rgba(0,0,0,.05);

transition:.3s;

}

.hk-shortcut-card:hover{

transform:translateY(-10px);

}

.hk-shortcut-card i{

font-size:28px;

margin-bottom:15px;

color:#009B4D;

display:block;

}
.hk-secondary-btn{

background:#ffffff;

color:#009B4D !important;

border:2px solid #009B4D;

border-radius:14px;

font-weight:600;

padding:12px 24px;

}

.hk-secondary-btn:hover{

background:#009B4D;

color:#fff !important;

}
/* =====================================
   HOSTKART PREMIUM NAVBAR
===================================== */



.navbar-main .navbar-nav > .active > a{

background:transparent !important;

color:#009B4D !important;

}

/* DROPDOWN */

.dropdown-menu{

border:none;

border-radius:18px;

padding:12px;

margin-top:10px;

box-shadow:
0 20px 50px rgba(0,0,0,.12);

}

.dropdown-menu li a{

padding:12px 16px;

border-radius:12px;

font-weight:500;

transition:.3s;

}

.dropdown-menu li a:hover{

background:#FAF5E9;

color:#009B4D;

}

/* BADGES */

.badge{

background:#FFCC00;

color:#111827;

font-weight:700;

}

/* MOBILE */

.navbar-toggle{

border:none;

margin-top:18px;

}

.navbar-toggle .icon-bar{

background:#009B4D;

height:3px;

border-radius:20px;

}
.hk-nav-scrolled{

box-shadow:
0 12px 40px rgba(0,0,0,.08);

}
/* ==================================
   STATS SECTION
================================== */

.hk-stats-section{

padding:80px 0 40px;

}

.hk-stat-card{

background:#fff;

padding:35px;

border-radius:22px;

text-align:center;

box-shadow:
0 15px 40px rgba(0,0,0,.05);

margin-bottom:25px;

}

.hk-stat-card h3{

font-size:42px;

font-weight:800;

color:#009B4D;

margin-bottom:10px;

}

/* ==================================
   FEATURES
================================== */

.hk-features{

padding:80px 0;

}

.hk-section-title{

text-align:center;

margin-bottom:60px;

}

.hk-section-title span{

display:inline-block;

background:#FFCC00;

padding:8px 16px;

border-radius:999px;

font-weight:700;

margin-bottom:15px;

}

.hk-section-title h2{

font-size:48px;

font-weight:800;

}

.hk-features .row{
display:flex;
flex-wrap:wrap;
margin-left:-15px;
margin-right:-15px;
}

.hk-features .col-md-4{
display:flex;
margin-bottom:30px;
}

.hk-feature-card{
width:100%;
background:#fff;
border:1px solid #edf0f5;
border-radius:24px;
padding:45px 30px;
text-align:center;
transition:.3s;
display:flex;
flex-direction:column;
justify-content:flex-start;
min-height:340px;
}

.hk-feature-card:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.hk-feature-card i{
width:72px;
height:72px;
margin:0 auto 25px;
display:flex;
align-items:center;
justify-content:center;
background:#f3f7ff;
border-radius:20px;
font-size:30px;
}

.hk-feature-card h3{
margin-bottom:15px;
font-size:28px;
font-weight:700;
}

.hk-feature-card p{
margin:0;
line-height:1.8;
}

/* ==================================
   HOSTING PLANS
================================== */

.hk-plans{

padding:100px 0;

background:#FAF5E9;

}

.hk-plan-card{

background:#fff;

padding:40px;

border-radius:24px;

box-shadow:
0 15px 40px rgba(0,0,0,.05);

position:relative;

height:100%;

transition:.4s;

}

.hk-plan-card:hover{

transform:
translateY(-12px);

}

.hk-plan-card h3{

font-size:28px;

font-weight:800;

margin-bottom:10px;

}

.hk-plan-card ul{

padding-left:20px;

margin:25px 0;

}

.hk-plan-card li{

margin-bottom:10px;

}

.hk-plan-featured{

border:3px solid #009B4D;

transform:scale(1.04);

}

.hk-plan-badge{

position:absolute;

top:-15px;

right:20px;

background:#FFCC00;

padding:8px 16px;

font-weight:700;

border-radius:999px;

}

.hk-domains{

padding:90px 0;

}

.hk-domain-card{

background:#fff;

padding:35px;

text-align:center;

border-radius:20px;

box-shadow:
0 10px 30px rgba(0,0,0,.05);

transition:.3s;

}

.hk-domain-card:hover{

background:#009B4D;

color:#fff;

transform:translateY(-8px);

}
/* PREMIUM FEATURE GRID */

.hk-feature-card{

background:#fff;

border-radius:28px;

padding:40px;

height:100%;

position:relative;

overflow:hidden;

border:1px solid rgba(0,0,0,.05);

transition:.35s;

}

.hk-feature-card::before{

content:"";

position:absolute;

top:0;

left:0;

height:4px;

width:100%;

background:#009B4D;

transform:scaleX(0);

transition:.35s;

}

.hk-feature-card:hover::before{

transform:scaleX(1);

}

.hk-feature-card:hover{

transform:translateY(-12px);

box-shadow:
0 30px 60px rgba(0,0,0,.08);

}

.hk-feature-card i{

width:70px;

height:70px;

line-height:70px;

text-align:center;

border-radius:18px;

background:#FAF5E9;

font-size:28px;

color:#009B4D;

margin-bottom:20px;

}

.hk-feature-card h3{

font-size:22px;

font-weight:700;

margin-bottom:15px;

}

.hk-feature-card p{

line-height:1.8;

color:#6b7280;

}

/* =====================================
   MODERN TOPBAR
===================================== */

#hk-topbar{

background:#009B4D;

height:60px;

display:flex;

align-items:center;

}

.hk-topbar-inner{

display:flex;

justify-content:space-between;

align-items:center;

height:60px;

}

.hk-contact-icons{

display:flex;

gap:30px;

}

.hk-contact-icons a{

color:#fff;

font-size:22px;

}

.hk-topbar-right{

display:flex;

align-items:center;

gap:25px;

}

.hk-topbar-right a{

color:#fff;

font-weight:600;

}

.hk-cart-btn{

font-size:22px;

}

/* =====================================
   MAIN HEADER
===================================== */

#hk-main-header{

background:#ffffff;

height:90px;

display:flex;

align-items:center;

border-bottom:1px solid #ececec;

box-shadow:none;

padding:0;

}

.hk-main-header-inner{

display:flex;

align-items:center;

justify-content:space-between;

}

.hk-logo img{

max-height:70px;

}

.hk-mobile-menu button{

background:none;

border:none;

padding:0;

}

.hk-mobile-menu span{

display:block;

width:35px;

height:3px;

background:#222;

margin:7px 0;

border-radius:10px;

}

.hk-header-actions a{

font-size:24px;

color:#009B4D;

}

/* MOBILE */

@media(max-width:768px){

#hk-topbar{

height:55px;

}

.hk-contact-icons{

gap:20px;

}

.hk-logo img{

max-height:55px;

}

}
/* HOSTKART HEADER FIX */

.hk-topbar-inner{

display:flex !important;

justify-content:space-between !important;

align-items:center !important;

height:60px !important;

}

.hk-topbar-left,
.hk-topbar-right{

display:flex !important;

align-items:center !important;

gap:15px !important;

}

.hk-main-header-inner{

display:flex !important;

justify-content:space-between !important;

align-items:center !important;

height:90px !important;

}

.hk-left{

width:70px;

}

.hk-center{

flex:1;

text-align:center;

}

.hk-right{

width:70px;

text-align:right;

}

/* =====================================
   HOSTKART MOBILE HEADER FIX
===================================== */

.hk-hidden-nav{

display:none !important;

}

#hk-topbar{

background:#7DBE32;

height:60px;

display:flex;

align-items:center;

}

#hk-main-header{

background:#ffffff;

height:90px;

display:flex;

align-items:center;

border-bottom:1px solid #ececec;

}

.hk-topbar-inner{

display:flex !important;

justify-content:space-between !important;

align-items:center !important;

width:100%;

}

.hk-topbar-left{

display:flex !important;

align-items:center !important;

gap:18px;

}

.hk-topbar-right{

display:flex !important;

align-items:center !important;

gap:18px;

}

.hk-divider{

width:1px;

height:28px;

background:rgba(255,255,255,.4);

}

.hk-topbar a{

color:#fff;

font-size:24px;

text-decoration:none;

}

.hk-main-header-inner{

display:flex !important;

justify-content:space-between !important;

align-items:center !important;

width:100%;

}

.hk-left{

width:80px;

}

.hk-center{

flex:1;

text-align:center;

}

.hk-right{

width:80px;

text-align:right;

}

.hk-center img{

max-height:60px;

width:auto;

}

.hk-center span{

font-size:38px;

font-weight:700;

color:#0b5f8a;

}

.navbar-toggle{

display:block !important;

border:none !important;

background:transparent !important;

padding:0 !important;

margin:0 !important;

float:none !important;

}

.navbar-toggle span{

display:block;

width:34px;

height:3px;

background:#000;

margin:6px 0;

border-radius:20px;

}

.hk-right i{

font-size:30px;

color:#999;

}

@media(max-width:768px){

.hk-center img{

max-height:48px;

}

.hk-center span{

font-size:28px;

}

}

/* ===================================
HOSTINGER STYLE HEADER FINAL
=================================== */



#hk-topbar{

background:#7DBE32;

height:60px;

}

#hk-main-header{

position:relative;

z-index:999;

}

.hk-main-header-inner{

display:flex;

align-items:center;

justify-content:space-between;

width:100%;

height:90px;

}

.hk-left{

width:80px;

display:flex;

align-items:center;

}

.hk-center{

flex:1;

text-align:center;

}

.hk-right{

width:80px;

display:flex;

justify-content:flex-end;

align-items:center;

}

.hk-center img{

max-height:60px;

width:auto;

}

.hk-center span{

font-size:34px;

font-weight:800;

color:#009B4D;

}

.navbar-toggle{

display:block !important;

background:none !important;

border:none !important;

padding:0 !important;

margin:0 !important;

}

.navbar-toggle span{

display:block;

width:34px;

height:3px;

background:#222;

margin:6px 0;

border-radius:999px;

}

.hk-right i{

font-size:28px;

color:#8b8b8b;

}

.hk-topbar-left a,
.hk-topbar-right a{

color:white;

font-size:20px;

}

.hk-divider{

width:1px;

height:25px;

background:rgba(255,255,255,.35);

}

/* HOSTKART DRAWER MENU */

.hk-mobile-drawer{

display:block !important;

background:#fff;

}

.hk-nav-link{

font-weight:600;

color:#111827 !important;

}

.hk-nav-link:hover{

color:#009B4D !important;

}

.hk-dropdown{

border:none;

border-radius:18px;

padding:12px;

box-shadow:
0 20px 40px rgba(0,0,0,.08);

}

.hk-dropdown li a{

padding:12px 18px;

display:block;

border-radius:12px;

}

.hk-dropdown li a:hover{

background:#FAF5E9;

color:#009B4D;

}

.hk-site-brand{

display:inline-flex;

align-items:center;

justify-content:center;

text-decoration:none;

}

.hk-site-brand span{

font-size:34px;

font-weight:800;

color:#009B4D;

}

@media(max-width:991px){

#primary-nav{

background:#ffffff;

border-top:1px solid #eee;

padding:15px;

}

#primary-nav.in{

display:block !important;

}

#primary-nav .navbar-nav{

float:none !important;

margin:0 !important;

}

#primary-nav .navbar-nav li{

float:none !important;

width:100%;

}

#primary-nav .navbar-nav li a{

padding:14px 20px;

display:block;

font-weight:600;

}

}

/* =====================================
   MOBILE MENU VISIBILITY FIX
===================================== */

@media(max-width:991px){

#primary-nav{

background:#ffffff !important;

padding:15px !important;

}

#primary-nav .navbar-nav > li > a{

color:#111827 !important;

font-weight:600 !important;

font-size:15px !important;

display:block !important;

padding:14px 18px !important;

border-radius:12px;

}

#primary-nav .navbar-nav > li > a:hover{

background:#FAF5E9 !important;

color:#009B4D !important;

}

#primary-nav .navbar-nav > .open > a,

#primary-nav .navbar-nav > .open > a:hover,

#primary-nav .navbar-nav > .open > a:focus{

background:#FAF5E9 !important;

color:#009B4D !important;

}

#primary-nav .dropdown-menu{

display:block !important;

position:relative !important;

float:none !important;

width:100% !important;

border:none !important;

box-shadow:none !important;

background:#f8f8f8 !important;

margin-top:5px !important;

padding:8px !important;

border-radius:12px !important;

}

#primary-nav .dropdown-menu li a{

color:#111827 !important;

padding:12px 18px !important;

display:block !important;

font-weight:500 !important;

}

#primary-nav .dropdown-menu li a:hover{

background:#ffffff !important;

color:#009B4D !important;

}

}

/* =====================================
   FORCE MOBILE MENU COLORS
===================================== */

#primary-nav,
#primary-nav *{

color:#111827 !important;

}

#primary-nav{

background:#ffffff !important;

}

#primary-nav .navbar-nav > li > a{

color:#111827 !important;

background:transparent !important;

font-weight:600 !important;

}

#primary-nav .navbar-nav > li > a:hover,

#primary-nav .navbar-nav > li > a:focus,

#primary-nav .navbar-nav > li.open > a{

color:#009B4D !important;

background:#FAF5E9 !important;

}

#primary-nav .dropdown-menu{

background:#ffffff !important;

border:none !important;

box-shadow:none !important;

}

#primary-nav .dropdown-menu li a{

color:#111827 !important;

background:#ffffff !important;

}

#primary-nav .dropdown-menu li a:hover{

background:#FAF5E9 !important;

color:#009B4D !important;

}

/* Fix WHMCS active item */

#primary-nav .active > a{

color:#009B4D !important;

background:#FAF5E9 !important;

}

/* Fix dark/light mode browser overrides */

html,
body{

color-scheme:light;

}

/* =====================================
   FINAL MOBILE MENU FIX
===================================== */

@media (max-width:991px){

    .navbar-collapse{
        background:#ffffff !important;
    }

    #primary-nav,
    #primary-nav ul,
    #primary-nav li,
    #primary-nav a,
    #primary-nav span{
        color:#111827 !important;
        opacity:1 !important;
        visibility:visible !important;
    }

    #primary-nav .navbar-nav > li{
        border-bottom:1px solid #f1f1f1;
    }

    #primary-nav .navbar-nav > li > a{
        color:#111827 !important;
        background:#ffffff !important;
        font-weight:600 !important;
        padding:15px 20px !important;
    }

    #primary-nav .navbar-nav > li > a:hover,
    #primary-nav .navbar-nav > li > a:focus,
    #primary-nav .navbar-nav > li.open > a,
    #primary-nav .navbar-nav > li.active > a{
        background:#f5f7fa !important;
        color:#009B4D !important;
    }

    #primary-nav .caret{
        border-top-color:#111827 !important;
        border-bottom-color:#111827 !important;
    }

    #primary-nav .dropdown-menu{
        background:#f8f9fa !important;
        display:block !important;
        position:relative !important;
        width:100% !important;
        border:none !important;
        box-shadow:none !important;
    }

    #primary-nav .dropdown-menu li a{
        color:#111827 !important;
        background:transparent !important;
        padding:12px 25px !important;
    }

    #primary-nav .dropdown-menu li a:hover{
        background:#ffffff !important;
        color:#009B4D !important;
    }
}

/* ==================================
   NEW HOMEPAGE HERO STYLE
================================== */

.hk-hero{
    background:#FAF5E9 !important;
    background-image:none !important;
    padding:140px 0 90px;
    position:relative;
    overflow:hidden;
    text-align:center;
}

.hk-bg-orb{

    display:none;

}

.hk-main-title{

    font-size:72px;

    line-height:1.05;

    font-weight:900;

    max-width:900px;

    margin:0 auto 25px;

    color:#111827;

    letter-spacing:-2px;

}

.hk-main-subtitle{

    font-size:20px;

    max-width:720px;

    margin:0 auto 50px;

    color:#6B7280;

    line-height:1.8;

}

.hk-domain-box{

    max-width:900px;

    margin:40px auto 0;

}

.hk-domain-box .form-control{

    height:72px;

    border:none;

    box-shadow:none;

    font-size:18px;

}

.hk-domain-box .btn{

    height:72px;

    font-weight:700;

}

/* ==================================
   SECTION HEADINGS
================================== */

.hk-section-title h2{

    font-size:56px;

    font-weight:900;

    color:#111827;

    letter-spacing:-1px;

}

.hk-section-title p{

    max-width:650px;

    margin:20px auto 0;

    font-size:18px;

    color:#6B7280;

    line-height:1.8;

}

/* ==================================
   SCROLL ANIMATIONS
================================== */

.hk-animate{

    opacity:0;

    transform:translateY(40px);

    transition:all .8s ease;

}

.hk-animate-visible{

    opacity:1;

    transform:translateY(0);

}

.hk-bg-orb,
.hk-bg-orb-1,
.hk-bg-orb-2,
.hk-hero::before,
.hk-hero::after{

    display:none !important;
    content:none !important;
    background:none !important;

}

/* ===================================
   HOMEPAGE NEWS SECTION
=================================== */

.hk-home-news-section{
    padding:100px 0;
    background:#f8fafc;
}

.hk-news-grid{
    display:flex;
    flex-wrap:wrap;
}

.hk-news-modern{
    background:#fff;
    border-radius:24px;
    padding:35px;
    height:100%;
    border:1px solid #e5e7eb;
    box-shadow:0 10px 30px rgba(0,0,0,.04);
    transition:.3s ease;
}

.hk-news-modern:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 50px rgba(0,0,0,.08);
}

.hk-news-date{
    display:inline-block;
    background:#eff6ff;
    color:#2563eb;
    padding:8px 16px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    margin-bottom:20px;
}

.hk-news-modern h3{
    font-size:24px;
    font-weight:700;
    margin-bottom:15px;
}

.hk-news-modern h3 a{
    color:#111827;
    text-decoration:none;
}

.hk-news-modern h3 a:hover{
    color:#2563eb;
}

.hk-news-content{
    color:#6b7280;
    line-height:1.8;
}

@media(min-width:1200px){

    .hk-home-news-section .container{
        max-width:1320px;
    }

    .hk-news-modern{
        min-height:350px;
    }

}

/* ===========================
   DESKTOP NAVIGATION
=========================== */

.hk-nav-container{
    max-width:1400px;
    width:100%;
}

.hk-desktop-nav{
    display:flex !important;
    align-items:center;
    justify-content:space-between;
}

.hk-primary-menu,
.hk-secondary-menu{
    display:flex !important;
    align-items:center;
    gap:10px;
}

.hk-primary-menu > li > a,
.hk-secondary-menu > li > a{
    font-size:15px;
    font-weight:600;
    color:#1e293b !important;
    padding:12px 18px !important;
    border-radius:12px;
    transition:.3s;
}

.hk-primary-menu > li > a:hover,
.hk-secondary-menu > li > a:hover{
    background:#f1f5f9;
    color:#2563eb !important;
}

.hk-primary-menu .dropdown-menu,
.hk-secondary-menu .dropdown-menu{
    border:none;
    border-radius:16px;
    box-shadow:0 20px 40px rgba(0,0,0,.08);
    padding:12px;
}

.hk-primary-menu .dropdown-menu a,
.hk-secondary-menu .dropdown-menu a{
    border-radius:10px;
    padding:10px 15px;
}

/* Desktop only */

@media (min-width:992px){

    .hk-navbar-wrapper{
        background:#fff;
        border-bottom:1px solid #eef2f7;
        position:sticky;
        top:0;
        z-index:999;
    }

    .navbar-collapse.hk-desktop-nav{
        padding-left:0;
        padding-right:0;
    }

}

/* =========================
   CLOUDHOST DESKTOP HEADER
========================= */

.hk-desktop-container{
    max-width:1400px;
    margin:0 auto;
    padding:0 40px;
}

.hk-cloud-header{
    height:90px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.hk-logo-center{
    flex:1;
    text-align:center;
}

.hk-site-brand img{
    max-height:50px;
}

.hk-header-actions{
    display:flex;
    align-items:center;
    gap:14px;
}

.hk-header-icon{
    width:42px;
    height:42px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f8fafc;
    color:#2563eb;
    border:1px solid #e2e8f0;
    transition:.3s;
}

.hk-header-icon:hover{
    background:#2563eb;
    color:#fff;
    text-decoration:none;
}

.hk-theme-toggle{
    border:none;
    cursor:pointer;
}

.hk-desktop-nav-wrap{
    background:#fff;
    border-bottom:1px solid #e2e8f0;
}

.hk-desktop-nav{
    display:flex !important;
    justify-content:center;
}

.hk-desktop-nav .navbar-nav{
    float:none;
    display:flex;
    align-items:center;
    gap:35px;
}

.hk-desktop-nav .navbar-nav > li > a{
    font-size:15px;
    font-weight:600;
    color:#475569 !important;
    padding:22px 0 !important;
    transition:.3s;
}

.hk-desktop-nav .navbar-nav > li > a:hover{
    color:#2563eb !important;
}

@media(min-width:992px){

    #hk-main-header{
        position:sticky;
        top:0;
        z-index:9999;
        background:#fff;
        backdrop-filter:blur(10px);
    }

}

/* CLOUDHOST DESKTOP HEADER */

#hk-topbar{
display:none!important;
}

#hk-main-header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:999;
background:rgba(255,255,255,.88);
backdrop-filter:blur(14px);
border-bottom:1px solid #e2e8f0;
}

.hk-cloud-header{
height:80px;
display:flex;
align-items:center;
justify-content:space-between;
}

.hk-logo-wrap{
display:flex;
align-items:center;
}

.hk-logo-wrap img{
height:48px;
}

.hk-desktop-menu ul{
display:flex;
gap:40px;
list-style:none;
margin:0;
padding:0;
}

.hk-desktop-menu a{
font-weight:600;
font-size:15px;
color:#475569;
text-decoration:none;
transition:.3s;
}

.hk-desktop-menu a:hover{
color:#2563eb;
}

.hk-right{
display:flex;
align-items:center;
gap:14px;
}

.hk-header-icon{
width:44px;
height:44px;
border-radius:12px;
display:flex;
align-items:center;
justify-content:center;
background:#f8fafc;
border:none;
}

.hk-header-icon:hover{
background:#eff6ff;
}

.hk-hero{
padding-top:140px;
}

/* HEADER LAYOUT */

.hk-cloud-header{
display:flex;
align-items:center;
justify-content:space-between;
height:80px;
width:100%;
}

.hk-header-left{
flex:0 0 auto;
}

.hk-header-middle{
flex:1;
display:flex;
justify-content:center;
}

.hk-right{
flex:0 0 auto;
display:flex;
align-items:center;
gap:12px;
}

/* LOGO */

.hk-site-brand{
display:flex;
align-items:center;
}

.hk-site-brand img{
height:52px;
width:auto;
}

/* NAVIGATION */

.hk-desktop-nav-menu{
display:flex;
align-items:center;
gap:38px;
list-style:none;
margin:0;
padding:0;
}

.hk-desktop-nav-menu>li{
position:relative;
}

.hk-desktop-nav-menu>li>a{
font-size:15px;
font-weight:600;
color:#475569;
text-decoration:none;
padding:28px 0;
display:block;
transition:.25s;
}

.hk-desktop-nav-menu>li>a:hover{
color:#2563eb;
}

/* DROPDOWN */

.hk-dropdown{
position:absolute;
top:100%;
left:0;
background:#fff;
width:260px;
padding:12px 0;
border-radius:14px;
box-shadow:0 20px 50px rgba(0,0,0,.12);
opacity:0;
visibility:hidden;
transform:translateY(10px);
transition:.25s;
list-style:none;
z-index:999;
}

.hk-menu-item:hover .hk-dropdown{
opacity:1;
visibility:visible;
transform:translateY(0);
}

.hk-dropdown li a{
display:block;
padding:12px 18px;
color:#334155;
font-weight:500;
text-decoration:none;
}

.hk-dropdown li a:hover{
background:#f8fafc;
color:#2563eb;
}

/* ICONS */

.hk-header-icon{
width:46px;
height:46px;
border-radius:14px;
background:#f8fafc;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
transition:.25s;
}

.hk-header-icon:hover{
background:#eff6ff;
}

/* DESKTOP WIDTH */

.hk-desktop-container{
max-width:1380px;
width:100%;
}

/* CLOUD HERO */

.hk-cloud-hero{

padding-top:180px;
padding-bottom:120px;

background:
radial-gradient(
circle at top right,
#eff6ff 0%,
#ffffff 60%
);

text-align:center;
}

.hk-main-title{

font-size:72px;
line-height:1.1;
font-weight:800;
max-width:900px;
margin:auto;
color:#0f172a;
}

.hk-main-subtitle{

font-size:20px;
line-height:34px;
max-width:760px;
margin:30px auto;
color:#64748b;
}

/* DOMAIN BOX */

.hk-domain-box{

max-width:850px;
margin:50px auto 0;
}

.hk-domain-box .input-group{

background:#fff;
padding:12px;
border-radius:22px;
box-shadow:
0 20px 50px rgba(0,0,0,.08);

border:1px solid #e2e8f0;
}

.hk-domain-box input.form-control{

height:70px;
font-size:20px;
border:none;
box-shadow:none;
}

.hk-domain-box .btn-primary{

height:70px;
padding:0 40px;

border-radius:16px;

background:#2563eb;
border:none;

font-weight:700;
}

/* PROMO GLASS BAR */

.hk-promo-banner{

margin-top:40px;

display:flex;

justify-content:center;

gap:35px;

padding:24px;

background:
rgba(255,255,255,.75);

backdrop-filter:blur(12px);

border-radius:24px;

border:1px solid #e2e8f0;

max-width:900px;

margin-left:auto;
margin-right:auto;
}

.hk-promo-item{

display:flex;
align-items:center;
gap:10px;

font-weight:600;

color:#334155;
}

.hk-promo-item i{

color:#2563eb;
font-size:18px;
}

/* HERO SPACING */

.hk-cloud-hero-content{

padding-top:60px;
}

/* ACHIEVEMENTS */

.hk-achievements{

padding:120px 0;

background:#f8fafc;
}

.hk-achievement-card{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;

background:#fff;

padding:50px 30px;

text-align:center;

border-radius:24px;

border:1px solid #e2e8f0;

transition:.3s;

height:100%;
}

.hk-achievement-card:hover{

transform:translateY(-10px);

box-shadow:
0 20px 40px rgba(0,0,0,.08);
}

.hk-achievement-card i{

display:flex;

align-items:center;
justify-content:center;

width:80px;
height:80px;

margin:0 auto 25px;

background:#eff6ff;

border-radius:20px;

font-size:34px;

color:#2563eb;
}
.hk-achievement-card h3{

font-size:36px;

font-weight:800;

margin-bottom:10px;

color:#0f172a;
}

.hk-achievement-card span{

font-size:15px;

color:#64748b;
}

/* WHY CHOOSE SECTION */

.hk-features{

padding:140px 0;
background:#fff;
}

.hk-feature-card{
text-align:center;

background:#fff;

border:1px solid #e2e8f0;

border-radius:24px;

padding:40px;

height:100%;

transition:.3s;
}

.hk-feature-card:hover{

transform:translateY(-8px);

box-shadow:
0 20px 40px rgba(0,0,0,.08);

border-color:#2563eb;
}

.hk-feature-card i{

display:flex;

align-items:center;
justify-content:center;

width:70px;
height:70px;

margin:0 auto 25px;

border-radius:18px;

background:#eff6ff;

font-size:28px;

color:#2563eb;
}

.hk-feature-card h3{

font-size:22px;

font-weight:700;

margin-bottom:15px;

color:#0f172a;
}

.hk-feature-card p{

font-size:15px;

line-height:28px;

color:#64748b;
}

/* CLOUDHOST PRICING */

.hk-pricing-section{

padding:140px 0;

background:#fff;
}

.hk-pricing-row{

margin-top:60px;
}
.hk-pricing-row{

display:flex;

flex-wrap:nowrap;

align-items:stretch;

justify-content:center;

gap:30px;
}

.hk-pricing-row .col-md-4{

width:33.333%;

flex:0 0 33.333%;

max-width:33.333%;
}

.hk-pricing-card{

width:100%;
}

/* TESTIMONIAL SLIDER */

.hk-testimonial-slider{

position:relative;

overflow:hidden;

margin-top:60px;
}

.hk-testimonial-track{

display:flex;

transition:transform .6s ease;
}

.hk-testimonial-slide{

flex:0 0 33.333%;

padding:0 15px;
}

.hk-testimonial-card{

height:100%;
}

/* DESKTOP ONLY */

@media(min-width:992px){

.hk-testimonial-slide{

flex:0 0 33.333%;
}

}

/* MOBILE */

@media(max-width:991px){

.hk-pricing-row{

flex-wrap:wrap;
}

.hk-pricing-row .col-md-4{

width:100%;

max-width:100%;

flex:0 0 100%;
}

.hk-testimonial-slide{

flex:0 0 100%;
}

}

.hk-pricing-row > div{

display:flex;
margin-bottom:30px;
}

.hk-pricing-card{

background:#fff;

padding:50px;

border-radius:30px;

border:1px solid #e2e8f0;

text-align:center;

position:relative;

transition:.3s;

height:100%;
}

.hk-pricing-card:hover{

transform:translateY(-12px);

box-shadow:
0 25px 50px rgba(0,0,0,.08);
}

.hk-featured-plan{

border:2px solid #2563eb;

transform:scale(1.05);

box-shadow:
0 25px 50px rgba(37,99,235,.15);
}

.hk-popular-badge{

position:absolute;

top:-15px;
left:50%;

transform:translateX(-50%);

background:#2563eb;

color:#fff;

padding:8px 20px;

border-radius:999px;

font-size:13px;

font-weight:700;
}

.hk-plan-name{

font-size:18px;

font-weight:700;

margin-bottom:20px;
}

.hk-price{

font-size:52px;

font-weight:800;

color:#0f172a;

margin-bottom:30px;
}

.hk-price span{

font-size:16px;

font-weight:500;

color:#64748b;
}

.hk-pricing-card ul{

list-style:none;

padding:0;

margin:0 0 35px;
}

.hk-pricing-card ul li{

position:relative;

padding:12px 0 12px 35px;

text-align:left;

color:#475569;
}

.hk-pricing-card ul li:before{

content:"✓";

position:absolute;

left:0;
top:11px;

width:22px;
height:22px;

background:#dcfce7;

color:#16a34a;

border-radius:50%;

font-size:13px;

font-weight:700;

display:flex;

align-items:center;
justify-content:center;
}

.hk-plan-btn{

width:100%;

border-radius:14px;

padding:14px;
}

.hk-featured-plan{

margin-top:-15px;
z-index:10;
}

.hk-featured-plan:hover{

transform:scale(1.05) translateY(-10px);
}

/* TESTIMONIALS */

.hk-testimonials{

padding:140px 0;

background:#f8fafc;
}

.hk-testimonial-card{

background:#fff;

padding:40px;

border-radius:28px;

border:1px solid #e2e8f0;

height:100%;

transition:.3s;
}

.hk-testimonial-card:hover{

transform:translateY(-10px);

box-shadow:
0 25px 50px rgba(0,0,0,.08);
}

.hk-stars{

font-size:20px;

color:#f59e0b;

margin-bottom:20px;
}

.hk-testimonial-card p{

font-size:16px;

line-height:30px;

color:#475569;

margin-bottom:30px;
}

.hk-client{

font-weight:700;

color:#0f172a;
}

.hk-client span{

display:block;

font-size:14px;

font-weight:500;

color:#64748b;

margin-top:5px;
}

/* DOMAIN SHOWCASE */

.hk-domain-showcase{

padding:140px 0;

background:#ffffff;
}

.hk-domain-card-v2{

background:#fff;

padding:45px;

text-align:center;

border-radius:28px;

border:1px solid #e2e8f0;

transition:.3s;

height:100%;
}

.hk-domain-card-v2:hover{

transform:translateY(-10px);

border-color:#2563eb;

box-shadow:
0 25px 50px rgba(0,0,0,.08);
}

.hk-domain-card-v2 h3{

font-size:42px;

font-weight:800;

color:#2563eb;

margin-bottom:15px;
}

.hk-domain-card-v2 span{

font-size:15px;

color:#64748b;
}

/* SUPPORT CENTER */

.hk-support-center{

padding:140px 0;

background:#f8fafc;
}

.hk-support-card{

display:block;

background:#fff;

padding:50px;

text-align:center;

border-radius:30px;

border:1px solid #e2e8f0;

text-decoration:none;

height:100%;

transition:.3s;
}

.hk-support-card:hover{

transform:translateY(-10px);

text-decoration:none;

box-shadow:
0 25px 50px rgba(0,0,0,.08);
}

.hk-support-card i{

display:flex;

align-items:center;

justify-content:center;

width:90px;
height:90px;

margin:0 auto 25px;

border-radius:24px;

background:#eff6ff;

color:#2563eb;

font-size:36px;
}

.hk-support-card h3{

font-size:24px;

font-weight:700;

color:#0f172a;

margin-bottom:15px;
}

.hk-support-card p{

font-size:15px;

line-height:28px;

color:#64748b;
}

.hk-support-primary{

background:#2563eb;

border-color:#2563eb;
}

.hk-support-primary i{

background:rgba(255,255,255,.15);

color:#fff;
}

.hk-support-primary h3,
.hk-support-primary p{

color:#fff;
}

/* ===== CLOUDHOST NEWS BENTO ===== */

.hk-bento-news{
    margin-top:50px;
}

.hk-news-modern{
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    height:100%;
    transition:.35s ease;
    border:1px solid #e5e7eb;
    box-shadow:0 10px 30px rgba(0,0,0,.04);
}

.hk-news-modern:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 50px rgba(0,0,0,.08);
}

.hk-news-featured{
    min-height:420px;
    padding:50px;
    background:linear-gradient(
        135deg,
        #2563eb,
        #1d4ed8
    );
    color:#fff;
}

.hk-news-featured .hk-news-date{
    background:rgba(255,255,255,.15);
    color:#fff;
}

.hk-news-featured h3{
    margin-top:20px;
}

.hk-news-featured h3 a{
    color:#fff;
    font-size:32px;
    font-weight:700;
    line-height:1.3;
}

.hk-news-featured .hk-news-content{
    color:rgba(255,255,255,.9);
}

.hk-news-date{
    display:inline-block;
    padding:8px 14px;
    border-radius:999px;
    background:#eff6ff;
    color:#2563eb;
    font-size:12px;
    font-weight:600;
    margin-bottom:18px;
}

.hk-news-modern h3{
    font-size:22px;
    font-weight:700;
    line-height:1.4;
}

.hk-news-modern h3 a{
    color:#0f172a;
    text-decoration:none;
}

.hk-news-modern h3 a:hover{
    color:#2563eb;
}

.hk-news-content{
    color:#64748b;
    line-height:1.8;
}

@media (max-width:991px){

    .hk-news-featured{
        min-height:auto;
        margin-bottom:25px;
        padding:35px;
    }

    .hk-news-featured h3 a{
        font-size:26px;
    }

}

.hk-mega-footer{
background:#0f172a;
color:#fff;
padding:80px 0 30px;
margin-top:80px;
}

.hk-footer-brand img{
max-height:55px;
margin-bottom:20px;
}

.hk-mega-footer h4{
font-size:18px;
font-weight:700;
margin-bottom:20px;
}

.hk-footer-links{
list-style:none;
padding:0;
margin:0;
}

.hk-footer-links li{
margin-bottom:12px;
}

.hk-footer-links a{
color:#cbd5e1;
text-decoration:none;
transition:.3s;
}

.hk-footer-links a:hover{
color:#fff;
padding-left:5px;
}

.hk-footer-social{
display:flex;
gap:12px;
margin-top:20px;
}

.hk-footer-social a{
width:40px;
height:40px;
border-radius:50%;
background:rgba(255,255,255,.08);
display:flex;
align-items:center;
justify-content:center;
color:#fff;
}

.hk-footer-bottom{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:20px;
padding-top:20px;
}

.hk-footer-payments{
display:flex;
gap:15px;
font-size:28px;
}

.hk-mega-footer hr{
border-color:rgba(255,255,255,.08);
margin:40px 0;
}

.hk-features-row{
display:flex;
flex-wrap:wrap;
}

.hk-features-row > div{
display:flex;
}

.hk-features-row .hk-feature-card{
height:100%;
}

/* ===== DESKTOP HEADER ===== */

.hk-cloud-header{
display:flex;
align-items:center;
justify-content:space-between;
height:90px;
max-width:1400px;
margin:auto;
padding:0 30px;
}

.hk-header-left{
flex:0 0 auto;
}

.hk-site-brand{
display:flex;
align-items:center;
}

.hk-site-brand img{
max-height:52px;
width:auto;
}

.hk-header-middle{
flex:1;
display:flex;
justify-content:center;
}

.hk-desktop-nav-menu{
display:flex;
align-items:center;
gap:40px;
list-style:none;
margin:0;
padding:0;
}

.hk-desktop-nav-menu li{
position:relative;
}

.hk-desktop-nav-menu a{
font-size:16px;
font-weight:600;
text-decoration:none;
color:#1f2937;
}

.hk-right{
display:flex;
align-items:center;
gap:15px;
}

.hk-header-icon{
width:44px;
height:44px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
background:#f3f4f6;
border:none;
font-size:18px;
}

/* dropdown */

.hk-dropdown{
display:none;
position:absolute;
top:100%;
left:0;
min-width:220px;
background:#fff;
padding:15px 0;
border-radius:12px;
box-shadow:0 15px 40px rgba(0,0,0,.1);
z-index:9999;
}

.hk-dropdown li{
display:block;
}

.hk-dropdown a{
display:block;
padding:10px 20px;
}

.hk-menu-item:hover .hk-dropdown{
display:block;
}

/* account button */

.hk-account-btn{
padding:10px 20px;
background:#16a34a;
color:#fff;
border-radius:10px;
font-weight:600;
text-decoration:none;
}

/* TV screens */

@media(min-width:1600px){

.hk-cloud-header{
max-width:1800px;
}

.hk-desktop-nav-menu{
gap:55px;
}

.hk-desktop-nav-menu a{
font-size:18px;
}
}