* { margin: 0; padding: 0; box-sizing: border-box; }

    body {
      font-family: "Plus Jakarta Sans", sans-serif;
      color: #071529;
      overflow-x: hidden;
    }
.primary-bg-color {
    background-color: #eefcff !important;
}
    a { text-decoration: none !important; }

    .top-bar {
      background: #35b5e9;
      height: 38px;
      color: #fff;
      font-size: 14px;
      font-weight: 600;
    }

    .top-bar .container {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .top-left,
    .top-right {
      display: flex;
      align-items: center;
      gap: 28px;
    }

    .top-bar i {
      font-size: 14px;
      margin-right: 7px;
    }

    .top-right a {
      color: #fff;
      font-weight: 600;
    }

    .social-icons {
      display: flex;
      gap: 15px;
      align-items: center;
    }

    .main-header {
      background: #eefcff;
    
      position: relative;
      z-index: 10;
    }

    .main-header .container {
     
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .brand-area {
      display: flex;
      align-items: center;
      gap: 20px;
    }

    .logo img { width: 135px; }
    .flag img { width: 62px; height: auto; }

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

    .nav-menu > li {
      position: relative;
      padding: 0;
    }

    .nav-menu > li > a {
      color: #071529;
      font-size: 14px;
      font-weight: 700;
		padding: 0
    }

    .nav-menu > li > a.active { color: #27aef3; }

    .nav-menu i {
      margin-left: 5px;
      font-size: 12px;
    }

    .dropdown-box {
      position: absolute;
      top: 100%;
      left: 0;
      width: 220px;
      background: #fff;
      border: 1px solid #e4e4e4;
      display: none;
      z-index: 99;
      box-shadow: 0 4px 12px rgba(0,0,0,0.04);
    }

    .nav-menu li:hover .dropdown-box { display: block; }

    .dropdown-box a {
      display: block;
      padding: 14px 16px;
      color: #071529;
      font-size: 15px;
      font-weight: 600;
      border-bottom: 1px solid #dedede;
    }

    .dropdown-box a:last-child { border-bottom: none; }

    .user-icon {
      width: 42px;
      height: 42px;
      background: #071529;
      border-radius: 50%;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 17px;
    }

    .hero {
      background: #eefcff;
      min-height: 470px;
      position: relative;
      overflow: hidden;
    }

    .hero .container {
      min-height: 470px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .hero-content {
      max-width: 650px;
      padding-top: 10px;
    }

    .hero-content .small-title {
      font-size: 19px;
      font-weight: 800;
      margin-bottom: 6px;
      color: #111a2d;
    }

    .hero-content h1 {
      font-size: 44px;
      line-height: 1.15;
      font-weight: 400;
      color: #071529;
      margin-bottom: 22px;
    }

    .hero-content h1 strong { font-weight: 800; }

    .hero-content p {
      font-size: 18px;
      line-height: 1.55;
      color: #76879b;
      max-width: 720px;
      margin-bottom: 20px;
    }

    .price {
      font-size: 18px;
      color: #76879b;
      margin-bottom: 24px;
    }

    .price del {
      color: #ff2b45;
      font-weight: 600;
    }

    .price span {
      color: #28aef3;
      font-weight: 800;
    }






/* ===============================
   GiddyHost Store Mega Menu
================================ */



/* =========================
   GIDDYHOST HEADER GLOBAL
========================= */

.top-bar {
    background: #35b7ea;
    color: #fff;
    height: 38px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
}

.top-bar .container {
    max-width: 1180px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-left,
.top-right,
.social-icons {
    display: flex;
    align-items: center;
}

.top-left {
    gap: 10px;
}

.top-right {
    gap: 24px;
}

.top-bar a,
.top-bar div {
    color: #fff;
    text-decoration: none;
}

.top-bar i {
    margin-right: 6px;
    font-size: 13px;
}

.social-icons {
    gap: 13px;
}

.main-header {
    background: #eefcff;
   
    position: relative;
    z-index: 999;
    font-family: "Plus Jakarta Sans", sans-serif;
}

.main-header > .container {
    max-width: 1180px;
   
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

#Primary_Navbar-Network_Status {
	display: none !important
}
.brand-area {
    display: flex;
    align-items: center;
    gap: 30px;
    flex-shrink: 0;
}

.logo img {
    width: 128px;
    height: auto;
    display: block;
}

.flag img {
    width: 58px;
    height: auto;
    display: block;
}

.user-icon {
    width: 40px;
    height: 40px;
    background: #071529;
    color: #fff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin-left: 22px;
    flex-shrink: 0;
}

.user-icon i {
    font-size: 16px;
}

.mobile-toggle {
    display: none;
    font-size: 25px;
    color: #071529;
    cursor: pointer;
}


/* =========================
   LOGGED OUT NAVBAR
========================= */

.nav-menu,
.client-main-nav > ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    justify-content: right;
    margin-left: 20px;
}

.nav-menu > li,
.client-main-nav > ul > li {
    position: relative;
}

.nav-menu > li > a,
.client-main-nav > ul > li > a {
        color: #071529;
    font-size: 15px;
    line-height: 22px;
    font-weight: 600;
    letter-spacing: -0.2px;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 25px 10px;
    white-space: nowrap;
}

.nav-menu > li > a:hover,
.nav-menu > li > a.active,
.client-main-nav > ul > li > a:hover,
.client-main-nav > ul > li > a.active {
    color: #24aef2 !important;
}

.nav-menu > li > a i,
.client-main-nav > ul > li > a i {
    font-size: 11px;
    color: #071529;
    margin-left: 3px;
}

.nav-menu > li > a:hover i,
.client-main-nav > ul > li > a:hover i {
    color: #24aef2;
}


/* =========================
   DEFAULT WHMCS DROPDOWN FIX
   for navbar.tpl output
========================= */

.nav-menu .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 230px;
    background: #fff;
    border: 1px solid #edf0f5;
    border-radius: 5px;
    padding: 0;
    margin: 0;
    box-shadow: 0 18px 45px rgba(30, 45, 70, 0.14);
    z-index: 9999;
}

.nav-menu li:hover > .dropdown-menu {
    display: block;
}

.nav-menu .dropdown-menu li {
    display: block;
    width: 100%;
}

.nav-menu .dropdown-menu a {
    display: block;
    padding: 13px 18px;
    color: #222 !important;
    font-size: 14px;
    font-weight: 500;
    border-bottom: 1px solid #f0f2f5;
    white-space: nowrap;
}

.nav-menu .dropdown-menu a:hover {
    background: #f7fbff;
    color: #24aef2 !important;
}

@media screen and (max-width: 1199px){
	.top-right {display: none !important}

}

/* =========================
   LOGGED IN NAV
========================= */

.client-main-nav {
    margin-left: auto;
}

.client-main-nav > ul {
    gap: 25px;
}

.client-main-nav > ul > li > a {
    font-weight: 500;
}


.top_bar_so {
    display: flex;
    gap: 20px;
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.top_bar_so  li.dropdown ul {
 background: #ffffff;
}

.top_bar_so  li.dropdown ul li {
  margin-bottom: 5px
}
.top_bar_so  li.dropdown ul li a {
  color: #000;
 font-size: 14px;
 line-height: 14px;
}

/* =========================
   SMALL DROPDOWNS
========================= */

.client-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 260px;
    background: #fff;
    border-radius: 6px;
    border: 1px solid #eef1f6;
    box-shadow: 0 18px 45px rgba(30, 45, 70, 0.14);
    padding: 7px 0;
    display: none;
    overflow: hidden;
    z-index: 9999;
}

.client-main-nav > ul > li:hover > .client-dropdown-menu {
    display: block;
}

.client-dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 22px;
    color: #222;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    border-bottom: 1px solid #f1f2f5;
}

.client-dropdown-menu a:last-child {
    border-bottom: none;
}

.client-dropdown-menu a:hover {
    background: #f7fbff;
    color: #24aef2;
}

.client-dropdown-menu a i {
    width: 17px;
    color: #a6adb8;
    font-size: 14px;
    text-align: center;
}


/* =========================
   PRODUCTS MEGA MENU
========================= */

.client-mega-menu {
    position: fixed;
    top: 110px;
    left: 50%;
    transform: translateX(-50%);
    width: 1040px;
    max-width: calc(100vw - 40px);
    background: #fff;
    border-radius: 6px;
    border: 1px solid #eef1f6;
    box-shadow: 0 22px 55px rgba(30, 45, 70, 0.15);
    padding: 30px 34px;
    display: none;
    z-index: 9999;
}

.client-main-nav > ul > li:hover > .client-mega-menu {
    display: block;
}

.client-mega-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 42px;
}

.client-mega-menu h4 {
    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
    color: #151515;
    margin: 0 0 18px;
}

.client-mega-menu a {
    display: flex;
    align-items: center;
    gap: 14px;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 0;
    text-decoration: none !important;
}

.client-mega-menu a:hover {
    color: #24aef2;
}

.client-mega-menu a i {
    width: 16px;
    color: #a6adb8;
    font-size: 13px;
    text-align: center;
}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1199px) {
    .top-bar .container,
    .main-header > .container {
        max-width: 960px;
    }

    .brand-area {
        gap: 15px;
    }

    .nav-menu,
    .client-main-nav > ul {
        gap: 0;
    }

	.top-bar .container {
     display: block

}
	
	.top-bar a, .top-bar div {
    color: #fff;
    text-decoration: none;
    justify-content: center;
}
	.top-bar .container ,
  .top-bar
{
  height: auto

 }

	.top-left {

   margin-bottom: 5px;
}
}

@media (max-width: 991px) {
    .top-bar {
        height: auto;
        padding: 9px 0;
    }

    .top-bar .container {
        height: auto;
        flex-direction: column;
        justify-content: center;
        gap: 8px;
        text-align: center;
    }

    .top-right {
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }

    .main-header {
        height: 82px;
    }

    .main-header > .container {
        height: 82px;
        padding-left: 18px;
        padding-right: 18px;
    }

    .brand-area {
        gap: 22px;
    }

    .logo img {
        width: 112px;
    }

    .flag img {
        width: 48px;
    }

    .mobile-toggle {
        display: block;
        margin-left: auto;
    }

    .user-icon {
        display: none;
    }

    .nav-menu,
    .client-main-nav {
        position: absolute;
        top: 82px;
        left: 0;
        right: 0;
        background: #fff;
        display: none;
        padding: 12px 20px 18px;
        box-shadow: 0 18px 40px rgba(0, 0, 0, 0.1);
        z-index: 9999;
        max-height: calc(100vh - 82px);
        overflow-y: auto;
    }

    .nav-menu.active,
    .client-main-nav.active {
        display: block;
    }

    .nav-menu,
    .client-main-nav > ul {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .nav-menu > li,
    .client-main-nav > ul > li {
        width: 100%;
    }

    .nav-menu > li > a,
    .client-main-nav > ul > li > a {
        padding: 14px 0;
        border-bottom: 1px solid #eef1f6;
        font-size: 15px;
        justify-content: space-between;
    }

    .client-dropdown-menu,
    .client-mega-menu,
    .nav-menu .dropdown-menu {
        position: static;
        transform: none;
        width: 100%;
        max-width: 100%;
        display: none;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        padding: 6px 0 10px 12px;
        margin: 0;
        background: #f8fbff;
    }

    .client-main-nav li.open > .client-dropdown-menu,
    .client-main-nav li.open > .client-mega-menu,
    .nav-menu li.open > .dropdown-menu {
        display: block;
    }

    .client-main-nav > ul > li:hover > .client-dropdown-menu,
    .client-main-nav > ul > li:hover > .client-mega-menu,
    .nav-menu li:hover > .dropdown-menu {
        display: none;
    }

    .client-main-nav li.open:hover > .client-dropdown-menu,
    .client-main-nav li.open:hover > .client-mega-menu,
    .nav-menu li.open:hover > .dropdown-menu {
        display: block;
    }

    .client-mega-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .client-mega-menu h4 {
        margin-top: 10px;
        margin-bottom: 8px;
    }

    .client-dropdown-menu a,
    .client-mega-menu a,
    .nav-menu .dropdown-menu a {
        padding: 11px 12px;
        font-size: 14px;
    }
}

@media (max-width: 575px) {
    .top-left div {
        font-size: 12px;
    }

    .top-right {
        font-size: 12px;
    }

    .flag {
        display: none;
    }

    .logo img {
        width: 118px;
    }
}

/* STORE MEGA MENU FIX */
.nav-menu .gh-store-mega-parent {
    position: static !important;
}

.nav-menu .gh-store-toggle {
    color: #071529;
    font-size: 16px;
    font-weight: 600;
    padding: 25px 10px !important;
    display: flex;
    align-items: center;
    gap: 2px;
    text-decoration: none !important;
    white-space: nowrap;
}

.nav-menu .gh-store-arrow {
    font-size: 12px;
    line-height: 1;
}

.nav-menu .gh-store-mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 1040px;
    max-width: calc(100vw - 40px);
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 6px;
    box-shadow: 0 22px 55px rgba(30,45,70,0.15);
    padding: 30px 34px;
    display: none;
    z-index: 99999;
}

.nav-menu .gh-store-mega-parent:hover .gh-store-mega-menu {
    display: block;
}

.nav-menu .gh-store-mega-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 42px;
}

.nav-menu .gh-store-mega-col h4 {
    font-size: 15px;
    font-weight: 700;
    color: #151515;
    margin: 0 0 18px;
    line-height: 20px;
}

.nav-menu .gh-store-mega-col a {
    display: flex;
    align-items: center;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 0;
    border: 0 !important;
    background: transparent !important;
    text-decoration: none !important;
    white-space: normal;
}

.nav-menu .gh-store-mega-col a:hover {
    color: #24aef2 !important;
}

/* MOBILE */
@media (max-width: 991px) {
    .nav-menu .gh-store-mega-parent {
        position: relative !important;
    }

    .nav-menu .gh-store-toggle {
        padding: 14px 0;
        border-bottom: 1px solid #eef1f6;
        font-size: 15px;
        justify-content: space-between;
    }

    .nav-menu .gh-store-mega-menu {
        position: static !important;
        transform: none !important;
        width: 100% !important;
        max-width: 100% !important;
        display: none !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #f8fbff !important;
        padding: 12px 0 12px 15px !important;
    }

    .nav-menu .gh-store-mega-parent.open .gh-store-mega-menu {
        display: block !important;
    }

    .nav-menu .gh-store-mega-parent:hover .gh-store-mega-menu {
        display: none !important;
    }

    .nav-menu .gh-store-mega-parent.open:hover .gh-store-mega-menu {
        display: block !important;
    }

    .nav-menu .gh-store-mega-inner {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .nav-menu .gh-store-mega-col h4 {
        font-size: 14px;
        margin: 8px 0;
    }

    .nav-menu .gh-store-mega-col a {
        font-size: 14px;
        padding: 9px 0;
    }
}

.nav-menu .gh-store-mega-parent:hover .gh-store-mega-menu,
.nav-menu .gh-store-mega-parent.gh-store-open .gh-store-mega-menu {
    display: block;
}

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

    .nav-menu .gh-store-mega-parent.open .gh-store-mega-menu {
        display: block !important;
    }
}

.client-user-menu {
    position: relative;
    margin-left: 22px;
}

.client-user-menu .user-icon {
    margin-left: 0;
}

.client-user-dropdown {
    position: absolute;
    top: 52px;
    right: 0;
    width: 220px;
    background: #fff;
    border-radius: 6px;
    border: 1px solid #eef1f6;
    box-shadow: 0 18px 45px rgba(30,45,70,0.14);
    display: none;
    overflow: hidden;
    z-index: 99999;
}

.client-user-menu:hover .client-user-dropdown {
    display: block;
}

.client-user-dropdown a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 18px;
    color: #222;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none !important;
    border-bottom: 1px solid #f1f2f5;
}

.client-user-dropdown a:hover {
    background: #f7fbff;
    color: #24aef2;
}

.client-user-dropdown a i {
    width: 16px;
    color: #a6adb8;
}

    .btn-main {
      background: linear-gradient(90deg, #31b9eb, #2478ff);
      color: #fff;
      border-radius: 4px;
      padding: 17px 36px;
      font-size: 16px;
      font-weight: 800;
      display: inline-block;
      min-width: 190px;
      text-align: center;
    }

    .btn-main:hover { color: #fff; }

    .hero-image img {
      width: 520px;
      max-width: 100%;
    }

    .footer-cta {
      background: #dff7ff;
      height: 120px;
    }

    .footer-cta .container {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .footer-cta h2 {
      font-size: 24px;
      font-weight: 800;
      margin: 0;
    }

    .offer-text {
      text-align: center;
      font-weight: 600;
      font-size: 16px;
    }

    .offer-text span {
      display: block;
      color: #159ef0;
      font-size: 24px;
      font-weight: 800;
      margin-top: 4px;
    }









    .site-footer {
      background: linear-gradient(90deg, #fff 0%, #e4f9ff 65%, #dff7ff 100%);
      padding: 75px 0 32px;
    }

    .footer-watermark {
      text-align: center;
      margin-bottom: 10px;
    }

    .footer-watermark img {
     
      max-width: 60%;
    }

    .footer-about {
      max-width: 760px;
      margin: 0 auto 14px;
      text-align: center;
      font-size: 15px;
      line-height: 1.55;
      color: #071529;
      font-weight: 500;
    }

    .footer-social {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 11px;
      margin-bottom: 40px;
    }

    .footer-social a {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
    }

    .facebook { background: #314f8c; }
    .instagram { background: #111; }
    .x-twitter { background: #000; }
    .youtube { background: #e91b23; }

    .footer-divider {
      border-top: 1px solid rgba(0,0,0,0.12);
      margin-bottom: 35px;
    }

    .footer-title {
      font-size: 17px;
      font-weight: 800;
      margin-bottom: 17px;
      color: #071529;
    }

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

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

    .footer-links a {
      color: #63738b;
      font-size: 15px;
      font-weight: 500;
    }

    .footer-contact {
      border-top: 1px solid rgba(0,0,0,0.12);
      border-bottom: 1px solid rgba(0,0,0,0.12);
      margin-top: 36px;
      padding: 22px 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #63738b;
      font-size: 14px;
      font-weight: 700;
    }

    .footer-contact i {
      background: #24aeee;
      color: #fff;
      width: 27px;
      height: 27px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-right: 8px;
      font-size: 12px;
    }

    .footer-bottom {
      padding-top: 34px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      align-items: center;
    }

    .review-badges {
      display: flex;
      gap: 14px;
      align-items: center;
    }

    .review-badges img { max-height: 38px; }

    .copyright {
      text-align: center;
      color: #63738b;
      font-size: 14px;
      font-weight: 700;
    }

    .payment-icons { text-align: right; }
    .payment-icons img { max-height: 32px; }

    .mobile-toggle {
      display: none;
      font-size: 26px;
      color: #071529;
      cursor: pointer;
    }

    @media (max-width: 991px) {
      .top-bar {
        height: auto;
        padding: 10px 0;
      }

      .top-bar .container,
      .top-left,
      .top-right {
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
      }

      .main-header .container { height: 70px; }

      .brand-area { gap: 25px; }

      .mobile-toggle { display: block;         order: 3; }

      .nav-menu {
        position: absolute;
        top: 70px;
        left: 0;
        right: 0;
        background: #fff;
        display: none;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        padding: 15px 25px;
      }

      .nav-menu.active { display: flex; }

      .nav-menu > li {
        padding: 12px 0;
        width: 100%;
      }

      .dropdown-box {
        position: static;
        width: 100%;
        display: block;
        box-shadow: none;
        margin-top: 10px;
      }

      .user-icon { display: none; }

      .hero .container {
        flex-direction: column;
        text-align: center;
        padding: 45px 15px;
      }

      .hero-content h1 { font-size: 36px; }

      .hero-image { margin-top: 35px; }

      .footer-cta {
        height: auto;
        padding: 28px 0;
      }

      .footer-cta .container {
        flex-direction: column;
        gap: 20px;
        text-align: center;
      }

      .footer-bottom {
        grid-template-columns: 1fr;
        gap: 22px;
        text-align: center;
      }

      .review-badges {
        justify-content: center;
      }

      .payment-icons {
        justify-content: center;
        text-align: center;
      }

      .footer-contact {
        flex-direction: column;
        gap: 15px;
        text-align: center;
      }
    }

    @media (max-width: 575px) {
      .logo img { width: 118px; }
      .flag img { width: 48px; }

      .hero-content h1 { font-size: 30px; }

      .hero-content p,
      .price { font-size: 16px; }

      .footer-watermark img { width: 330px; }
    }













/* =====================================================
   WHMCS CLIENT AREA LAYOUT FIX - GIDDYHOST
   Add this at bottom of custom.css
===================================================== */
body, btn, button, input, p , h1,h2,h3,h4,h5, label, strong, b , a
{
 font-family: "Plus Jakarta Sans", sans-serif !important;
}


.master-breadcrumb , .master-breadcrumb .breadcrumb {
    background-color: #dff7ff;
}


.btn-success {
    color: #fff;
    background-color: #22bcf4;
    border-color: #22bcf4;
}

.btn-success:hover {
  color: #159ef0;
    background-color: #dff7ff;
    border-color: #dff7ff;
}

.alert-warning {
    color: #6398fd;
    background-color: #dff7ff;
    border-color: #dff7ff;
}

.card-header {
    background: #22bcf4;
}

.card-header h3 {
 color: #ffffff
}

.sidebar .card-sidebar{
    border: 1px solid #22bcf4;
}

.list-group-item {
    background-color: #eefcff;
	    color: #22bcf4;
}

.sidebar .list-group-item.active, .sidebar .list-group-item.active:focus, .sidebar .list-group-item.active:hover {
    background-color: #dff7ff;
    border-color: #dff7ff;
    color: #159ef0;
}


#order-standard_cart .products .product div.product-desc,
#order-standard_cart .products .product footer
 {
  width: 100% !important;
	  text-align: center !important;

}



#order-standard_cart .products .product header {
    padding: 40px 20px 0 !important;
}
#order-standard_cart .products .product header {
  background: #fff !important;
    text-align: center !important;
}
#order-standard_cart .products .product {
  border: none !important;
}

#order-standard_cart .products .product header span {
font-size: 24px !important;
    font-weight: 600 !important;
}

#order-standard_cart .products .product div.product-desc p  {
  font-size: 16px !important;
  line-height: 36px !important;
	 color: #5e636e !important;
}

#order-standard_cart .products .product footer {
     margin: 0 0 40px !important;
}

#order-standard_cart .products .product div.product-pricing .price {
   font-size: 26px!important ;
   line-height: 36px!important ;
   font-weight: 700 !important ;
   color: #000 !important ;
}

#order-standard_cart .products .btn-success  {
    color: #fff !important; 
    background-color: #22bcf4 !important;
    border-color: #22bcf4 !important;
    font-size: 16px !important;
    padding: 16px 40px !important;
    line-height: 16px !important;
}




#order-standard_cart.order_form_bx .cart-body {
 width: 100% !important;

}



/* ==================================================
   GiddyHost WHMCS Standard Cart - Clean Example Style
================================================== */

/* ================================
   WHMCS Standard Cart - Domain Step
   GiddyHost Clean Responsive Design
================================ */

body {
    background: #f3f8ff !important;
}

.suggested-domains .card-header, .suggested-domains .panel-heading {
border-bottom: 2px solid #35b7ea !important;
    color: #fff !important;
}


/* Main order form width */
#order-standard_cart {
    max-width: 1180px;
    margin: 0 auto;
    padding: 55px 20px;
}

/* Page title */
#order-standard_cart h1,
#order-standard_cart .main-heading,
#order-standard_cart h2 {
    font-size: 38px !important;
    font-weight: 800 !important;
    color: #06162f !important;
    margin-bottom: 35px !important;
}

/* Domain option box */
#order-standard_cart .domain-selection-options {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 36px 42px !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.08) !important;
    border: 1px solid #e8eef7 !important;
    margin-bottom: 0 !important;
}

/* Radio rows */
#order-standard_cart .domain-selection-options .option {
    display: block!important;
    align-items: center !important;
    gap: 14px !important;
    padding: 13px 0 !important;
    font-size: 16px !important;
    color: #10213f !important;
    background: transparent !important;
    border: 0 !important;
}

#order-standard_cart input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: #36b7e6 !important;
}

/* Search area */
#order-standard_cart .domain-input-group,
#order-standard_cart .domain-search-wrapper,
#order-standard_cart .domain-checker-container {
    background: linear-gradient(135deg, #36b7e6, #24aee0) !important;
    padding: 38px 42px !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.08) !important;
    margin-bottom: 24px !important;
}

/* Domain form layout */
#order-standard_cart .domain-input-group .input-group,
#order-standard_cart .domain-checker-container .input-group {
    display: flex !important;
    align-items: stretch !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 850px !important;
    margin: 0 auto !important;
}

/* Remove old bootstrap joining */
#order-standard_cart .input-group .form-control,
#order-standard_cart .input-group select,
#order-standard_cart .input-group-btn .btn {
    border-radius: 6px !important;
}

/* Input field */
#order-standard_cart input[name="domain"],
#order-standard_cart .domain-input-group input,
#order-standard_cart .domain-checker-container input[type="text"] {
    height: 54px !important;
    background: #ffffff !important;
    border: 1px solid #dbe6f2 !important;
    color: #06162f !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 0 22px !important;
    box-shadow: none !important;
}

/* WWW addon */
#order-standard_cart .input-group-addon {
    height: 54px !important;
    background: #f8fbff !important;
    border: 1px solid #dbe6f2 !important;
    color: #5e708c !important;
    font-size: 15px !important;
    padding: 0 18px !important;
    display: flex !important;
    align-items: center !important;
}

/* TLD dropdown */
#order-standard_cart select[name="tld"],
#order-standard_cart .domain-input-group select,
#order-standard_cart .domain-checker-container select {
    height: 54px !important;
    min-width: 120px !important;
    background: #ffffff !important;
    border: 1px solid #dbe6f2 !important;
    color: #06162f !important;
    font-size: 16px !important;
    padding: 0 16px !important;
    box-shadow: none !important;
}

/* Check button */
#order-standard_cart .domain-input-group .btn,
#order-standard_cart .domain-checker-container .btn,
#order-standard_cart button[type="submit"],
#order-standard_cart #btnCheckAvailability {
    height: 54px !important;
    min-width: 130px !important;
    background: #dbe9ff !important;
    border: 0 !important;
    color: #239fde !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart .domain-input-group .btn:hover,
#order-standard_cart .domain-checker-container .btn:hover,
#order-standard_cart #btnCheckAvailability:hover {
    background: #ffffff !important;
    color: #118fc9 !important;
}

/* Available domain result card */
#order-standard_cart .domain-available,
#order-standard_cart .domain-result,
#order-standard_cart .domain-checker-result,
#order-standard_cart .domain-pricing {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 36px 42px !important;
    margin: 24px 0 !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.08) !important;
    border: 1px solid #e8eef7 !important;
}

/* Available text */
#order-standard_cart .domain-available strong,
#order-standard_cart .domain-result strong,
#order-standard_cart .text-success {
    color: #2cbc57 !important;
    font-size: 24px !important;
    font-weight: 800 !important;
}

#order-standard_cart .domain-available,
#order-standard_cart .domain-result {
    font-size: 21px !important;
    color: #2cbc57 !important;
}

/* Price */
#order-standard_cart .domain-price,
#order-standard_cart .price,
#order-standard_cart .domain-pricing .price {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #06162f !important;
	 order: 1
}

/* Add to cart button */
#order-standard_cart .btn-add-to-cart,
#order-standard_cart .domain-contact-support,
#order-standard_cart .domain-result .btn,
#order-standard_cart .domain-available .btn {
    background: #dbe9ff !important;
    color: #239fde !important;
    border: 0 !important;
    min-width: 140px !important;
    height: 40px !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
	 order: 2
}

#order-standard_cart .btn-add-to-cart:hover,
#order-standard_cart .domain-result .btn:hover,
#order-standard_cart .domain-available .btn:hover {
    background: #36b7e6 !important;
    color: #ffffff !important;
}

/* Suggested domains title */
#order-standard_cart h3,
#order-standard_cart .suggested-domains h3 {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #06162f !important;
    margin: 38px 0 18px !important;
}

/* Suggested domains rows */
#order-standard_cart .suggested-domains,
#order-standard_cart .domain-suggestions {
    background: transparent !important;
}

#order-standard_cart .suggested-domains .list-group-item,
#order-standard_cart .domain-suggestions .list-group-item,
#order-standard_cart .domain-suggestion {
  background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 10px !important;
    margin-bottom: 12px !important;
    padding: 15px 22px !important;
    box-shadow: 0 8px 24px rgba(6, 22, 47, 0.05) !important;
    float: left;
    width: 100%;
    vertical-align: middle;
    justify-content: center;
    align-items: center;
}

.suggested-domains .actions{
  display: flex !important;
}

#domainSuggestions .domain-suggestion .domain ,
#domainSuggestions .domain-suggestion .extension
 {
      color: #000 !important;
    font-size: 16px !important;
    line-height: 16px !important;
    font-weight: 400 !important;
    margin-top: 14px !important;
    display: inline-block !important;
}

#domainSuggestions .domain-suggestion .extension {
	
	    color: #22bcf4 !important;
	 font-weight: 800 !important;
}

/* Responsive */
@media (max-width: 991px) {
    #order-standard_cart {
        padding: 35px 16px;
    }

    #order-standard_cart h1,
    #order-standard_cart h2 {
        font-size: 32px !important;
    }

    #order-standard_cart .domain-selection-options {
        padding: 28px 26px !important;
    }

    #order-standard_cart .domain-input-group,
    #order-standard_cart .domain-search-wrapper,
    #order-standard_cart .domain-checker-container {
        padding: 30px 26px !important;
    }
}

@media (max-width: 767px) {
    #order-standard_cart h1,
    #order-standard_cart h2 {
        font-size: 28px !important;
        margin-bottom: 25px !important;
    }

    #order-standard_cart .domain-input-group .input-group,
    #order-standard_cart .domain-checker-container .input-group {
        display: block !important;
    }

    #order-standard_cart .input-group-addon,
    #order-standard_cart input[name="domain"],
    #order-standard_cart .domain-checker-container input[type="text"],
    #order-standard_cart select[name="tld"],
    #order-standard_cart .domain-checker-container select,
    #order-standard_cart #btnCheckAvailability,
    #order-standard_cart .domain-input-group .btn {
        width: 100% !important;
        min-width: 100% !important;
        margin: 0 0 12px 0 !important;
        border-radius: 6px !important;
    }

    #order-standard_cart .domain-available,
    #order-standard_cart .domain-result,
    #order-standard_cart .domain-checker-result,
    #order-standard_cart .domain-pricing {
        padding: 28px 22px !important;
        text-align: center !important;
    }

    #order-standard_cart .text-success,
    #order-standard_cart .domain-available strong {
        font-size: 21px !important;
    }
}

@media (max-width: 480px) {
    #order-standard_cart {
        padding: 25px 12px;
    }

    #order-standard_cart h1,
    #order-standard_cart h2 {
        font-size: 25px !important;
    }

    #order-standard_cart .domain-selection-options,
    #order-standard_cart .domain-input-group,
    #order-standard_cart .domain-search-wrapper,
    #order-standard_cart .domain-checker-container {
        padding: 24px 18px !important;
    }

    #order-standard_cart .domain-selection-options .option {
        font-size: 14px !important;
    }
}






/* =====================================================
   WHMCS Standard Cart - Configure Server Page Only
   Add below your current CSS
===================================================== */

#order-standard_cart .products,
#order-standard_cart .product-info,
#order-standard_cart .product-details,
#order-standard_cart .configurable-options,
#order-standard_cart .addon-products .panel,
#order-standard_cart .panel-addon,
#order-standard_cart .order-summary {
    
    border: 1px solid #e8eef7 !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 32px rgba(6, 22, 47, .07) !important;
}

#order-standard_cart .product-info,
#order-standard_cart .product-details {
    padding: 28px 32px !important;
    margin-bottom: 28px !important;
}

#order-standard_cart .product-info h3,
#order-standard_cart .product-details h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #06162f !important;
}

/* Billing cycle boxes */
#order-standard_cart .billingcycle,
#order-standard_cart .billing-cycle {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
    margin: 20px 0 32px !important;
}

#order-standard_cart .billingcycle label,
#order-standard_cart .billing-cycle label {
    background: #fff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 8px !important;
    padding: 18px !important;
    min-height: 78px !important;
    box-shadow: 0 8px 22px rgba(6, 22, 47, .05) !important;
}

/* Addon cards */
#order-standard_cart .addon-products .panel,
#order-standard_cart .panel-addon {
    margin-bottom: 18px !important;
    overflow: hidden !important;
}

#order-standard_cart .addon-products .panel-body,
#order-standard_cart .panel-addon .panel-body {
    padding: 26px 30px !important;
    position: relative !important;
}

#order-standard_cart .addon-products h4,
#order-standard_cart .panel-addon h4 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #06162f !important;
}

#order-standard_cart .addon-products p,
#order-standard_cart .panel-addon p {
    max-width: 72% !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: #5f7188 !important;
}

#order-standard_cart .addon-products img,
#order-standard_cart .panel-addon img {
    max-width: 110px !important;
    max-height: 90px !important;
    position: absolute !important;
    top: 22px !important;
    right: 24px !important;
}

#order-standard_cart .addon-products label,
#order-standard_cart .panel-addon label {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 7px 0 !important;
    font-size: 13px !important;
    color: #263850 !important;
}

/* Order Summary */
#order-standard_cart .order-summary {
    position: sticky !important;
    top: 20px !important;
    padding: 0 !important;
    overflow: hidden !important;
}

#order-standard_cart .order-summary h2 {
    background: none !important;
    color: #000 !important;
    padding: 0px 24px 15px !important;
    font-size: 20px !important;
    margin: 0 !important;
	border-bottom: 1px solid #ccc;
}

#order-standard_cart .summary-container {
 background-color: transparent !important;
}

#order-standard_cart .order-summary .summary-container,
#order-standard_cart .order-summary .content,
#order-standard_cart .order-summary .summary-totals {
    padding: 18px 22px !important;
}

#order-standard_cart .order-summary .total-due-today {
    border-top: 1px solid #edf2f8 !important;
    padding-top: 16px !important;
    margin-top: 14px !important;
}

#order-standard_cart .order-summary .amt {
    font-size: 24px !important;
    font-weight: 900 !important;
    color: #06162f !important;
}

/* Continue buttons */
#order-standard_cart .btn-primary,
#order-standard_cart .btn-success,
#order-standard_cart button[type="submit"] {
    background: #22bcf4 !important;
    border-color: #22bcf4 !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-weight: 800 !important;
    min-height: 44px !important;
}

#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart button[type="submit"]:hover {
    background: #159ed0 !important;
    border-color: #159ed0 !important;
    color: #fff !important;
}

/* Responsive */
@media (max-width: 991px) {
    #order-standard_cart .row {
        display: block !important;
    }

    #order-standard_cart .col-md-8,
    #order-standard_cart .col-md-4 {
        width: 100% !important;
        max-width: 100% !important;
		        margin: 0;
    }

    #order-standard_cart .order-summary {
        position: static !important;
        margin-top: 25px !important;
    }
}

@media (max-width: 767px) {
    #order-standard_cart .billingcycle,
    #order-standard_cart .billing-cycle {
        grid-template-columns: 1fr !important;
    }

    #order-standard_cart .product-info,
    #order-standard_cart .product-details,
    #order-standard_cart .addon-products .panel-body,
    #order-standard_cart .panel-addon .panel-body {
        padding: 22px 18px !important;
    }

    #order-standard_cart .addon-products p,
    #order-standard_cart .panel-addon p {
        max-width: 100% !important;
    }

    #order-standard_cart .addon-products img,
    #order-standard_cart .panel-addon img {
        position: static !important;
        display: block !important;
        margin: 12px 0 10px auto !important;
        max-width: 88px !important;
    }
}



/* =====================================================
   WHMCS Standard Cart - Domains Configuration Page
   Add below all current CSS
===================================================== */

#order-standard_cart .domain-config,
#order-standard_cart .domain-config-container {
    max-width: 100% !important;
}

#order-standard_cart .sub-heading {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    margin: 34px 0 22px !important;
    color: #229fd4 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-align: center !important;
}

#order-standard_cart .sub-heading:before,
#order-standard_cart .sub-heading:after {
    content: "" !important;
    flex: 1 !important;
    height: 1px !important;
    background: #cfe5ee !important;
}

#order-standard_cart .domain-config .row {
    margin-bottom: 16px !important;
}

#order-standard_cart .domain-config label {
    color: #6f7f91 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

#order-standard_cart .domain-config strong {
    color: #06162f !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

#order-standard_cart .domain-config .text-success {
    color: #28b85d !important;
    font-weight: 800 !important;
}

#order-standard_cart .domain-addons,
#order-standard_cart .domain-addon,
#order-standard_cart .dns-management,
#order-standard_cart .panel-addon {
    background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 10px !important;
    box-shadow: 0 14px 34px rgba(6, 22, 47, 0.07) !important;
    overflow: hidden !important;
    margin-bottom: 34px !important;
}

#order-standard_cart .domain-addons .panel-body,
#order-standard_cart .domain-addon .panel-body,
#order-standard_cart .dns-management .panel-body,
#order-standard_cart .panel-addon .panel-body {
    padding: 32px 34px 26px !important;
    min-height: 120px !important;
    position: relative !important;
}

#order-standard_cart input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: #22bcf4 !important;
}

#order-standard_cart .domain-addons h4,
#order-standard_cart .domain-addon h4,
#order-standard_cart .dns-management h4,
#order-standard_cart .panel-addon h4 {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #06162f !important;
    text-align: right !important;
    margin: 0 0 18px !important;
}

#order-standard_cart .domain-addons p,
#order-standard_cart .domain-addon p,
#order-standard_cart .dns-management p,
#order-standard_cart .panel-addon p {
    text-align: center !important;
    color: #5f7188 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin: 18px auto 0 !important;
    max-width: 720px !important;
}

#order-standard_cart .domain-addons .price,
#order-standard_cart .domain-addon .price,
#order-standard_cart .dns-management .price,
#order-standard_cart .panel-addon .price {
    background: #f1f3f5 !important;
    color: #06162f !important;
    text-align: center !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 8px 12px !important;
    margin: 0 !important;
}

#order-standard_cart .domain-addons .btn,
#order-standard_cart .domain-addon .btn,
#order-standard_cart .dns-management .btn,
#order-standard_cart .panel-addon .btn {
    width: 100% !important;
    background: #55b957 !important;
    border: 0 !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

#order-standard_cart .domain-addons .btn:hover,
#order-standard_cart .domain-addon .btn:hover,
#order-standard_cart .dns-management .btn:hover,
#order-standard_cart .panel-addon .btn:hover {
    background: #39a83c !important;
}

#order-standard_cart .text-center .btn-primary,
#order-standard_cart .text-center button[type="submit"] {
    background: linear-gradient(90deg, #31b9eb, #2478ff) !important;
    border: 0 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    padding: 14px 30px !important;
    min-width: 140px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}

/* Tablet */
@media (max-width: 991px) {
    #order-standard_cart .sub-heading {
        font-size: 15px !important;
        gap: 12px !important;
    }

    #order-standard_cart .domain-addons .panel-body,
    #order-standard_cart .domain-addon .panel-body,
    #order-standard_cart .dns-management .panel-body,
    #order-standard_cart .panel-addon .panel-body {
        padding: 28px 24px 24px !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    #order-standard_cart .sub-heading {
        display: block !important;
        text-align: center !important;
        margin: 28px 0 18px !important;
        word-break: break-word !important;
    }

    #order-standard_cart .sub-heading:before,
    #order-standard_cart .sub-heading:after {
        display: none !important;
    }

    #order-standard_cart .domain-config .row {
        display: block !important;
    }

    #order-standard_cart .domain-config .col-sm-6,
    #order-standard_cart .domain-config .col-md-6,
    #order-standard_cart .domain-config .col-xs-6 {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 12px !important;
    }

    #order-standard_cart .domain-addons .panel-body,
    #order-standard_cart .domain-addon .panel-body,
    #order-standard_cart .dns-management .panel-body,
    #order-standard_cart .panel-addon .panel-body {
        padding: 24px 18px 22px !important;
        min-height: auto !important;
    }

    #order-standard_cart .domain-addons h4,
    #order-standard_cart .domain-addon h4,
    #order-standard_cart .dns-management h4,
    #order-standard_cart .panel-addon h4 {
        text-align: left !important;
        margin-top: 12px !important;
    }

    #order-standard_cart .domain-addons p,
    #order-standard_cart .domain-addon p,
    #order-standard_cart .dns-management p,
    #order-standard_cart .panel-addon p {
        text-align: left !important;
        max-width: 100% !important;
    }
}




.secondary-cart-body .product-info .product-title {
  font-size: 24px !important;
 color: #000 !important;
	font-weight: 600;

}

.secondary-cart-body .product-info  p  {
  font-size: 14px;
 line-height: 30px;
 color: #5e636e;
}

div#orderSummary {
    background: #fff;
    padding: 20px;
}

#order-standard_cart .order-summary {
    background-color: transparent !important;
    color: #000 !important;
    font-weight: 400 !important;
    font-size: 16px;
    line-height: 30px;
    box-shadow: none !important;
    border: none !important;
}


#order-standard_cart .order-summary .summary-totals {

 border-bottom:  none !important
}




#order-standard_cart .panel-addon .panel-add {
    background-color: #dff7ff !important;
    color: #000 !important;
}

#order-standard_cart .panel-addon-selected .panel-add {
    background-color: #17b9f7  !important;
    color: #fff  !important
}

#scrollingPanelContainer  #orderSummary {
  background: #fff !important;
  border-radius: 8px !important;
  padding: 20px 30px !important
}


#order-standard_cart .mc-promos ,
#order-standard_cart .mc-promos
{
    margin: 20px auto 30px !important;
    max-width: 100% !important; 
}


#order-standard_cart .view-cart-items-header {
   
    padding: 20px 40px !important;
    background-color: #35b7ea !important;
    color: #fff;
    
}

#order-standard_cart .view-cart-items .item {
    margin: 0  !important;
	padding: 15px 30px !important;

}

#order-standard_cart .view-cart-items .item:nth-child(even) {
    background-color: #f5f5f5 !important;
}

#order-standard_cart .empty-cart .btn {
    background-color: #22bcf4 !important;
}


#order-standard_cart .cart-sidebar h3, #order-standard_cart .sidebar-collapsed h3 {
    margin: 0 !important;
    font-size: 16px !important;
    color: #fff !important;
}

#order-standard_cart .cart-sidebar {
    margin-top: 80px;
}


#order-standard_cart .product-desc li {
list-style-type: none !important;
    font-size: 14px !important;
    line-height: 30px !important;
    margin-bottom: 10px;

}


/* =========================================================
   GiddyHost Login Page with Campaign Banner
   Scope: .giddy-login-campaign-page
========================================================= */

.login-main-body {
  margin: 0 !important;
 padding: 0 !important;
}

.giddy-login-campaign-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 8% 18%, rgba(37, 185, 232, 0.14), transparent 28%),
        radial-gradient(circle at 82% 12%, rgba(11, 116, 209, 0.10), transparent 26%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    font-family: inherit;
    overflow-x: hidden;
}

.giddy-login-campaign-page *,
.giddy-login-campaign-page *::before,
.giddy-login-campaign-page *::after {
    box-sizing: border-box;
}

.giddy-login-campaign-page .login_outer_box,
.giddy-login-campaign-page .container2 {
    width: 100%;
    max-height: 100vh;
}

.giddy-login-campaign-page .login-split-layout {
    width: 100%;
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(460px, 0.95fr) minmax(560px, 1.05fr);
}

/* =========================================================
   Left Form Side
========================================================= */

.giddy-login-campaign-page .login-panel-side {
    min-height: 100vh;
    padding: 48px 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.72);
    position: relative;
    z-index: 2;
}

.giddy-login-campaign-page .login-panel-inner {
    width: 100%;
    max-width: 620px;
}

.giddy-login-campaign-page .logo_con {
    text-align: center;
    margin-bottom: 24px;
}

.giddy-login-campaign-page .logo_con .logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.giddy-login-campaign-page .logo_con img {
    max-width: 170px;
    height: auto;
}

/* Main login card */
.giddy-login-campaign-page .login_container {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

.giddy-login-campaign-page .custom_login_form .card {
    border: 1px solid rgba(11, 116, 209, 0.10) !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 54px rgba(16, 48, 82, 0.10) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

.giddy-login-campaign-page .custom_login_form .card-body {
    padding: 42px 44px 32px !important;
    margin-bottom: 0 !important;
}

.giddy-login-campaign-page .login-heading {
    border-bottom: 1px solid #edf3f8;
    padding-bottom: 22px;
    margin-bottom: 30px !important;
}

.giddy-login-campaign-page .login-heading h6.h3 {
    color: #102a43 !important;
    font-size: 34px !important;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.4px;
    margin: 0 0 8px !important;
}

.giddy-login-campaign-page .login-heading h6.h3::after {
    content: "";
    display: block;
    width: 74px;
    height: 4px;
    margin-top: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%);
}

.giddy-login-campaign-page .login-heading .text-muted {
    color: #64788f !important;
    font-size: 16px;
    line-height: 1.65;
}

/* Labels */
.giddy-login-campaign-page .form-group {
    margin-bottom: 24px;
}

.giddy-login-campaign-page .form-group label,
.giddy-login-campaign-page .form-control-label {
    color: #102a43 !important;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 9px;
}

/* Input groups */
.giddy-login-campaign-page .input-group {
    border-radius: 14px;
    overflow: hidden;
    background: #e8f8ff;
    border: 1px solid #d7ecf8;
    transition: all 0.22s ease;
}

.giddy-login-campaign-page .input-group:focus-within {
    background: #ffffff;
    border-color: #25b9e8;
    box-shadow: 0 0 0 4px rgba(37, 185, 232, 0.14);
}

.giddy-login-campaign-page .input-group-text,
.giddy-login-campaign-page .btn.btn-default.btn-reveal-pw {
    width: 54px;
    min-height: 56px;
    background: #d8f3ff !important;
    color: #13b4f6 !important;
    border: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.giddy-login-campaign-page .form-control,
.giddy-login-campaign-page .form-control:focus,
.giddy-login-campaign-page .form-control:hover,
.giddy-login-campaign-page .form-control:focus-within {
    height: 56px !important;
    min-height: 56px !important;
    border: none !important;
    background: transparent !important;
    color: #102a43 !important;
    font-size: 15px;
    font-weight: 600;
    box-shadow: none !important;
    padding: 0 16px;
}

.giddy-login-campaign-page .form-control::placeholder {
    color: #8aa0b5;
    font-weight: 500;
}

.giddy-login-campaign-page .forgot-link {
    color: #64788f !important;
    font-size: 13px;
    font-weight: 700;
}

.giddy-login-campaign-page .forgot-link:hover {
    color: #0b74d1 !important;
}

/* Actions */
.giddy-login-campaign-page .login-actions-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 8px;
}

.giddy-login-campaign-page .login-submit-wrap {
    flex: 0 0 auto;
}

.giddy-login-campaign-page .login-remember-wrap {
    flex: 1 1 auto;
    text-align: right;
}

.giddy-login-campaign-page .remember-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #102a43 !important;
    font-size: 15px;
    font-weight: 700;
    margin: 0;
    cursor: pointer;
}

.giddy-login-campaign-page .remember-label .form-check-input {
    position: static;
    margin: 0;
    width: 16px;
    height: 16px;
}

/* Main button */
.giddy-login-campaign-page .btn-primary,
.giddy-login-campaign-page #login {
    min-width: 150px;
    min-height: 50px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 14px 34px !important;
    font-size: 15px !important;
    line-height: 1 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 800 !important;
    box-shadow: 0 12px 26px rgba(11, 116, 209, 0.24) !important;
    transition: all 0.22s ease !important;
}

.giddy-login-campaign-page .btn-primary:hover,
.giddy-login-campaign-page #login:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(11, 116, 209, 0.32) !important;
}

/* Footer register strip */
.giddy-login-campaign-page .custom_login_form .card-footer {
    padding: 18px 44px !important;
    background: #dcf4fd !important;
    border: none !important;
    color: #102a43;
    font-size: 14px;
}

.giddy-login-campaign-page .custom_login_form .card-footer small {
    color: #102a43;
    font-size: 14px;
}

.giddy-login-campaign-page .custom_login_form .card-footer a {
    color: #0b74d1 !important;
    font-weight: 900;
}

/* Linked accounts */
.giddy-login-campaign-page .linked-accounts-wrap {
    margin-top: 22px;
    text-align: center;
}

.giddy-login-campaign-page .linked-accounts-wrap .btn,
.giddy-login-campaign-page .linked-accounts-wrap button {
    border-radius: 999px !important;
}

/* Captcha */
.giddy-login-campaign-page .login-captcha-wrap {
    margin: 22px 0;
    padding: 18px;
    border-radius: 16px;
    background: #f7fbfe;
    border: 1px solid #e6eef6;
}

/* Alerts */
.giddy-login-campaign-page .alert {
    border: 0 !important;
    border-radius: 14px !important;
    padding: 15px 18px !important;
    font-size: 14px;
    font-weight: 600;
}

/* =========================================================
   Right Campaign Side
========================================================= */

.giddy-login-campaign-page .login-campaign-side {
    min-height: 100vh;
    position: relative;
    overflow: hidden;
    padding: 30px 50px;
    display: flex;
    align-items: center;
    background:
        radial-gradient(circle at 22% 18%, rgba(255, 255, 255, 0.24), transparent 25%),
        radial-gradient(circle at 84% 78%, rgba(11, 116, 209, 0.30), transparent 34%),
        linear-gradient(135deg, #25b9e8 0%, #0b74d1 52%, #0e2f50 100%);
}

.giddy-login-campaign-page .campaign-bg-shape {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.giddy-login-campaign-page .campaign-shape-one {
    width: 360px;
    height: 360px;
    right: -130px;
    top: -90px;
    background: rgba(255, 255, 255, 0.12);
}

.giddy-login-campaign-page .campaign-shape-two {
    width: 260px;
    height: 260px;
    left: -90px;
    bottom: 80px;
    background: rgba(255, 255, 255, 0.09);
}

.giddy-login-campaign-page .campaign-shape-three {
    width: 160px;
    height: 160px;
    right: 14%;
    bottom: 8%;
    background: rgba(37, 185, 232, 0.24);
}

.giddy-login-campaign-page .campaign-content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 660px;
    color: #ffffff;
}

.giddy-login-campaign-page .campaign-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #ffffff;
    font-size: 13px;
    font-weight: 900;
    margin-bottom: 22px;
}

.giddy-login-campaign-page .campaign-badge i {
    color: #fce76a;
}

.giddy-login-campaign-page .campaign-content h2 {
    color: #ffffff !important;
    font-size: 30px;
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -0.7px;
    margin: 0 0 18px;
}

.giddy-login-campaign-page .campaign-content h2 span {
    color: #d9f7ff;
}

.giddy-login-campaign-page .campaign-lead {
    max-width: 580px;
    color: rgba(255, 255, 255, 0.86) !important;
    font-size: 17px;
    line-height: 1.75;
    margin-bottom: 28px;
}

/* Campaign features */
.giddy-login-campaign-page .campaign-feature-list {
    display: grid;
    gap: 14px;
    margin-bottom: 28px;
}

.giddy-login-campaign-page .campaign-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.13);
    border: 1px solid rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(8px);
}

.giddy-login-campaign-page .campaign-feature-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.giddy-login-campaign-page .campaign-feature-item strong {
    display: block;
    color: #ffffff;
    font-size: 15px;
    font-weight: 900;
    margin-bottom: 3px;
}

.giddy-login-campaign-page .campaign-feature-item small {
    color: rgba(255, 255, 255, 0.74);
    font-size: 13px;
    line-height: 1.5;
}

/* Offer card */
.giddy-login-campaign-page .campaign-offer-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    max-width: 560px;
    padding: 18px 20px;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 24px 50px rgba(6, 22, 47, 0.20);
    margin-bottom: 34px;
}

.giddy-login-campaign-page .campaign-offer-card .offer-label {
    display: block;
    color: #64788f;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 2px;
}

.giddy-login-campaign-page .campaign-offer-card strong {
    display: block;
    color: #0b74d1;
    font-size: 16px;
    font-weight: 900;
    line-height: 1.2;
}

.giddy-login-campaign-page .campaign-cta {
    flex: 0 0 auto;
    min-width: 138px;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%);
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none !important;
    box-shadow: 0 12px 26px rgba(11, 116, 209, 0.24);
}

.giddy-login-campaign-page .campaign-cta:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%);
}

/* Visual dashboard */
.giddy-login-campaign-page .campaign-visual {
    position: relative;
    max-width: 540px;
    min-height: 250px;
    margin-top: -55px;
    transform: scale(.7);
}

.giddy-login-campaign-page .visual-main-card {
    width: 380px;
    max-width: 76%;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 24px 54px rgba(6, 22, 47, 0.24);
    overflow: hidden;
    transform: rotate(-2deg);
}

.giddy-login-campaign-page .visual-card-header {
    height: 46px;
    background: #f4fbff;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 18px;
    border-bottom: 1px solid #e6eef6;
}

.giddy-login-campaign-page .visual-card-header span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #25b9e8;
}

.giddy-login-campaign-page .visual-card-header span:nth-child(2) {
    background: #0b74d1;
}

.giddy-login-campaign-page .visual-card-header span:nth-child(3) {
    background: #fce76a;
}

.giddy-login-campaign-page .visual-card-body {
    padding: 24px;
}

.giddy-login-campaign-page .visual-stat {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}

.giddy-login-campaign-page .visual-stat i {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: #dcf4fd;
    color: #0b74d1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.giddy-login-campaign-page .visual-stat strong {
    display: block;
    color: #102a43;
    font-size: 20px;
    font-weight: 900;
}

.giddy-login-campaign-page .visual-stat small {
    color: #64788f;
    font-size: 13px;
    font-weight: 700;
}

.giddy-login-campaign-page .visual-progress {
    height: 12px;
    border-radius: 999px;
    background: #e9f3fa;
    overflow: hidden;
    margin-bottom: 12px;
}

.giddy-login-campaign-page .visual-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%);
}

.giddy-login-campaign-page .visual-progress.small {
    width: 72%;
}

/* Floating cards */
.giddy-login-campaign-page .floating-card {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 13px;
    border-radius: 999px;
    background: #ffffff;
    color: #102a43;
    font-size: 13px;
    font-weight: 900;
    box-shadow: 0 16px 32px rgba(6, 22, 47, 0.18);
}

.giddy-login-campaign-page .floating-card i {
    color: #0b74d1;
}

.giddy-login-campaign-page .floating-card-one {
    top: 18px;
    right: 34px;
}

.giddy-login-campaign-page .floating-card-two {
    right: 0;
    bottom: 72px;
}

.giddy-login-campaign-page .floating-card-three {
    left: 34px;
    bottom: 18px;
}

/* =========================================================
   Modal Fixes
========================================================= */

.giddy-login-campaign-page .modal .modal-header,
.modal .modal-header {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
}

.giddy-login-campaign-page .modal .btn-primary,
.modal .btn-primary {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .giddy-login-campaign-page .login-split-layout {
        grid-template-columns: minmax(420px, 0.95fr) minmax(480px, 1.05fr);
    }

    .giddy-login-campaign-page .login-panel-side {
        padding: 42px 36px;
    }

    .giddy-login-campaign-page .login-campaign-side {
        padding: 46px 42px;
    }

    .giddy-login-campaign-page .campaign-content h2 {
        font-size: 30px;
    }
}

@media (max-width: 991px) {
    .giddy-login-campaign-page .login-split-layout {
        display: block;
    }

    .giddy-login-campaign-page .login-panel-side {
        min-height: auto;
        padding: 42px 20px 32px;
    }

    .giddy-login-campaign-page .login-panel-inner {
        max-width: 620px;
        margin: 0 auto;
    }

    .giddy-login-campaign-page .login-campaign-side {
        min-height: auto;
        padding: 54px 20px;
    }

    .giddy-login-campaign-page .campaign-content {
        max-width: 720px;
        margin: 0 auto;
        text-align: center;
    }

    .giddy-login-campaign-page .campaign-lead,
    .giddy-login-campaign-page .campaign-offer-card,
    .giddy-login-campaign-page .campaign-visual {
        margin-left: auto;
        margin-right: auto;
    }

    .giddy-login-campaign-page .campaign-feature-item {
        text-align: left;
    }

    .giddy-login-campaign-page .visual-main-card {
        margin: 0 auto;
    }
}

@media (max-width: 767px) {
    .giddy-login-campaign-page .custom_login_form .card-body {
        padding: 34px 28px 28px !important;
    }

    .giddy-login-campaign-page .custom_login_form .card-footer {
        padding: 17px 28px !important;
    }

    .giddy-login-campaign-page .login-heading h6.h3 {
        font-size: 28px !important;
    }

    .giddy-login-campaign-page .campaign-content h2 {
        font-size: 32px;
    }

    .giddy-login-campaign-page .campaign-lead {
        font-size: 15px;
    }

    .giddy-login-campaign-page .campaign-offer-card {
        display: block;
        text-align: center;
    }

    .giddy-login-campaign-page .campaign-cta {
        margin-top: 14px;
        width: 100%;
    }

    .giddy-login-campaign-page .campaign-visual {
        min-height: 290px;
    }

    .giddy-login-campaign-page .visual-main-card {
        max-width: 88%;
    }

    .giddy-login-campaign-page .floating-card-one {
        right: 0;
    }

    .giddy-login-campaign-page .floating-card-two {
        right: 8px;
    }

    .giddy-login-campaign-page .floating-card-three {
        left: 8px;
    }
}

@media (max-width: 575px) {
    .giddy-login-campaign-page .login-panel-side {
        padding: 28px 14px 24px;
    }

    .giddy-login-campaign-page .logo_con img {
        max-width: 145px;
    }

    .giddy-login-campaign-page .custom_login_form .card {
        border-radius: 18px !important;
    }

    .giddy-login-campaign-page .custom_login_form .card-body {
        padding: 28px 22px 24px !important;
    }

    .giddy-login-campaign-page .custom_login_form .card-footer {
        padding: 16px 22px !important;
        text-align: center;
    }

    .giddy-login-campaign-page .login-heading {
        padding-bottom: 18px;
        margin-bottom: 24px !important;
    }

    .giddy-login-campaign-page .login-heading h6.h3 {
        font-size: 24px !important;
    }

    .giddy-login-campaign-page .login-heading .text-muted {
        font-size: 14px;
    }

    .giddy-login-campaign-page .input-group-text,
    .giddy-login-campaign-page .btn.btn-default.btn-reveal-pw {
        width: 48px;
        min-height: 52px;
    }

    .giddy-login-campaign-page .form-control,
    .giddy-login-campaign-page .form-control:focus,
    .giddy-login-campaign-page .form-control:hover,
    .giddy-login-campaign-page .form-control:focus-within {
        height: 52px !important;
        min-height: 52px !important;
    }

    .giddy-login-campaign-page .login-actions-row {
        display: block;
    }

    .giddy-login-campaign-page .login-submit-wrap,
    .giddy-login-campaign-page .login-remember-wrap {
        width: 100%;
        text-align: left;
    }

    .giddy-login-campaign-page #login,
    .giddy-login-campaign-page .btn-primary {
        width: 100%;
        margin-bottom: 18px;
    }

    .giddy-login-campaign-page .remember-label {
        justify-content: flex-start;
    }

    .giddy-login-campaign-page .login-campaign-side {
        padding: 42px 14px;
    }

    .giddy-login-campaign-page .campaign-content h2 {
        font-size: 27px;
    }

    .giddy-login-campaign-page .campaign-feature-item {
        padding: 14px;
    }

    .giddy-login-campaign-page .campaign-feature-icon {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
    }

    .giddy-login-campaign-page .campaign-visual {
        display: none;
    }
}



/* =========================================================
   GiddyHost Login Campaign Slider
   Add below existing login campaign CSS
========================================================= */

.giddy-login-campaign-page .giddy-campaign-slider {
    position: relative;
}

.giddy-login-campaign-page .campaign-slider-wrap {
    position: relative;
    width: 100%;
    min-height: 760px;
    z-index: 2;
}

.giddy-login-campaign-page .campaign-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(34px);
    transition:
        opacity 0.55s ease,
        transform 0.55s ease,
        visibility 0.55s ease;
    pointer-events: none;
}

.giddy-login-campaign-page .campaign-slide.is-active {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
}

.giddy-login-campaign-page .campaign-slide.is-leaving-left {
    transform: translateX(-34px);
}

.giddy-login-campaign-page .campaign-slide .campaign-content {
    animation: campaignFadeUp 0.65s ease both;
}

@keyframes campaignFadeUp {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Slider controls */
.giddy-login-campaign-page .campaign-slider-controls {
    position: absolute;
    left: 64px;
    right: 64px;
    bottom: 42px;
    z-index: 6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
}

.giddy-login-campaign-page .campaign-slider-arrow {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255,255,255,0.26);
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    pointer-events: auto;
    transition: all 0.22s ease;
    backdrop-filter: blur(8px);
}

.giddy-login-campaign-page .campaign-slider-arrow:hover {
    background: #ffffff;
    color: #0b74d1;
    transform: translateY(-1px);
}

.giddy-login-campaign-page .campaign-slider-dots {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    pointer-events: auto;
}

.giddy-login-campaign-page .campaign-slider-dots button {
    width: 9px;
    height: 9px;
    border: 0;
    border-radius: 999px;
    padding: 0;
    background: rgba(255,255,255,0.45);
    cursor: pointer;
    transition: all 0.22s ease;
}

.giddy-login-campaign-page .campaign-slider-dots button.is-active {
    width: 28px;
    background: #ffffff;
}

/* Extra visual styles for slide 2 */
.giddy-login-campaign-page .domain-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.giddy-login-campaign-page .domain-pill-row span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #dcf4fd;
    color: #0b74d1;
    font-size: 13px;
    font-weight: 900;
}

/* Slight color variations per slide */
.giddy-login-campaign-page .campaign-slide[data-slide="1"] .campaign-feature-icon,
.giddy-login-campaign-page .campaign-slide[data-slide="1"] .visual-stat i {
    background: rgba(255,255,255,0.18);
}

.giddy-login-campaign-page .campaign-slide[data-slide="2"] .campaign-feature-icon,
.giddy-login-campaign-page .campaign-slide[data-slide="2"] .visual-stat i {
    background: rgba(255,255,255,0.18);
}

/* Mobile slider fixes */
@media (max-width: 1199px) {
    .giddy-login-campaign-page .campaign-slider-wrap {
        min-height: 780px;
    }

    .giddy-login-campaign-page .campaign-slider-controls {
        left: 42px;
        right: 42px;
    }
}

@media (max-width: 991px) {
    .giddy-login-campaign-page .campaign-slider-wrap {
        min-height: 760px;
    }

    .giddy-login-campaign-page .campaign-slide {
        position: relative;
        display: none;
        inset: auto;
        transform: none;
    }

    .giddy-login-campaign-page .campaign-slide.is-active {
        display: block;
    }

    .giddy-login-campaign-page .campaign-slider-controls {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin: 34px auto 0;
        max-width: 240px;
    }
}

@media (max-width: 767px) {
    .giddy-login-campaign-page .campaign-slider-wrap {
        min-height: 700px;
    }

    .giddy-login-campaign-page .campaign-slider-arrow {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 575px) {
    .giddy-login-campaign-page .campaign-slider-wrap {
        min-height: auto;
    }

    .giddy-login-campaign-page .campaign-slider-controls {
        margin-top: 26px;
    }
}

.custom_register_inner {
    margin: 40px auto;
    background: rgba(255, 255, 255, .5);
    padding: 50px;
}


.custom_register_bx #registration  .card ,
.custom_register_bx #registration  .card-body
  {
  padding: 0 !important;
 border: none !important;
 background: none !important;

}

.custom_register_bx #registration  .card-body .card-title {
        background: #dcf4fd;
    color: #000;
    font-size: 18px;
    line-height: 24px;
    font-weight: 800;
    padding: 10px;
    margin: 0 0 30px 0;
}


.custom_register_inner  .logo_con  {

   text-align: center; 
   display: block;
}

.custom_register_inner  .logo_con .logo {
    text-align: center;
    display: inline-block;
}

#registration .field, #registration .form-control {
    height: 50px;
}
#registration .prepend-icon .field-icon {
height: 50px;
	    line-height: 50px;
}

#registration .field-icon i {
    color: #17b9f7;
}
#order-standard_cart #frmDomainTransfer .panel-heading  {
  padding: 15px  !important

}
#order-standard_cart #frmDomainTransfer  .font-size-24 {
  margin: 0 !important;
	color: #ffffff !important;
	 font-size: 18px !important;
  line-height: 18px !important;

}

#order-standard_cart #frmDomainTransfer .card-footer {
    background-color: rgb(223 247 255) !important;
}









/* =========================================================
   GiddyHost - WHMCS Announcements Page Modern Design
   Uses WHMCS default classes from announcements.tpl
   Scoped to announcement content only
========================================================= */

.announcements {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
}

.announcements .announcement {
    background: #ffffff !important;
    border: 1px solid rgba(13, 110, 253, 0.10) !important;
    border-radius: 18px !important;
    padding: 26px 28px !important;
    box-shadow: 0 12px 35px rgba(15, 35, 75, 0.08) !important;
    transition: all 0.25s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.announcements .announcement::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 5px !important;
    height: 100% !important;
    background: linear-gradient(180deg, #20b8ee 0%, #0867c8 100%) !important;
}

.announcements .announcement:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 18px 45px rgba(15, 35, 75, 0.13) !important;
    border-color: rgba(32, 184, 238, 0.35) !important;
}

.announcements .announcement h1 {
    margin: 0 0 12px 0 !important;
    font-size: 24px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #08224a !important;
}

.announcements .announcement h1 a {
    color: #08224a !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.announcements .announcement h1 a:hover {
    color: #0a8edb !important;
}

.announcements .announcement .show-on-hover {
    margin-left: 10px !important;
    vertical-align: middle !important;
    border-radius: 8px !important;
    background: #f3f8ff !important;
    border-color: #d9ebff !important;
    color: #0867c8 !important;
}

.announcements .announcement .list-inline {
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
}

.announcements .announcement .list-inline-item {
    font-size: 14px !important;
    color: #6b7c93 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.announcements .announcement .list-inline-item i {
    color: #18aeea !important;
}

.announcements .announcement article {
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #40546f !important;
    margin-bottom: 20px !important;
}

.announcements .announcement article p {
    margin-bottom: 14px !important;
}

.announcements .announcement article a {
    color: #087bd3 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.announcements .announcement article a:hover {
    color: #055ca2 !important;
    text-decoration: underline !important;
}

.announcements .announcement .btn.btn-default {
    background: linear-gradient(135deg, #18b8ee 0%, #0867c8 100%) !important;
    border: none !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    padding: 9px 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 18px rgba(8, 103, 200, 0.22) !important;
    transition: all 0.25s ease !important;
}

.announcements .announcement .btn.btn-default:hover,
.announcements .announcement .btn.btn-default:focus {
    background: linear-gradient(135deg, #0867c8 0%, #064b95 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(8, 103, 200, 0.28) !important;
}

.announcements .announcement .btn.btn-default i {
    margin-left: 6px !important;
}

/* Page card wrapper */
.card .card-body .card-title {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: #08224a !important;
    margin-bottom: 24px !important;
    position: relative !important;
    padding-bottom: 14px !important;
}

.card .card-body .card-title::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 64px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #18b8ee 0%, #0867c8 100%) !important;
}

/* Pagination */
.pagination {
    margin-top: 28px !important;
    justify-content: center !important;
    gap: 8px !important;
}

.pagination .page-item .page-link {
    border-radius: 10px !important;
    border: 1px solid #d9ebff !important;
    color: #0867c8 !important;
    font-weight: 600 !important;
    padding: 9px 14px !important;
    background: #ffffff !important;
    box-shadow: 0 4px 14px rgba(15, 35, 75, 0.06) !important;
}

.pagination .page-item.active .page-link {
    background: linear-gradient(135deg, #18b8ee 0%, #0867c8 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.pagination .page-item.disabled .page-link {
    color: #9aa9bd !important;
    background: #f3f7fb !important;
    box-shadow: none !important;
}

/* Responsive */
@media (max-width: 768px) {
    .announcements .announcement {
        padding: 22px 20px !important;
        border-radius: 15px !important;
    }

    .announcements .announcement h1 {
        font-size: 21px !important;
    }

    .announcements .announcement article {
        font-size: 14px !important;
    }

    .card .card-body .card-title {
        font-size: 24px !important;
    }

    .pagination {
        flex-wrap: wrap !important;
    }
}

@media (max-width: 480px) {
    .announcements .announcement {
        padding: 20px 18px !important;
    }

    .announcements .announcement h1 {
        font-size: 19px !important;
    }

    .announcements .announcement .btn.btn-default {
        width: 100% !important;
        text-align: center !important;
        justify-content: center !important;
    }
}






/* =========================================================
   GiddyHost - WHMCS Knowledgebase Modern Design
   Page: knowledgebase.tpl
   Uses existing WHMCS / Bootstrap classes only
========================================================= */


/* =========================================================
   Knowledgebase Search Area
========================================================= */

form[action*="knowledgebase"] {
    margin-bottom: 34px !important;
}

.kb-search {
    max-width: 860px !important;
    margin: 0 auto 36px auto !important;
    background: #ffffff !important;
    border: 1px solid rgba(16, 155, 219, 0.18) !important;
    border-radius: 18px !important;
    padding: 8px !important;
    box-shadow: 0 16px 45px rgba(6, 42, 92, 0.10) !important;
    overflow: hidden !important;
}

.kb-search .form-control {
    height: 58px !important;
    border: 0 !important;
    background: transparent !important;
    color: #102a43 !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    padding: 0 22px !important;
    box-shadow: none !important;
}

.kb-search .form-control::placeholder {
    color: #8a9ab0 !important;
    opacity: 1 !important;
}

.kb-search .form-control:focus {
    box-shadow: none !important;
    border: 0 !important;
}

.kb-search .input-group-append {
    margin-left: 0 !important;
}

.kb-search .btn-primary,
.kb-search #btnKnowledgebaseSearch {
    min-width: 128px !important;
    height: 58px !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, #1bb7ee 0%, #0867c8 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    box-shadow: 0 10px 22px rgba(8, 103, 200, 0.26) !important;
    transition: all 0.25s ease !important;
}

.kb-search .btn-primary:hover,
.kb-search #btnKnowledgebaseSearch:hover {
    background: linear-gradient(135deg, #0867c8 0%, #064c9c 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 28px rgba(8, 103, 200, 0.34) !important;
}

.kb-search .btn-primary:focus,
.kb-search #btnKnowledgebaseSearch:focus {
    box-shadow: 0 0 0 4px rgba(27, 183, 238, 0.18) !important;
}


/* =========================================================
   Knowledgebase Category Grid
========================================================= */

.kb-category {
    height: calc(100% - 1.5rem) !important;
    border: 1px solid rgba(11, 105, 200, 0.10) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 34px rgba(15, 35, 75, 0.075) !important;
    overflow: hidden !important;
    transition: all 0.25s ease !important;
    position: relative !important;
}

.kb-category::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: linear-gradient(90deg, #1bb7ee 0%, #0867c8 100%) !important;
    opacity: 0 !important;
    transition: opacity 0.25s ease !important;
}

.kb-category:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(27, 183, 238, 0.38) !important;
    box-shadow: 0 18px 48px rgba(15, 35, 75, 0.13) !important;
}

.kb-category:hover::before {
    opacity: 1 !important;
}

.kb-category .card-body {
    display: block !important;
    padding: 28px 28px 26px 28px !important;
    color: inherit !important;
    text-decoration: none !important;
    min-height: 142px !important;
    position: relative !important;
}

.kb-category .card-body:hover,
.kb-category .card-body:focus {
    text-decoration: none !important;
}

.kb-category .h5 {
    display: block !important;
    color: #0b2b59 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    padding-right: 120px !important;
    margin-bottom: 12px !important;
    letter-spacing: -0.2px !important;
}

.kb-category .h5 i {
    width: 46px !important;
    height: 46px !important;
    display: inline flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 12px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, rgba(27, 183, 238, 0.14), rgba(8, 103, 200, 0.10)) !important;
    color: #0867c8 !important;
    font-size: 21px !important;
    vertical-align: middle !important;
    transition: all 0.25s ease !important;
   margin-bottom: 15px;
}

.kb-category:hover .h5 i {
    background: linear-gradient(135deg, #1bb7ee 0%, #0867c8 100%) !important;
    color: #ffffff !important;
    transform: scale(1.04) !important;
}

.kb-category p {
    color: #5f7188 !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  
    margin-top: 10px !important;
}

.kb-category p small {
    font-size: 15px !important;
    line-height: 1.65 !important;
}

.kb-category .badge-info {
    position: absolute !important;
    top: 28px !important;
    right: 26px !important;
    float: none !important;
    background: rgba(27, 183, 238, 0.10) !important;
    color: #0877c8 !important;
    border: 1px solid rgba(27, 183, 238, 0.35) !important;
    border-radius: 999px !important;
    padding: 7px 12px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
}

.kb-category:hover .badge-info {
    background: #0867c8 !important;
    color: #ffffff !important;
    border-color: #0867c8 !important;
}


/* =========================================================
   Admin Edit Button Inside Category Cards
========================================================= */

.kb-category .show-on-card-hover,
.kb-article-item .show-on-card-hover {
    border-radius: 8px !important;
    background: #f2f8ff !important;
    border: 1px solid #d8eaff !important;
    color: #0867c8 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 5px 9px !important;
    margin-left: 8px !important;
}

.kb-category .show-on-card-hover:hover,
.kb-article-item .show-on-card-hover:hover {
    background: #0867c8 !important;
    color: #ffffff !important;
    border-color: #0867c8 !important;
}


/* =========================================================
   Popular Articles Card
========================================================= */

.card:has(.kb-article-item) {
    border: 1px solid rgba(11, 105, 200, 0.10) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 34px rgba(15, 35, 75, 0.075) !important;
    overflow: hidden !important;
    margin-top: 10px !important;
}

.card:has(.kb-article-item) .card-body {
    padding: 24px 28px !important;
    background: linear-gradient(135deg, #f7fcff 0%, #ffffff 100%) !important;
    border-bottom: 1px solid rgba(11, 105, 200, 0.08) !important;
}

.card:has(.kb-article-item) .card-title {
    color: #0b2b59 !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    letter-spacing: -0.2px !important;
}

.card:has(.kb-article-item) .card-title i {
    color: #12aee8 !important;
    margin-right: 8px !important;
}

.card:has(.kb-article-item) .list-group {
    border-radius: 0 !important;
}

.kb-article-item {
    display: block !important;
    padding: 22px 28px !important;
    border-color: rgba(11, 105, 200, 0.08) !important;
    color: #0b2b59 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transition: all 0.22s ease !important;
    position: relative !important;
}

.kb-article-item:hover {
    background: #f5fbff !important;
    color: #0867c8 !important;
    text-decoration: none !important;
    padding-left: 34px !important;
}

.kb-article-item i {
    color: #12aee8 !important;
    margin-right: 10px !important;
    font-size: 18px !important;
}

.kb-article-item small {
    display: block !important;
    color: #667b93 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    margin-top: 8px !important;
    padding-left: 31px !important;
}


/* =========================================================
   Row / Column Spacing
========================================================= */

.row .col-xl-6 {
    margin-bottom: 0 !important;
}

.row .col-xl-6 .kb-category.mb-4 {
    margin-bottom: 24px !important;
}


/* =========================================================
   Optional: Improve General KB Page Background Area
   Safe for WHMCS content area
========================================================= */

.main-content form[action*="knowledgebase"] + .row,
.contentarea form[action*="knowledgebase"] + .row,
.primary-content form[action*="knowledgebase"] + .row {
    margin-top: 6px !important;
}


/* =========================================================
   Optional Sidebar Styling
   This targets common WHMCS sidebar/card classes if your
   left category sidebar is loaded by the parent layout.
========================================================= */

.sidebar .card,
.sidebar .panel,
#sidebar .card,
#sidebar .panel {
    border: 1px solid rgba(11, 105, 200, 0.10) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 34px rgba(15, 35, 75, 0.075) !important;
    overflow: hidden !important;
}

.sidebar .card-header,
.sidebar .panel-heading,
#sidebar .card-header,
#sidebar .panel-heading {
    background: linear-gradient(135deg, #1bb7ee 0%, #0867c8 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    padding: 16px 20px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

.sidebar .list-group-item,
.sidebar .list-group a,
#sidebar .list-group-item,
#sidebar .list-group a {
    border-color: rgba(11, 105, 200, 0.07) !important;
    color: #28506f !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 13px 16px !important;
    transition: all 0.2s ease !important;
}

.sidebar .list-group-item:hover,
.sidebar .list-group a:hover,
#sidebar .list-group-item:hover,
#sidebar .list-group a:hover {
    background: #f3fbff !important;
    color: #0867c8 !important;
    text-decoration: none !important;
}

.sidebar .list-group-item.active,
.sidebar .list-group a.active,
#sidebar .list-group-item.active,
#sidebar .list-group a.active {
    background: rgba(27, 183, 238, 0.10) !important;
    color: #0867c8 !important;
    border-left: 4px solid #0867c8 !important;
}


/* =========================================================
   Responsive Design
========================================================= */

@media (max-width: 1199px) {
    .kb-category .h5 {
        font-size: 20px !important;
    }

    .kb-category .card-body {
        min-height: 136px !important;
    }
}

@media (max-width: 991px) {
    .kb-search {
        max-width: 100% !important;
        border-radius: 16px !important;
    }

    .kb-category .card-body {
        padding: 24px !important;
    }

    .kb-category .h5 {
        padding-right: 105px !important;
    }

    .kb-category .badge-info {
        top: 24px !important;
        right: 22px !important;
    }
}

@media (max-width: 767px) {
    .kb-search {
        padding: 7px !important;
        border-radius: 15px !important;
    }

    .kb-search .form-control {
        height: 54px !important;
        font-size: 15px !important;
        padding: 0 16px !important;
    }

    .kb-search .btn-primary,
    .kb-search #btnKnowledgebaseSearch {
        height: 54px !important;
        min-width: 105px !important;
        font-size: 14px !important;
        border-radius: 12px !important;
    }

    .kb-category {
        border-radius: 16px !important;
    }

    .kb-category .card-body {
        min-height: auto !important;
        padding: 22px !important;
    }

    .kb-category .h5 {
        font-size: 19px !important;
        padding-right: 0 !important;
        padding-top: 34px !important;
    }

    .kb-category .h5 i {
        width: 42px !important;
        height: 42px !important;
        font-size: 19px !important;
    }

    .kb-category .badge-info {
        top: 20px !important;
        right: 20px !important;
        font-size: 11px !important;
        padding: 7px 10px !important;
    }

    .kb-category p {
        padding-left: 54px !important;
        font-size: 14px !important;
    }

    .kb-category p small {
        font-size: 14px !important;
    }

    .card:has(.kb-article-item) .card-title {
        font-size: 21px !important;
    }

    .kb-article-item {
        padding: 20px 22px !important;
        font-size: 15px !important;
    }

    .kb-article-item:hover {
        padding-left: 26px !important;
    }

    .kb-article-item small {
        padding-left: 29px !important;
    }
}

@media (max-width: 575px) {
    .kb-search {
        display: block !important;
        padding: 10px !important;
    }

    .kb-search .form-control {
        width: 100% !important;
        margin-bottom: 10px !important;
        text-align: left !important;
    }

    .kb-search .input-group-append {
        width: 100% !important;
        display: block !important;
    }

    .kb-search .btn-primary,
    .kb-search #btnKnowledgebaseSearch {
        width: 100% !important;
        display: block !important;
    }

    .kb-category .card-body {
        padding: 20px !important;
    }

    .kb-category .h5 {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }

    .kb-category .h5 i {
        display: flex !important;
        margin-bottom: 12px !important;
    }

    .kb-category p {
        padding-left: 0 !important;
        margin-top: 14px !important;
    }

    .kb-category .badge-info {
        position: static !important;
        display: inline-block !important;
        margin-bottom: 12px !important;
        float: none !important;
    }

    .kb-article-item small {
        padding-left: 0 !important;
        margin-top: 10px !important;
    }
}


/* =========================================================
   GiddyHost - Site Builder Page Clean Modern CSS
   Replace previous Site Builder CSS with this
   Scope: .landing-page.sitebuilder
========================================================= */

.landing-page.sitebuilder {
    font-family: inherit !important;
    background: #ffffff !important;
    color: #182b45 !important;
    overflow: hidden !important;
}

/* Global */
.landing-page.sitebuilder *,
.landing-page.sitebuilder *::before,
.landing-page.sitebuilder *::after {
    box-sizing: border-box !important;
}

.landing-page.sitebuilder .container {
    max-width: 1140px !important;
}

.landing-page.sitebuilder h1,
.landing-page.sitebuilder h2,
.landing-page.sitebuilder h3,
.landing-page.sitebuilder h4,
.landing-page.sitebuilder h5,
.landing-page.sitebuilder h6 {
    font-family: inherit !important;
    color: #0d223a !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.sitebuilder h2 {
    font-size: 30px !important;
    line-height: 1.25 !important;
    margin-bottom: 16px !important;
}

.landing-page.sitebuilder p {
    color: #5b6f86 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.sitebuilder a {
    text-decoration: none !important;
}

/* Buttons */
.landing-page.sitebuilder .btn.btn-primary {
    background: linear-gradient(135deg, #22b8ee 0%, #0b74d1 100%) !important;
    border: 0 !important;
    border-radius: 50px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 10px 24px !important;
    box-shadow: 0 8px 18px rgba(11, 116, 209, 0.22) !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitebuilder .btn.btn-primary:hover,
.landing-page.sitebuilder .btn.btn-primary:focus {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(11, 116, 209, 0.28) !important;
}

.landing-page.sitebuilder .btn.btn-primary.large {
    padding: 11px 28px !important;
    font-size: 14px !important;
}

/* Accent line */
.landing-page.sitebuilder .bold-line {
    width: 78px !important;
    height: 4px !important;
    border-radius: 50px !important;
    background: linear-gradient(90deg, #22b8ee 0%, #0b74d1 100%) !important;
    margin-bottom: 18px !important;
}

.landing-page.sitebuilder .bold-line.slim {
    width: 52px !important;
    height: 3px !important;
    margin-bottom: 12px !important;
}

.landing-page.sitebuilder .vertical-spacer {
    height: 0 !important;
}

/* =========================================================
   Logo Area
========================================================= */

.landing-page.sitebuilder .logo-container {
    text-align: center !important;
    padding: 48px 0 34px !important;
    background: #ffffff !important;
}

.landing-page.sitebuilder .logo-container img {
    max-width: 340px !important;
    width: auto !important;
    height: auto !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.sitebuilder .hero {
    background: linear-gradient(135deg, #0e2f50 0%, #163f69 100%) !important;
    padding: 52px 0 !important;
    margin: 0 !important;
    position: relative !important;
}

.landing-page.sitebuilder .hero::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: -120px !important;
    width: 420px !important;
    height: 100% !important;
    background: rgba(34, 184, 238, 0.08) !important;
    transform: skewX(-18deg) !important;
}

.landing-page.sitebuilder .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -160px !important;
    bottom: -160px !important;
    width: 360px !important;
    height: 360px !important;
    border-radius: 50% !important;
    background: rgba(34, 184, 238, 0.10) !important;
}

.landing-page.sitebuilder .hero .container {
    text-align: center !important;
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.sitebuilder .hero img {
    max-width: 720px !important;
    width: 100% !important;
    height: auto !important;
    display: inline-block !important;
    border-radius: 12px !important;
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.22) !important;
    margin: 0 auto;
}

/* =========================================================
   Intro
========================================================= */

.landing-page.sitebuilder .intro {
    background: #f7fbfe !important;
    padding: 76px 0 !important;
    position: relative !important;
}

.landing-page.sitebuilder .intro::before {
    content: "" !important;
    position: absolute !important;
    left: -95px !important;
    top: 35px !important;
    width: 220px !important;
    height: 220px !important;
    border-radius: 50% !important;
    background: rgba(34, 184, 238, 0.09) !important;
}

.landing-page.sitebuilder .intro .row {
    align-items: center !important;
}

.landing-page.sitebuilder .intro h2 {
    font-size: 32px !important;
    max-width: 390px !important;
}

.landing-page.sitebuilder .intro p {
    max-width: 430px !important;
    margin-bottom: 14px !important;
}

.landing-page.sitebuilder .intro img {
    max-width: 540px !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 45px rgba(18, 49, 85, 0.10) !important;
}

.landing-page.sitebuilder .learn-more {
    color: #0b74d1 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

.landing-page.sitebuilder .learn-more:hover {
    color: #075aa4 !important;
}

/* =========================================================
   Tabs
========================================================= */

.landing-page.sitebuilder .nav-tabs {
    border: 0 !important;
    gap: 10px !important;
    margin-bottom: 28px !important;
}

.landing-page.sitebuilder .nav-tabs .nav-item {
    margin: 0 !important;
}

.landing-page.sitebuilder .nav-tabs .nav-link {
    border: 1px solid #e4edf5 !important;
    background: #ffffff !important;
    color: #405c78 !important;
    border-radius: 50px !important;
    padding: 9px 17px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.25px !important;
    box-shadow: none !important;
}

.landing-page.sitebuilder .nav-tabs .nav-link:hover,
.landing-page.sitebuilder .nav-tabs .nav-link.active {
    background: #0b74d1 !important;
    border-color: #0b74d1 !important;
    color: #ffffff !important;
}

/* =========================================================
   Features
========================================================= */

.landing-page.sitebuilder .features {
    padding: 78px 0 70px !important;
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.sitebuilder .features h2 {
    font-size: 30px !important;
    margin-bottom: 20px !important;
}

.landing-page.sitebuilder .features .tagline {
    max-width: 680px !important;
    margin: 0 auto 32px !important;
    font-size: 14px !important;
    color: #718397 !important;
}

.landing-page.sitebuilder .features .row {
    justify-content: center !important;
}

.landing-page.sitebuilder .features .row > div {
    margin-bottom: 22px !important;
}

.landing-page.sitebuilder .feature-block,
.landing-page.sitebuilder .social-block {
    background: #ffffff !important;
    border: 1px solid #e8f0f7 !important;
    border-radius: 16px !important;
    padding: 30px 24px 26px !important;
    min-height: 245px !important;
    height: 100% !important;
    text-align: center !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitebuilder .feature-block:hover,
.landing-page.sitebuilder .social-block:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(34, 184, 238, 0.45) !important;
    box-shadow: 0 18px 42px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.sitebuilder .feature-block img,
.landing-page.sitebuilder .social-block img {
    width: 54px !important;
    height: 54px !important;
    object-fit: contain !important;
    margin-bottom: 18px !important;
}

.landing-page.sitebuilder .feature-block .title,
.landing-page.sitebuilder .social-block .title {
    display: block !important;
    color: #102a43 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
}

.landing-page.sitebuilder .feature-block p,
.landing-page.sitebuilder .social-block p {
    font-size: 13px !important;
    line-height: 1.65 !important;
    color: #667a90 !important;
    margin: 0 !important;
}

/* =========================================================
   Templates
========================================================= */

.landing-page.sitebuilder .templates {
    padding: 82px 0 78px !important;
    text-align: center !important;
    background: #f7fbfe !important;
    position: relative !important;
}

.landing-page.sitebuilder > .container:has(.templates) {
    max-width: none !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: #f7fbfe !important;
}

.landing-page.sitebuilder > .container:has(.templates) .templates {
    max-width: 1140px !important;
    margin: 0 auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.landing-page.sitebuilder .templates h2 {
    font-size: 30px !important;
    margin-bottom: 18px !important;
}

.landing-page.sitebuilder .templates br {
    display: none !important;
}

.landing-page.sitebuilder .templates .previews {
    margin-top: 36px !important;
}

.landing-page.sitebuilder .templates .previews .row {
    justify-content: center !important;
}

.landing-page.sitebuilder .templates .previews .row > div {
    margin-bottom: 26px !important;
}

.landing-page.sitebuilder .templates .previews a {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid #e6eef6 !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    height: 100% !important;
    color: #102a43 !important;
    box-shadow: 0 12px 30px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitebuilder .templates .previews a:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(34, 184, 238, 0.40) !important;
    box-shadow: 0 18px 40px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.sitebuilder .templates .thumb-wrapper {
    position: relative !important;
    background: #edf5fb !important;
    overflow: hidden !important;
}

.landing-page.sitebuilder .templates .thumb-wrapper img {
    width: 100% !important;
    height: 165px !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.25s ease !important;
}

.landing-page.sitebuilder .templates .previews a:hover .thumb-wrapper img {
    transform: scale(1.035) !important;
}

.landing-page.sitebuilder .templates .type-label {
    position: absolute !important;
    top: 10px !important;
    right: -35px !important;
    min-width: 130px !important;
    padding: 6px 10px !important;
    background: #22b8ee !important;
    color: #ffffff !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    transform: rotate(35deg) !important;
}

.landing-page.sitebuilder .templates .tplname {
    display: block !important;
    padding: 14px 12px 16px !important;
    color: #102a43 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.landing-page.sitebuilder .templates .show-more a {
    min-height: 225px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px dashed #d6e4f1 !important;
    background: #ffffff !important;
}

.landing-page.sitebuilder .templates .show-more .icon-wrapper {
    width: 62px !important;
    height: 62px !important;
    border-radius: 50% !important;
    background: #eef8fe !important;
    color: #0b74d1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    margin-bottom: 8px !important;
}

.landing-page.sitebuilder .templates .tagline {
    max-width: 760px !important;
    margin: 22px auto 0 !important;
    color: #718397 !important;
    font-size: 14px !important;
}

/* =========================================================
   Pricing - fixed clean layout
========================================================= */

.landing-page.sitebuilder .pricing {
    background: linear-gradient(135deg, #0e2f50 0%, #163f69 100%) !important;
    padding: 78px 0 86px !important;
    color: #ffffff !important;
    position: relative !important;
    overflow: visible !important;
}

.landing-page.sitebuilder .pricing h2 {
    color: #ffffff !important;
    font-size: 30px !important;
    text-align: center !important;
    margin-bottom: 10px !important;
}

.landing-page.sitebuilder .pricing p {
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 14px !important;
    margin-bottom: 0 !important;
}

.landing-page.sitebuilder .pricing br {
    display: none !important;
}

.landing-page.sitebuilder .pricing .text-center {
    margin-top: 18px !important;
}

.landing-page.sitebuilder .pricing .pricing-table {
    width: 100% !important;
    max-width: 960px !important;
    margin: 42px auto 0 !important;
    background: #ffffff !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row {
    display: flex !important;
    align-items: stretch !important;
    border-bottom: 1px solid #eaf0f5 !important;
    min-height: 36px !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row:last-child {
    border-bottom: 0 !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row > div {
    padding: 10px 9px !important;
    min-height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    border-right: 1px solid #eaf0f5 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    color: #4f6479 !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row > div:last-child {
    border-right: 0 !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-primary {
    flex: 0 0 30% !important;
    max-width: 30% !important;
    justify-content: flex-start !important;
    text-align: left !important;
    color: #20364d !important;
    font-weight: 700 !important;
    background: #f8fbfe !important;
    padding-left: 16px !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-plans-1 {
    flex: 0 0 70% !important;
    max-width: 70% !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-plans-2 {
    flex: 0 0 35% !important;
    max-width: 35% !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-plans-3 {
    flex: 0 0 23.333% !important;
    max-width: 23.333% !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-plans-4 {
    flex: 0 0 17.5% !important;
    max-width: 17.5% !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row .col-plans-5 {
    flex: 0 0 14% !important;
    max-width: 14% !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row.col-heading > div {
    background: #f3f9fd !important;
    color: #102a43 !important;
    font-weight: 800 !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row.col-heading:first-child > div {
    background: #ffffff !important;
    color: #102a43 !important;
    font-size: 12px !important;
}

.landing-page.sitebuilder .pricing .pricing-table-row.col-heading:nth-last-child(2) > div {
    color: #0b74d1 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.landing-page.sitebuilder .pricing .pricing-table i.fa-check {
    color: #00a884 !important;
    font-size: 13px !important;
}

.landing-page.sitebuilder .pricing .pricing-table i.fa-times {
    color: #e55353 !important;
    font-size: 13px !important;
}

.landing-page.sitebuilder .pricing .pricing-table form {
    margin: 0 !important;
}

.landing-page.sitebuilder .pricing .pricing-table .btn.btn-primary {
    padding: 7px 14px !important;
    font-size: 12px !important;
    min-width: 58px !important;
    box-shadow: none !important;
}

/* =========================================================
   FAQ / Compare - no overlap
========================================================= */

.landing-page.sitebuilder .faq {
    background: #f7fbfe !important;
    padding: 84px 0 78px !important;
    position: relative !important;
    margin-top: 0 !important;
    clear: both !important;
    z-index: 1 !important;
}

.landing-page.sitebuilder .faq h2 {
    font-size: 30px !important;
    text-align: center !important;
    max-width: 620px !important;
    margin: 0 auto 26px !important;
    color: #102a43 !important;
}

.landing-page.sitebuilder .faq br {
    display: none !important;
}

.landing-page.sitebuilder .faq .row {
    margin-top: 0 !important;
    justify-content: center !important;
}

.landing-page.sitebuilder .faq .row > div {
    margin-bottom: 22px !important;
}

.landing-page.sitebuilder .faq-block {
    background: #ffffff !important;
    border: 1px solid #e6eef6 !important;
    border-radius: 14px !important;
    padding: 24px 24px 22px !important;
    height: 100% !important;
    box-shadow: 0 12px 30px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitebuilder .faq-block:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(34, 184, 238, 0.35) !important;
    box-shadow: 0 16px 36px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.sitebuilder .faq-title {
    display: block !important;
    color: #102a43 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    margin-bottom: 9px !important;
}

.landing-page.sitebuilder .faq-block p {
    margin: 0 !important;
    color: #64788f !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.sitebuilder .container {
        max-width: 960px !important;
    }

    .landing-page.sitebuilder .hero img {
        max-width: 680px !important;
    }

    .landing-page.sitebuilder .templates .thumb-wrapper img {
        height: 150px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.sitebuilder .container {
        max-width: 720px !important;
    }

    .landing-page.sitebuilder .logo-container {
        padding: 38px 0 28px !important;
    }

    .landing-page.sitebuilder .logo-container img {
        max-width: 300px !important;
    }

    .landing-page.sitebuilder .hero {
        padding: 42px 0 !important;
    }

    .landing-page.sitebuilder .intro,
    .landing-page.sitebuilder .features,
    .landing-page.sitebuilder .templates,
    .landing-page.sitebuilder .pricing,
    .landing-page.sitebuilder .faq {
        padding-top: 64px !important;
        padding-bottom: 64px !important;
    }

    .landing-page.sitebuilder .intro {
        text-align: center !important;
    }

    .landing-page.sitebuilder .intro h2,
    .landing-page.sitebuilder .intro p {
        max-width: 100% !important;
    }

    .landing-page.sitebuilder .intro .bold-line {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.sitebuilder .pricing .pricing-table {
        max-width: 100% !important;
        overflow-x: auto !important;
    }

    .landing-page.sitebuilder .pricing .pricing-table-row {
        min-width: 840px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.sitebuilder h2,
    .landing-page.sitebuilder .intro h2,
    .landing-page.sitebuilder .features h2,
    .landing-page.sitebuilder .templates h2,
    .landing-page.sitebuilder .pricing h2,
    .landing-page.sitebuilder .faq h2 {
        font-size: 25px !important;
    }

    .landing-page.sitebuilder .logo-container img {
        max-width: 260px !important;
    }

    .landing-page.sitebuilder .hero img {
        border-radius: 10px !important;
    }

    .landing-page.sitebuilder .nav-tabs {
        gap: 8px !important;
    }

    .landing-page.sitebuilder .nav-tabs .nav-link {
        font-size: 11px !important;
        padding: 8px 12px !important;
    }

    .landing-page.sitebuilder .feature-block,
    .landing-page.sitebuilder .social-block {
        min-height: auto !important;
        padding: 26px 20px !important;
    }

    .landing-page.sitebuilder .templates .thumb-wrapper img {
        height: 190px !important;
    }

    .landing-page.sitebuilder .faq-title {
        font-size: 17px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.sitebuilder .logo-container {
        padding: 30px 0 22px !important;
    }

    .landing-page.sitebuilder .logo-container img {
        max-width: 230px !important;
    }

    .landing-page.sitebuilder .hero {
        padding: 32px 0 !important;
    }

    .landing-page.sitebuilder .intro,
    .landing-page.sitebuilder .features,
    .landing-page.sitebuilder .templates,
    .landing-page.sitebuilder .pricing,
    .landing-page.sitebuilder .faq {
        padding-top: 52px !important;
        padding-bottom: 52px !important;
    }

    .landing-page.sitebuilder p {
        font-size: 14px !important;
    }

    .landing-page.sitebuilder .templates .thumb-wrapper img {
        height: 170px !important;
    }

    .landing-page.sitebuilder .btn.btn-primary.large {
        width: 100% !important;
        max-width: 290px !important;
    }
}


.landing-page.sitebuilder .logo-container {
  display: none !important;
}





/* =========================================================
   GiddyHost - WHMCS Weebly Website Builder Page Redesign
   Page scope: .landing-page.weebly
   Add AFTER store.css
========================================================= */

.landing-page.weebly {
    font-family: inherit !important;
    background: #ffffff !important;
    color: #102a43 !important;
    overflow: hidden !important;
}

.landing-page.weebly *,
.landing-page.weebly *::before,
.landing-page.weebly *::after {
    box-sizing: border-box !important;
}

.landing-page.weebly .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.weebly h1,
.landing-page.weebly h2,
.landing-page.weebly h3,
.landing-page.weebly h4,
.landing-page.weebly h5,
.landing-page.weebly h6 {
    font-family: inherit !important;
    color: #0b253f !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.weebly p {
    color: #5d7086 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* =========================================================
   Buttons
========================================================= */

.landing-page.weebly .btn-primary,
.landing-page.weebly .btn-signup,
.landing-page.weebly .btn.btn-primary {
    background: linear-gradient(135deg, #22b8ee 0%, #0b74d1 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 24px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.22) !important;
    transition: all 0.22s ease !important;
}

.landing-page.weebly .btn-primary:hover,
.landing-page.weebly .btn-signup:hover,
.landing-page.weebly .btn.btn-primary:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.30) !important;
}

.landing-page.weebly .btn-default {
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    background: #ffffff !important;
    color: #31526f !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    transition: all 0.22s ease !important;
}

.landing-page.weebly .btn-default:hover,
.landing-page.weebly .btn-default.active {
    background: #0b74d1 !important;
    border-color: #0b74d1 !important;
    color: #ffffff !important;
}

/* =========================================================
   Hero Section
========================================================= */

.landing-page.weebly .hero {
    background:
        radial-gradient(circle at 18% 20%, rgba(34, 184, 238, 0.14), transparent 28%),
        radial-gradient(circle at 84% 30%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f5fcff 100%) !important;
    padding: 120px 0 130px !important;
    text-align: center !important;
    position: relative !important;
}

.landing-page.weebly .hero::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: -38px !important;
    width: 72px !important;
    height: 72px !important;
    transform: translateX(-50%) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(16, 48, 82, 0.08) !important;
    opacity: 0.9 !important;
}

.landing-page.weebly .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 28px !important;
    flex-wrap: wrap !important;
}

.landing-page.weebly .hero .logo-container {
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.weebly .hero .logo-container img {
    max-width: 230px !important;
    width: 100% !important;
    height: auto !important;
}

.landing-page.weebly .hero h2 {
    max-width: 430px !important;
    margin: 0 !important;
    font-size: 42px !important;
    line-height: 1.12 !important;
    text-align: left !important;
    color: #1b334d !important;
}

.landing-page.weebly .hero h3 {
    max-width: 270px !important;
    margin: 0 !important;
    font-size: 21px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    color: #4f6479 !important;
    text-align: left !important;
}

/* =========================================================
   Sticky/Anchor Navigation
========================================================= */

.landing-page.weebly .navbar.navbar-light {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.weebly .navbar .container {
    justify-content: center !important;
}

.landing-page.weebly #nav-landing-page {
    justify-content: center !important;
}

.landing-page.weebly .navbar-nav {
    width: 100% !important;
    justify-content: center !important;
}

.landing-page.weebly .navbar-nav .nav-item {
    min-width: 170px !important;
    text-align: center !important;
    border-left: 1px solid #edf3f8 !important;
}

.landing-page.weebly .navbar-nav .nav-item:last-child {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.weebly .navbar-nav .nav-link {
    color: #5f7286 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 17px 22px !important;
    transition: all 0.22s ease !important;
}

.landing-page.weebly .navbar-nav .nav-link:hover {
    color: #0b74d1 !important;
    background: #f4fbff !important;
}

/* =========================================================
   Overview Section
========================================================= */

.landing-page.weebly .content-block {
    padding: 84px 0 !important;
}

.landing-page.weebly .image-standout {
    background: #ffffff !important;
}

.landing-page.weebly .image-standout .lead {
    max-width: 850px !important;
    margin: 0 auto !important;
    color: #40566e !important;
    font-size: 18px !important;
    line-height: 1.75 !important;
    font-weight: 500 !important;
}

.landing-page.weebly .image-standout br {
    display: none !important;
}

.landing-page.weebly .image-standout .row {
    align-items: center !important;
    margin-top: 55px !important;
}

.landing-page.weebly .image-standout img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 42px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.weebly .image-standout h3 {
    font-size: 30px !important;
    margin-bottom: 14px !important;
}

.landing-page.weebly .image-standout h3::before {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #22b8ee 0%, #0b74d1 100%) !important;
    margin-bottom: 18px !important;
}

/* =========================================================
   Features Section
========================================================= */

.landing-page.weebly .features {
    background: #f7fbfe !important;
    padding: 86px 0 68px !important;
}

.landing-page.weebly .features .row {
    justify-content: center !important;
}

.landing-page.weebly .features .row > div {
    margin-bottom: 28px !important;
}

.landing-page.weebly .feature {
    height: 100% !important;
    min-height: 230px !important;
    background: #ffffff !important;
    border: 1px solid #e6eef6 !important;
    border-radius: 18px !important;
    padding: 30px 22px 26px !important;
    text-align: center !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.weebly .feature:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(34, 184, 238, 0.42) !important;
    box-shadow: 0 20px 45px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.weebly .feature .icon {
    width: 70px !important;
    height: 70px !important;
    margin: 0 auto 18px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, rgba(34, 184, 238, 0.10), rgba(11, 116, 209, 0.08)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.weebly .feature .icon img {
    max-width: 42px !important;
    max-height: 42px !important;
    opacity: 0.92 !important;
}

.landing-page.weebly .feature h4 {
    font-size: 18px !important;
    line-height: 1.35 !important;
    margin-bottom: 9px !important;
}

.landing-page.weebly .feature p {
    font-size: 13px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
    color: #697d92 !important;
}

/* =========================================================
   Pricing Section
========================================================= */

.landing-page.weebly .pricing.content-block {
    background: #ffffff !important;
    padding: 88px 0 86px !important;
}

.landing-page.weebly .pricing .btn-group {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.landing-page.weebly .pricing .btn-group .btn {
    margin: 0 !important;
    border-radius: 999px !important;
    padding: 8px 15px !important;
    font-size: 12px !important;
}

.landing-page.weebly .currency-selector {
    height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid #d9e8f4 !important;
    color: #36536f !important;
    font-size: 13px !important;
    box-shadow: none !important;
}

/* Lite plan banner */
.landing-page.weebly .weebly-lite-plan {
    background:
        linear-gradient(135deg, rgba(34, 184, 238, 0.13), rgba(11, 116, 209, 0.10)),
        #f3fbff !important;
    border: 1px solid rgba(34, 184, 238, 0.22) !important;
    border-radius: 18px !important;
    padding: 28px 32px !important;
    margin: 8px 0 30px !important;
    box-shadow: 0 16px 36px rgba(16, 48, 82, 0.07) !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.weebly .weebly-lite-plan::before {
    content: "" !important;
    position: absolute !important;
    top: -80px !important;
    right: -80px !important;
    width: 180px !important;
    height: 180px !important;
    border-radius: 50% !important;
    background: rgba(34, 184, 238, 0.16) !important;
}

.landing-page.weebly .weebly-lite-plan .pricing {
    background: transparent !important;
    padding: 0 !important;
    color: #0b74d1 !important;
}

.landing-page.weebly .weebly-lite-plan .pricing h4 {
    color: #0b74d1 !important;
    font-size: 20px !important;
    margin: 0 !important;
}

.landing-page.weebly .weebly-lite-plan h4 {
    font-size: 24px !important;
    margin-bottom: 6px !important;
}

.landing-page.weebly .weebly-lite-plan h5 {
    color: #40566e !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

.landing-page.weebly .weebly-lite-plan p {
    max-width: 780px !important;
    margin-bottom: 16px !important;
    font-size: 14px !important;
}

/* Plan cards */
.landing-page.weebly .weebly-plans {
    align-items: stretch !important;
}

.landing-page.weebly .weebly-plans > div {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 26px !important;
}

.landing-page.weebly .pricing-item {
    flex: 1 1 auto !important;
    background: #ffffff !important;
    border: 1px solid #e4edf5 !important;
    border-radius: 18px 18px 0 0 !important;
    overflow: hidden !important;
    box-shadow: 0 16px 38px rgba(16, 48, 82, 0.07) !important;
    transition: all 0.22s ease !important;
}

.landing-page.weebly .weebly-plans > div:hover .pricing-item {
    transform: translateY(-4px) !important;
    border-color: rgba(34, 184, 238, 0.42) !important;
    box-shadow: 0 22px 46px rgba(16, 48, 82, 0.12) !important;
}

.landing-page.weebly .pricing-item .header {
    padding: 28px 22px 18px !important;
    text-align: center !important;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%) !important;
    border-bottom: 1px solid #edf3f8 !important;
}

.landing-page.weebly .pricing-item .header h4 {
    font-size: 23px !important;
    margin-bottom: 7px !important;
}

.landing-page.weebly .pricing-item .header h5 {
    color: #60758a !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    min-height: 40px !important;
}

.landing-page.weebly .pricing-item .price {
    padding: 22px 20px !important;
    text-align: center !important;
    color: #0b74d1 !important;
    font-size: 30px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.landing-page.weebly .pricing-item .price .pricing-text {
    color: #0b74d1 !important;
    font-weight: 900 !important;
}

.landing-page.weebly .pricing-item .feature-heading {
    background: #f4f8fb !important;
    color: #102a43 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: 0.35px !important;
    padding: 11px 10px !important;
    border-top: 1px solid #edf3f8 !important;
    border-bottom: 1px solid #edf3f8 !important;
}

.landing-page.weebly .pricing-item ul {
    margin: 0 !important;
    padding: 14px 20px !important;
    list-style: none !important;
}

.landing-page.weebly .pricing-item ul li {
    color: #4e6479 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    padding: 7px 0 !important;
    border-bottom: 1px solid #edf3f8 !important;
    text-align: center !important;
}

.landing-page.weebly .pricing-item ul li:last-child {
    border-bottom: 0 !important;
}

.landing-page.weebly .weebly-plans form {
    margin: 0 !important;
}

.landing-page.weebly .weebly-plans .btn-signup {
    border-radius: 0 0 18px 18px !important;
    width: 100% !important;
    padding: 13px 18px !important;
    box-shadow: none !important;
}

/* =========================================================
   FAQ Section
========================================================= */

.landing-page.weebly .faq {
    background: linear-gradient(180deg, #eaf2f8 0%, #dfeaf2 100%) !important;
    padding: 86px 0 !important;
}

.landing-page.weebly .faq h3 {
    font-size: 34px !important;
    margin-bottom: 45px !important;
    color: #102a43 !important;
}

.landing-page.weebly .faq .row > div {
    margin-bottom: 12px !important;
}

.landing-page.weebly .faq h4 {
    font-size: 18px !important;
    line-height: 1.35 !important;
    margin-bottom: 9px !important;
    color: #102a43 !important;
}

.landing-page.weebly .faq p {
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: #596f84 !important;
    margin-bottom: 18px !important;
}

.landing-page.weebly .faq hr {
    border-top: 1px solid rgba(80, 108, 133, 0.18) !important;
    margin: 20px 0 !important;
}

/* =========================================================
   Trusted By Section
========================================================= */

.landing-page.weebly .trusted-by {
    background: #ffffff !important;
    padding: 42px 0 !important;
    border-bottom: 1px solid #edf3f8 !important;
}

.landing-page.weebly .trusted-by .row {
    align-items: center !important;
}

.landing-page.weebly .trusted-by img {
    max-width: 130px !important;
    opacity: 0.25 !important;
    filter: grayscale(1) !important;
}

.landing-page.weebly .trusted-by .text-right {
    color: #a5b2be !important;
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* =========================================================
   Hide / Show WHMCS Pricing Text States
========================================================= */

.landing-page.weebly .w-hidden {
    display: none !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.weebly .container {
        max-width: 960px !important;
    }

    .landing-page.weebly .hero h2 {
        font-size: 38px !important;
    }

    .landing-page.weebly .navbar-nav .nav-item {
        min-width: 150px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.weebly .container {
        max-width: 720px !important;
    }

    .landing-page.weebly .hero {
        padding: 90px 0 100px !important;
    }

    .landing-page.weebly .hero .container {
        flex-direction: column !important;
        gap: 18px !important;
    }

    .landing-page.weebly .hero h2,
    .landing-page.weebly .hero h3 {
        text-align: center !important;
        max-width: 100% !important;
    }

    .landing-page.weebly .hero h2 {
        font-size: 34px !important;
    }

    .landing-page.weebly .hero h3 {
        font-size: 19px !important;
    }

    .landing-page.weebly .navbar-nav .nav-item {
        min-width: auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .landing-page.weebly .content-block,
    .landing-page.weebly .pricing.content-block,
    .landing-page.weebly .features,
    .landing-page.weebly .faq {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.weebly .image-standout {
        text-align: center !important;
    }

    .landing-page.weebly .image-standout h3::before {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.weebly .image-standout .row {
        margin-top: 42px !important;
    }

    .landing-page.weebly .image-standout .col-sm-7 br {
        display: none !important;
    }

    .landing-page.weebly .weebly-lite-plan .pricing {
        float: none !important;
        text-align: left !important;
        margin-bottom: 10px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.weebly .hero {
        padding: 72px 0 82px !important;
    }

    .landing-page.weebly .hero .logo-container img {
        max-width: 190px !important;
    }

    .landing-page.weebly .hero h2 {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }

    .landing-page.weebly .hero h3 {
        font-size: 17px !important;
    }

    .landing-page.weebly .navbar-toggler {
        margin: 10px auto !important;
        border-radius: 10px !important;
        border-color: #d7e7f4 !important;
    }

    .landing-page.weebly .navbar-nav {
        padding: 10px 0 !important;
    }

    .landing-page.weebly .navbar-nav .nav-link {
        padding: 12px 18px !important;
    }

    .landing-page.weebly .image-standout .lead {
        font-size: 16px !important;
    }

    .landing-page.weebly .image-standout h3,
    .landing-page.weebly .faq h3 {
        font-size: 27px !important;
    }

    .landing-page.weebly .feature {
        min-height: auto !important;
    }

    .landing-page.weebly .pricing .row:first-child {
        gap: 16px !important;
    }

    .landing-page.weebly .pricing .btn-group {
        justify-content: center !important;
    }

    .landing-page.weebly .currency-selector {
        margin-bottom: 18px !important;
    }

    .landing-page.weebly .weebly-lite-plan {
        text-align: center !important;
        padding: 26px 22px !important;
    }

    .landing-page.weebly .weebly-lite-plan .pricing {
        text-align: center !important;
    }

    .landing-page.weebly .trusted-by,
    .landing-page.weebly .trusted-by .text-right {
        text-align: center !important;
    }

    .landing-page.weebly .trusted-by img {
        margin-bottom: 18px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.weebly .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.weebly .hero {
        padding: 60px 0 70px !important;
    }

    .landing-page.weebly .hero h2 {
        font-size: 25px !important;
    }

    .landing-page.weebly .hero h3 {
        font-size: 16px !important;
    }

    .landing-page.weebly .content-block,
    .landing-page.weebly .pricing.content-block,
    .landing-page.weebly .features,
    .landing-page.weebly .faq {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.weebly p {
        font-size: 14px !important;
    }

    .landing-page.weebly .image-standout h3,
    .landing-page.weebly .faq h3 {
        font-size: 24px !important;
    }

    .landing-page.weebly .pricing-item .price {
        font-size: 26px !important;
    }

    .landing-page.weebly .pricing .btn-group {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    .landing-page.weebly .pricing .btn-group .btn {
        width: 100% !important;
    }
}




/* =========================================================
   GiddyHost - WHMCS SiteLock Page Redesign
   Page scope: .landing-page.sitelock
   Add AFTER store.css
========================================================= */

.landing-page.sitelock {
    font-family: inherit !important;
    background: #ffffff !important;
    color: #102a43 !important;
    overflow: hidden !important;
}

.landing-page.sitelock *,
.landing-page.sitelock *::before,
.landing-page.sitelock *::after {
    box-sizing: border-box !important;
}

.landing-page.sitelock .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.sitelock h1,
.landing-page.sitelock h2,
.landing-page.sitelock h3,
.landing-page.sitelock h4,
.landing-page.sitelock h5,
.landing-page.sitelock h6 {
    font-family: inherit !important;
    color: #0b253f !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.sitelock p {
    color: #5d7086 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.sitelock a {
    text-decoration: none !important;
}

/* =========================================================
   Buttons / Inputs
========================================================= */

.landing-page.sitelock .btn,
.landing-page.sitelock button {
    transition: all 0.22s ease !important;
}

.landing-page.sitelock .btn,
.landing-page.sitelock .plan .footer .btn,
.landing-page.sitelock .emergency .btn {
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #22b8ee 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 10px 22px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.22) !important;
}

.landing-page.sitelock .btn:hover,
.landing-page.sitelock .plan .footer .btn:hover,
.landing-page.sitelock .emergency .btn:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.30) !important;
}

.landing-page.sitelock .form-control {
    border-radius: 999px !important;
    border: 1px solid #d8e8f4 !important;
    background-color: #ffffff !important;
    color: #31526f !important;
    font-size: 13px !important;
    min-height: 40px !important;
    box-shadow: none !important;
}

.landing-page.sitelock .form-control:focus {
    border-color: #22b8ee !important;
    box-shadow: 0 0 0 3px rgba(34, 184, 238, 0.16) !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.sitelock .hero {
    background:
        radial-gradient(circle at 16% 22%, rgba(34, 184, 238, 0.16), transparent 28%),
        radial-gradient(circle at 86% 26%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #ecfbff 0%, #f5fcff 100%) !important;
    padding: 118px 0 124px !important;
    text-align: center !important;
    position: relative !important;
}

.landing-page.sitelock .hero::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: -38px !important;
    width: 72px !important;
    height: 72px !important;
    transform: translateX(-50%) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.sitelock .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 34px !important;
    flex-wrap: wrap !important;
}

.landing-page.sitelock .hero .logo-container {
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.sitelock .hero .logo-container img {
    max-width: 205px !important;
    width: 100% !important;
    height: auto !important;
}

.landing-page.sitelock .hero h2 {
    max-width: 610px !important;
    margin: 0 !important;
    font-size: 39px !important;
    line-height: 1.16 !important;
    text-align: left !important;
    font-weight: 700 !important;
    color: #1b334d !important;
}

/* =========================================================
   Anchor Navigation
========================================================= */

.landing-page.sitelock .navbar.navbar-light {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.sitelock .navbar .container {
    justify-content: center !important;
}

.landing-page.sitelock #nav-landing-page {
    justify-content: center !important;
}

.landing-page.sitelock .navbar-nav {
    width: 100% !important;
    justify-content: center !important;
}

.landing-page.sitelock .navbar-nav .nav-item {
    min-width: 180px !important;
    text-align: center !important;
    border-left: 1px solid #edf3f8 !important;
}

.landing-page.sitelock .navbar-nav .nav-item:last-child {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.sitelock .navbar-nav .nav-link {
    color: #5f7286 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 17px 22px !important;
}

.landing-page.sitelock .navbar-nav .nav-link:hover {
    color: #0b74d1 !important;
    background: #f4fbff !important;
}

/* =========================================================
   General Content Blocks
========================================================= */

.landing-page.sitelock .content-block {
    padding: 84px 0 !important;
    background: #ffffff !important;
}

.landing-page.sitelock .content-block > .container > h2 {
    font-size: 36px !important;
    line-height: 1.24 !important;
    max-width: 780px !important;
    margin-bottom: 18px !important;
}

.landing-page.sitelock .content-block > .container > h3 {
    color: #4e6479 !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    margin-top: -8px !important;
    margin-bottom: 34px !important;
}

.landing-page.sitelock .content-block br {
    display: none !important;
}

.landing-page.sitelock .content-block:not(.plans):not(.features):not(.emergency):not(.faq) p {
    max-width: 850px !important;
    color: #40566e !important;
    font-size: 16px !important;
    margin-bottom: 14px !important;
}

/* Intro accent line */
.landing-page.sitelock .content-block:not(.plans):not(.features):not(.emergency):not(.faq) h2::before {
    content: "" !important;
    display: block !important;
    width: 78px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #22b8ee 0%, #0b74d1 100%) !important;
    margin-bottom: 18px !important;
}

/* =========================================================
   Plans Section
========================================================= */

.landing-page.sitelock .plans {
    background: linear-gradient(135deg, #0e2f50 0%, #356f9f 100%) !important;
    color: #ffffff !important;
    padding: 86px 0 92px !important;
    position: relative !important;
}

.landing-page.sitelock .plans::before {
    content: "" !important;
    position: absolute !important;
    top: -120px !important;
    right: -160px !important;
    width: 420px !important;
    height: 420px !important;
    border-radius: 50% !important;
    background: rgba(34, 184, 238, 0.10) !important;
}

.landing-page.sitelock .plans .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.sitelock .plans h2 {
    color: #ffffff !important;
    font-size: 36px !important;
    margin-bottom: 6px !important;
}

.landing-page.sitelock .plans h3 {
    color: rgba(255, 255, 255, 0.84) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-bottom: 42px !important;
}

.landing-page.sitelock .plans .currency-selector {
    min-width: 220px !important;
    background: #ffffff !important;
}

.landing-page.sitelock .plan-comparison {
    align-items: stretch !important;
    justify-content: center !important;
}

.landing-page.sitelock .plan-comparison > div {
    display: flex !important;
    margin-bottom: 26px !important;
}

.landing-page.sitelock .plan {
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.24) !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.16) !important;
    display: flex !important;
    flex-direction: column !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitelock .plan:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 28px 58px rgba(0, 0, 0, 0.22) !important;
}

.landing-page.sitelock .plan .header {
    padding: 24px 22px 18px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%) !important;
    border-bottom: 1px solid #e9f1f7 !important;
}

.landing-page.sitelock .plan .header h4 {
    color: #102a43 !important;
    font-size: 21px !important;
    line-height: 1.35 !important;
    margin: 0 0 8px !important;
}

.landing-page.sitelock .plan .header h4 span {
    color: #0b74d1 !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

.landing-page.sitelock .plan .header p {
    color: #5f7286 !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    margin: 0 !important;
}

.landing-page.sitelock .plan ul {
    list-style: none !important;
    padding: 14px 20px !important;
    margin: 0 !important;
    flex: 1 1 auto !important;
}

.landing-page.sitelock .plan ul li {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #eef3f7 !important;
    color: #42586f !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.landing-page.sitelock .plan ul li:last-child {
    border-bottom: 0 !important;
}

.landing-page.sitelock .plan ul li span {
    color: #42586f !important;
}

.landing-page.sitelock .plan ul li i.fa-check {
    color: #00a884 !important;
}

.landing-page.sitelock .plan ul li i.fa-times {
    color: #d9534f !important;
}

.landing-page.sitelock .plan .footer {
    background: #f7fbfe !important;
    border-top: 1px solid #e9f1f7 !important;
    padding: 18px 20px 20px !important;
}

.landing-page.sitelock .plan .footer form {
    margin: 0 !important;
}

.landing-page.sitelock .plan .footer select {
    margin-bottom: 12px !important;
}

.landing-page.sitelock .plan .footer .btn {
    width: 100% !important;
    padding: 10px 18px !important;
}

/* =========================================================
   Features
========================================================= */

.landing-page.sitelock .features {
    background: #ffffff !important;
    padding: 86px 0 74px !important;
}

.landing-page.sitelock .features h2 {
    font-size: 36px !important;
    margin-bottom: 6px !important;
}

.landing-page.sitelock .features h3 {
    color: #4e6479 !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    max-width: 720px !important;
    margin-bottom: 40px !important;
}

.landing-page.sitelock .features .row {
    align-items: stretch !important;
}

.landing-page.sitelock .features .row > div {
    margin-bottom: 26px !important;
}

.landing-page.sitelock .feature-wrapper {
    display: flex !important;
    align-items: flex-start !important;
    gap: 18px !important;
    height: 100% !important;
    padding: 24px 22px !important;
    background: #ffffff !important;
    border: 1px solid #e6eef6 !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitelock .feature-wrapper:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(34, 184, 238, 0.42) !important;
    box-shadow: 0 18px 42px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.sitelock .feature-wrapper > i {
    flex: 0 0 58px !important;
    width: 58px !important;
    height: 58px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, rgba(34, 184, 238, 0.13), rgba(11, 116, 209, 0.10)) !important;
    color: #0b74d1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 24px !important;
    line-height: 1 !important;
	    margin-left: 10px !important; 
}

.landing-page.sitelock .feature-wrapper .content {
    flex: 1 !important;
}

.landing-page.sitelock .feature-wrapper h4 {
    font-size: 18px !important;
    line-height: 1.35 !important;
    margin: 0 0 8px !important;
}

.landing-page.sitelock .feature-wrapper p {
    font-size: 13px !important;
    line-height: 1.65 !important;
    margin: 0 !important;
    color: #64788f !important;
}

/* =========================================================
   Emergency Section
========================================================= */

.landing-page.sitelock .emergency {
    background: linear-gradient(135deg, #30363d 0%, #24292f 100%) !important;
    color: #ffffff !important;
    padding: 86px 0 88px !important;
    position: relative !important;
}

.landing-page.sitelock .emergency::before {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    top: -140px !important;
    width: 360px !important;
    height: 360px !important;
    border-radius: 50% !important;
    background: rgba(255, 211, 87, 0.08) !important;
}

.landing-page.sitelock .emergency .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.sitelock .emergency h2,
.landing-page.sitelock .emergency h2.text-danger {
    color: #ff4d5e !important;
    font-size: 36px !important;
    margin-bottom: 6px !important;
}

.landing-page.sitelock .emergency h3 {
    color: #ffffff !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    margin-bottom: 14px !important;
}

.landing-page.sitelock .emergency > .container > p {
    color: rgba(255,255,255,0.78) !important;
    max-width: 880px !important;
    margin-bottom: 38px !important;
}

.landing-page.sitelock .emergency .row > div {
    margin-bottom: 24px !important;
}

.landing-page.sitelock .emergency .feature-wrapper {
    background: rgba(255,255,255,0.055) !important;
    border-color: rgba(255,255,255,0.10) !important;
    box-shadow: none !important;
}

.landing-page.sitelock .emergency .feature-wrapper:hover {
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255, 211, 87, 0.35) !important;
    transform: translateY(-3px) !important;
}

.landing-page.sitelock .emergency .feature-wrapper > i {
    background: rgba(255, 211, 87, 0.12) !important;
    color: #ffe680 !important;
}

.landing-page.sitelock .emergency .feature-wrapper h4 {
    color: #ffffff !important;
}

.landing-page.sitelock .emergency .feature-wrapper p {
    color: rgba(255,255,255,0.72) !important;
}

.landing-page.sitelock .emergency .price {
    color: rgba(255,255,255,0.88) !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    padding-top: 8px !important;
}

.landing-page.sitelock .emergency .btn.btn-default {
    background: linear-gradient(135deg, #ffe680 0%, #ffd357 100%) !important;
    color: #1b334d !important;
    box-shadow: 0 10px 24px rgba(255, 211, 87, 0.22) !important;
}

.landing-page.sitelock .emergency .btn.btn-default:hover {
    background: linear-gradient(135deg, #ffd357 0%, #ffc233 100%) !important;
    color: #1b334d !important;
}

/* =========================================================
   FAQ Accordion
========================================================= */

.landing-page.sitelock .faq {
    background: #f7fbfe !important;
    padding: 86px 0 !important;
}

.landing-page.sitelock .faq .container {
    max-width: 880px !important;
}

.landing-page.sitelock .faq h2 {
    font-size: 34px !important;
    text-align: center !important;
    margin-bottom: 34px !important;
}

.landing-page.sitelock .faq .card {
    background: #ffffff !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 28px rgba(16, 48, 82, 0.05) !important;
    margin-bottom: 12px !important;
}

.landing-page.sitelock .faq .card-header {
    background: #ffffff !important;
    border: 0 !important;
    padding: 18px 22px !important;
    cursor: pointer !important;
    transition: all 0.22s ease !important;
}

.landing-page.sitelock .faq .card-header:hover {
    background: #f3fbff !important;
}

.landing-page.sitelock .faq .card-header h4 {
    color: #102a43 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    padding-right: 28px !important;
    position: relative !important;
}

.landing-page.sitelock .faq .card-header h4::after {
    content: "+" !important;
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: #eef8fe !important;
    color: #0b74d1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 900 !important;
}

.landing-page.sitelock .faq .card-body {
    border-top: 1px solid #edf3f8 !important;
    padding: 20px 22px !important;
    color: #5d7086 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

.landing-page.sitelock .faq .card-body ul {
    margin: 14px 0 0 20px !important;
    padding: 0 !important;
}

.landing-page.sitelock .faq .card-body li {
    margin-bottom: 6px !important;
}

/* =========================================================
   Bottom SiteLock Logo Block
========================================================= */

.landing-page.sitelock > .content-block:last-child {
    padding: 58px 0 !important;
    background: #ffffff !important;
}

.landing-page.sitelock > .content-block:last-child img {
    max-width: 280px !important;
    width: 100% !important;
    height: auto !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.sitelock .container {
        max-width: 960px !important;
    }

    .landing-page.sitelock .hero h2 {
        font-size: 35px !important;
    }

    .landing-page.sitelock .navbar-nav .nav-item {
        min-width: 155px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.sitelock .container {
        max-width: 720px !important;
    }

    .landing-page.sitelock .hero {
        padding: 88px 0 98px !important;
    }

    .landing-page.sitelock .hero .container {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .landing-page.sitelock .hero h2 {
        text-align: center !important;
        font-size: 31px !important;
        max-width: 680px !important;
    }

    .landing-page.sitelock .navbar-nav .nav-item {
        min-width: auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .landing-page.sitelock .content-block,
    .landing-page.sitelock .plans,
    .landing-page.sitelock .features,
    .landing-page.sitelock .emergency,
    .landing-page.sitelock .faq {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.sitelock .plans .float-right {
        float: none !important;
        margin-bottom: 22px !important;
        max-width: 260px !important;
    }

    .landing-page.sitelock .emergency .price,
    .landing-page.sitelock .emergency form,
    .landing-page.sitelock .emergency .btn {
        float: none !important;
        display: block !important;
        text-align: center !important;
    }

    .landing-page.sitelock .emergency .btn {
        margin-top: 18px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.sitelock .hero {
        padding: 72px 0 82px !important;
    }

    .landing-page.sitelock .hero .logo-container img {
        max-width: 180px !important;
    }

    .landing-page.sitelock .hero h2 {
        font-size: 27px !important;
        line-height: 1.24 !important;
    }

    .landing-page.sitelock .navbar-toggler {
        margin: 10px auto !important;
        border-radius: 10px !important;
        border-color: #d7e7f4 !important;
    }

    .landing-page.sitelock .navbar-nav {
        padding: 10px 0 !important;
    }

    .landing-page.sitelock .navbar-nav .nav-link {
        padding: 12px 18px !important;
    }

    .landing-page.sitelock .content-block > .container > h2,
    .landing-page.sitelock .plans h2,
    .landing-page.sitelock .features h2,
    .landing-page.sitelock .emergency h2,
    .landing-page.sitelock .emergency h2.text-danger,
    .landing-page.sitelock .faq h2 {
        font-size: 28px !important;
    }

    .landing-page.sitelock .content-block > .container > h3,
    .landing-page.sitelock .plans h3,
    .landing-page.sitelock .features h3,
    .landing-page.sitelock .emergency h3 {
        font-size: 16px !important;
    }

    .landing-page.sitelock .feature-wrapper {
        padding: 22px 20px !important;
    }

    .landing-page.sitelock .feature-wrapper > i {
        flex-basis: 52px !important;
        width: 52px !important;
        height: 52px !important;
        font-size: 22px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.sitelock .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.sitelock .hero {
        padding: 60px 0 70px !important;
    }

    .landing-page.sitelock .hero h2 {
        font-size: 24px !important;
    }

    .landing-page.sitelock .content-block,
    .landing-page.sitelock .plans,
    .landing-page.sitelock .features,
    .landing-page.sitelock .emergency,
    .landing-page.sitelock .faq {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.sitelock p {
        font-size: 14px !important;
    }

    .landing-page.sitelock .content-block:not(.plans):not(.features):not(.emergency):not(.faq) p {
        font-size: 14px !important;
    }

    .landing-page.sitelock .feature-wrapper {
        display: block !important;
        text-align: center !important;
    }

    .landing-page.sitelock .feature-wrapper > i {
        margin: 0 auto 16px !important;
    }

    .landing-page.sitelock .plan .header h4 span {
        float: none !important;
        display: block !important;
        margin-top: 6px !important;
    }

    .landing-page.sitelock .plans .currency-selector {
        min-width: 100% !important;
    }

    .landing-page.sitelock > .content-block:last-child img {
        max-width: 220px !important;
    }
}



/* =========================================================
   GiddyHost - Refined CodeGuard Page CSS
   Theme-first design: GiddyHost blue/cyan primary
   CodeGuard green used only as accent
   Scope: .landing-page.codeguard
========================================================= */

.landing-page.codeguard {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;
    --cg-green: #97c33b;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.codeguard *,
.landing-page.codeguard *::before,
.landing-page.codeguard *::after {
    box-sizing: border-box !important;
}

.landing-page.codeguard .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.codeguard h1,
.landing-page.codeguard h2,
.landing-page.codeguard h3,
.landing-page.codeguard h4,
.landing-page.codeguard h5,
.landing-page.codeguard h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.codeguard p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.codeguard .strong-green {
    color: var(--gh-navy) !important;
}

.landing-page.codeguard .strong-green em,
.landing-page.codeguard .strong-green strong,
.landing-page.codeguard h2.strong-green span {
    color: var(--cg-green) !important;
}

/* =========================================================
   Buttons / Inputs
========================================================= */

.landing-page.codeguard .btn,
.landing-page.codeguard button {
    transition: all 0.22s ease !important;
}

.landing-page.codeguard .btn,
.landing-page.codeguard .btn-default,
.landing-page.codeguard .order-btn {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 26px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.codeguard .btn:hover,
.landing-page.codeguard .btn-default:hover,
.landing-page.codeguard .order-btn:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

.landing-page.codeguard .form-control {
    min-height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    color: #31526f !important;
    font-size: 13px !important;
    box-shadow: none !important;
}

.landing-page.codeguard .form-control:focus {
    border-color: var(--gh-cyan) !important;
    box-shadow: 0 0 0 3px rgba(37, 185, 232, 0.16) !important;
}

/* =========================================================
   Hero - GiddyHost theme first
========================================================= */

.landing-page.codeguard .hero {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.16), transparent 28%),
        radial-gradient(circle at 85% 24%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    padding: 112px 0 118px !important;
    text-align: center !important;
    position: relative !important;
}

.landing-page.codeguard .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 35px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.codeguard .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 35px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.codeguard .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 34px !important;
    flex-wrap: wrap !important;
}

.landing-page.codeguard .hero .logo-container {
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.codeguard .hero .logo-container img {
    max-width: 170px !important;
    width: 100% !important;
    height: auto !important;
}

.landing-page.codeguard .hero h2 {
    max-width: 360px !important;
    margin: 0 !important;
    color: var(--gh-navy) !important;
    font-size: 43px !important;
    line-height: 1.08 !important;
    text-align: left !important;
    font-weight: 700 !important;
}

.landing-page.codeguard .hero h2::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.codeguard .hero h3 {
    max-width: 360px !important;
    margin: 0 !important;
    color: #4f6479 !important;
    font-size: 21px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
    text-align: left !important;
}

/* =========================================================
   Anchor Navigation
========================================================= */

.landing-page.codeguard .navbar.navbar-light {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.codeguard .navbar .container {
    justify-content: center !important;
}

.landing-page.codeguard #nav-landing-page {
    justify-content: center !important;
}

.landing-page.codeguard .navbar-nav {
    width: 100% !important;
    justify-content: center !important;
}

.landing-page.codeguard .navbar-nav .nav-item {
    min-width: 170px !important;
    text-align: center !important;
    border-left: 1px solid #edf3f8 !important;
}

.landing-page.codeguard .navbar-nav .nav-item:last-child {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.codeguard .navbar-nav .nav-link {
    color: #60758a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 16px 20px !important;
}

.landing-page.codeguard .navbar-nav .nav-link:hover {
    color: var(--gh-blue) !important;
    background: #f4fbff !important;
}

/* =========================================================
   Content Blocks
========================================================= */

.landing-page.codeguard .content-block {
    padding: 84px 0 !important;
}

.landing-page.codeguard .content-block h2 {
    font-size: 35px !important;
    line-height: 1.24 !important;
    margin-bottom: 18px !important;
}

.landing-page.codeguard .content-block h3 {
    color: #50667c !important;
    font-size: 18px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}

/* =========================================================
   Overview
========================================================= */

.landing-page.codeguard .image-standout {
    background: #ffffff !important;
}

.landing-page.codeguard .image-standout .row {
    align-items: center !important;
}

.landing-page.codeguard .image-standout img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.codeguard .image-standout h2 {
    max-width: 650px !important;
    color: var(--gh-navy) !important;
}

.landing-page.codeguard .image-standout h2::before {
    content: "" !important;
    display: block !important;
    width: 78px !important;
    height: 4px !important;
    border-radius: 999px !important;
    margin-bottom: 18px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.codeguard .image-standout p strong,
.landing-page.codeguard .image-standout p b {
    color: var(--gh-navy) !important;
}

/* =========================================================
   Overview Feature Strip
========================================================= */

.landing-page.codeguard .overview-features {
    background: #ffffff !important;
    padding: 16px 0 58px !important;
}

.landing-page.codeguard .overview-features ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    border: 1px solid #edf3f8 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: 0 12px 32px rgba(16, 48, 82, 0.05) !important;
}

.landing-page.codeguard .overview-features li {
    text-align: center !important;
    padding: 30px 18px 24px !important;
    border-right: 1px solid #edf3f8 !important;
    background: #ffffff !important;
    transition: all 0.22s ease !important;
	    width: auto !important;
}

.landing-page.codeguard .overview-features li:last-child {
    border-right: 0 !important;
}

.landing-page.codeguard .overview-features li:hover {
    background: #f4fbff !important;
}

.landing-page.codeguard .overview-features li img {
    max-width: 88px !important;
    margin-bottom: 14px !important;
    filter: hue-rotate(145deg) saturate(1.4) !important;
	padding: 0 !important 
}

.landing-page.codeguard .overview-features li span {
    display: block !important;
    color: #52687f !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
}

/* =========================================================
   Pricing - refined with GiddyHost blue
========================================================= */

.landing-page.codeguard .pricing {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.20), transparent 26%),
        linear-gradient(135deg, #0e2f50 0%, #0b74d1 100%) !important;
    padding: 82px 0 86px !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.codeguard .pricing::before {
    content: "" !important;
    position: absolute !important;
    right: -130px !important;
    top: -130px !important;
    width: 350px !important;
    height: 350px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.08) !important;
}

.landing-page.codeguard .pricing .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.codeguard .pricing h2 {
    color: #ffffff !important;
    font-size: 34px !important;
    margin-bottom: 20px !important;
}

.landing-page.codeguard .pricing h2::after {
    content: "" !important;
    display: block !important;
    width: 72px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: var(--cg-green) !important;
}

.landing-page.codeguard .pricing img {
    max-width: 135px !important;
    height: auto !important;
    opacity: 0.95 !important;
}

.landing-page.codeguard .pricing .currency-selector {
    min-width: 220px !important;
    background: #ffffff !important;
}

.landing-page.codeguard .price-calc-container {
    margin-top: 12px !important;
    padding: 28px 30px !important;
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 20px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 20px !important;
    backdrop-filter: blur(8px) !important;
}

.landing-page.codeguard .price-calc-top {
    flex: 1 1 100% !important;
}

.landing-page.codeguard .pricing-container {
    min-width: 155px !important;
}

.landing-page.codeguard #pricingAmount.price {
    color: #ffffff !important;
    font-size: 42px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    margin-bottom: 6px !important;
}

.landing-page.codeguard #pricingCycle {
    color: rgba(255,255,255,0.86) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.landing-page.codeguard .pricing form.float-right {
    margin-left: auto !important;
}

.landing-page.codeguard .pricing .order-btn {
    background: #ffffff !important;
    color: var(--gh-blue) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16) !important;
    min-width: 150px !important;
}

.landing-page.codeguard .pricing .order-btn:hover {
    background: var(--cg-green) !important;
    color: #ffffff !important;
}

/* =========================================================
   Ion Range Slider - blue/cyan with green handle accent
========================================================= */

.landing-page.codeguard .irs--html5 .irs-line {
    height: 8px !important;
    top: 26px !important;
    background: rgba(255,255,255,0.42) !important;
    border: 0 !important;
    border-radius: 999px !important;
}

.landing-page.codeguard .irs--html5 .irs-bar {
    height: 8px !important;
    top: 26px !important;
    background: linear-gradient(90deg, var(--gh-cyan), #ffffff) !important;
    border: 0 !important;
    border-radius: 999px !important;
}

.landing-page.codeguard .irs--html5 .irs-handle {
    top: 17px !important;
    width: 24px !important;
    height: 24px !important;
    border: 4px solid var(--cg-green) !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 6px 16px rgba(0,0,0,0.18) !important;
}

.landing-page.codeguard .irs--html5 .irs-handle i {
    display: none !important;
}

.landing-page.codeguard .irs--html5 .irs-min,
.landing-page.codeguard .irs--html5 .irs-max,
.landing-page.codeguard .irs--html5 .irs-from,
.landing-page.codeguard .irs--html5 .irs-to,
.landing-page.codeguard .irs--html5 .irs-single {
    display: none !important;
}

.landing-page.codeguard .irs--html5 .irs-grid-text {
    color: rgba(255,255,255,0.94) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.landing-page.codeguard .irs--html5 .irs-grid-pol {
    background: rgba(255,255,255,0.45) !important;
}

/* =========================================================
   Feature Cards
========================================================= */

.landing-page.codeguard .features {
    background: #ffffff !important;
    padding: 86px 0 72px !important;
}

.landing-page.codeguard .features .row > div {
    margin-bottom: 28px !important;
}

.landing-page.codeguard .feature {
    height: 100% !important;
    min-height: 245px !important;
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 30px 22px 26px !important;
    text-align: center !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.codeguard .feature:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(37, 185, 232, 0.44) !important;
    box-shadow: 0 20px 44px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.codeguard .feature .icon {
    width: 76px !important;
    height: 76px !important;
    margin: 0 auto 18px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, rgba(37, 185, 232, 0.12), rgba(11, 116, 209, 0.08)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.codeguard .feature .icon img {
    max-width: 46px !important;
    max-height: 46px !important;
}

.landing-page.codeguard .feature h4 {
    font-size: 19px !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
    color: var(--gh-navy) !important;
}

.landing-page.codeguard .feature p {
    font-size: 13px !important;
    line-height: 1.68 !important;
    margin: 0 !important;
    color: var(--gh-muted) !important;
}

/* =========================================================
   FAQ
========================================================= */

.landing-page.codeguard .faqs {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    padding: 86px 0 76px !important;
}

.landing-page.codeguard .faqs h3 {
    color: var(--gh-navy) !important;
    font-size: 34px !important;
    margin-bottom: 42px !important;
}

.landing-page.codeguard .faqs h3::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.codeguard .faqs .row > div {
    margin-bottom: 28px !important;
}

.landing-page.codeguard .faqs .row > div {
    background: transparent !important;
}

.landing-page.codeguard .faqs h4 {
    font-size: 19px !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
    color: var(--gh-navy) !important;
}

.landing-page.codeguard .faqs p {
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: var(--gh-muted) !important;
    margin-bottom: 0 !important;
}

/* =========================================================
   Bottom Logo
========================================================= */

.landing-page.codeguard > .content-block:last-child {
    background: #ffffff !important;
    padding: 58px 0 !important;
}

.landing-page.codeguard > .content-block:last-child img {
    max-width: 310px !important;
    width: 100% !important;
    height: auto !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.codeguard .container {
        max-width: 960px !important;
    }

    .landing-page.codeguard .hero h2 {
        font-size: 38px !important;
    }

    .landing-page.codeguard .navbar-nav .nav-item {
        min-width: 150px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.codeguard .container {
        max-width: 720px !important;
    }

    .landing-page.codeguard .hero {
        padding: 88px 0 98px !important;
    }

    .landing-page.codeguard .hero .container {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .landing-page.codeguard .hero h2,
    .landing-page.codeguard .hero h3 {
        text-align: center !important;
        max-width: 100% !important;
    }

    .landing-page.codeguard .hero h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.codeguard .content-block,
    .landing-page.codeguard .pricing,
    .landing-page.codeguard .features,
    .landing-page.codeguard .faqs {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.codeguard .navbar-nav .nav-item {
        min-width: auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .landing-page.codeguard .overview-features ul {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .landing-page.codeguard .overview-features li {
        border-bottom: 1px solid #edf3f8 !important;
    }

    .landing-page.codeguard .pricing .float-right {
        float: none !important;
        margin-top: 20px !important;
    }

    .landing-page.codeguard .price-calc-container {
        padding: 24px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.codeguard .hero {
        padding: 70px 0 80px !important;
    }

    .landing-page.codeguard .hero .logo-container img {
        max-width: 150px !important;
    }

    .landing-page.codeguard .hero h2 {
        font-size: 28px !important;
        line-height: 1.18 !important;
    }

    .landing-page.codeguard .hero h3 {
        font-size: 16px !important;
    }

    .landing-page.codeguard .navbar-toggler {
        margin: 10px auto !important;
        border-radius: 10px !important;
        border-color: #d7e7f4 !important;
    }

    .landing-page.codeguard .navbar-nav {
        padding: 10px 0 !important;
    }

    .landing-page.codeguard .navbar-nav .nav-link {
        padding: 12px 18px !important;
    }

    .landing-page.codeguard .content-block h2,
    .landing-page.codeguard .faqs h3 {
        font-size: 27px !important;
    }

    .landing-page.codeguard .overview-features ul {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .landing-page.codeguard .pricing img {
        max-width: 105px !important;
        margin-bottom: 18px !important;
    }

    .landing-page.codeguard .price-calc-container {
        display: block !important;
    }

    .landing-page.codeguard .pricing-container {
        margin-bottom: 18px !important;
    }

    .landing-page.codeguard .pricing .order-btn {
        width: 100% !important;
    }

    .landing-page.codeguard .feature {
        min-height: auto !important;
    }
}

@media (max-width: 575px) {
    .landing-page.codeguard .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.codeguard .hero {
        padding: 58px 0 68px !important;
    }

    .landing-page.codeguard .hero h2 {
        font-size: 24px !important;
    }

    .landing-page.codeguard .hero h3 {
        font-size: 15px !important;
    }

    .landing-page.codeguard .content-block,
    .landing-page.codeguard .pricing,
    .landing-page.codeguard .features,
    .landing-page.codeguard .faqs {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.codeguard p {
        font-size: 14px !important;
    }

    .landing-page.codeguard .overview-features ul {
        grid-template-columns: 1fr !important;
    }

    .landing-page.codeguard #pricingAmount.price {
        font-size: 34px !important;
    }

    .landing-page.codeguard > .content-block:last-child img {
        max-width: 230px !important;
    }
}




/* =========================================================
   GiddyHost - WHMCS Marketgoo Page Redesign
   Scope: .landing-page.marketgoo
   Theme style: GiddyHost cyan/blue + clean white sections
========================================================= */

.landing-page.marketgoo {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;
    --mg-purple: #b12bdc;
    --mg-green: #19b46b;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.marketgoo *,
.landing-page.marketgoo *::before,
.landing-page.marketgoo *::after {
    box-sizing: border-box !important;
}

.landing-page.marketgoo .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.marketgoo h1,
.landing-page.marketgoo h2,
.landing-page.marketgoo h3,
.landing-page.marketgoo h4,
.landing-page.marketgoo h5,
.landing-page.marketgoo h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.marketgoo p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.marketgoo a {
    text-decoration: none !important;
}

/* =========================================================
   Buttons / Inputs
========================================================= */

.landing-page.marketgoo .btn,
.landing-page.marketgoo button {
    transition: all 0.22s ease !important;
}

.landing-page.marketgoo .btn-primary,
.landing-page.marketgoo .btn-signup {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 26px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.marketgoo .btn-primary:hover,
.landing-page.marketgoo .btn-signup:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

.landing-page.marketgoo .form-control {
    min-height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    color: #31526f !important;
    font-size: 13px !important;
    box-shadow: none !important;
}

.landing-page.marketgoo .form-control:focus {
    border-color: var(--gh-cyan) !important;
    box-shadow: 0 0 0 3px rgba(37, 185, 232, 0.16) !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.marketgoo .hero {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.16), transparent 28%),
        radial-gradient(circle at 85% 24%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    padding: 112px 0 118px !important;
    position: relative !important;
    text-align: center !important;
}

.landing-page.marketgoo .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 35px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.marketgoo .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 35px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.marketgoo .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 34px !important;
    flex-wrap: wrap !important;
}

.landing-page.marketgoo .hero .logo {
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.marketgoo .hero .logo img {
    max-width: 132px !important;
    width: 100% !important;
    height: auto !important;
}

.landing-page.marketgoo .hero h2 {
    margin: 0 !important;
    color: var(--gh-navy) !important;
    font-size: 42px !important;
    line-height: 1.14 !important;
    text-align: left !important;
    font-weight: 700 !important;
}

.landing-page.marketgoo .hero h2.strong-green {
    max-width: 300px !important;
}

.landing-page.marketgoo .hero h2:not(.strong-green) {
    max-width: 420px !important;
}

.landing-page.marketgoo .hero h2.strong-green::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

/* =========================================================
   Video Banner
========================================================= */

.landing-page.marketgoo .video-banner {
    background:
        radial-gradient(circle at 20% 30%, rgba(255,255,255,0.16), transparent 30%),
        linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    padding: 58px 0 !important;
    position: relative !important;
}

.landing-page.marketgoo .video-banner::before {
    content: "" !important;
    position: absolute !important;
    left: -110px !important;
    top: 0 !important;
    width: 420px !important;
    height: 100% !important;
    background: rgba(255,255,255,0.10) !important;
    transform: skewX(-18deg) !important;
}

.landing-page.marketgoo .video-banner .container {
    position: relative !important;
    z-index: 2 !important;
    max-width: 780px !important;
}

.landing-page.marketgoo .video-banner .embed-responsive {
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 24px 58px rgba(6, 41, 78, 0.24) !important;
    background: #0b253f !important;
    border: 8px solid rgba(255,255,255,0.16) !important;
}

/* =========================================================
   Anchor Navigation
========================================================= */

.landing-page.marketgoo .navbar.navbar-light {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.marketgoo .navbar .container {
    justify-content: center !important;
}

.landing-page.marketgoo #nav-landing-page {
    justify-content: center !important;
}

.landing-page.marketgoo .navbar-nav {
    width: 100% !important;
    justify-content: center !important;
}

.landing-page.marketgoo .navbar-nav .nav-item {
    min-width: 180px !important;
    text-align: center !important;
    border-left: 1px solid #edf3f8 !important;
}

.landing-page.marketgoo .navbar-nav .nav-item:last-child {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.marketgoo .navbar-nav .nav-link {
    color: #60758a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 16px 20px !important;
}

.landing-page.marketgoo .navbar-nav .nav-link:hover {
    color: var(--gh-blue) !important;
    background: #f4fbff !important;
}

/* =========================================================
   Content Blocks
========================================================= */

.landing-page.marketgoo .content-block {
    padding: 82px 0 !important;
}

/* =========================================================
   How It Works Blocks
========================================================= */

.landing-page.marketgoo .feature-blocks {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.marketgoo .feature-blocks + .feature-blocks {
    padding-top: 0 !important;
}

.landing-page.marketgoo .feature-blocks .row {
    justify-content: center !important;
}

.landing-page.marketgoo .feature-blocks .row > div {
    margin-bottom: 28px !important;
}

.landing-page.marketgoo .feature-blocks .block {
    height: 100% !important;
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 32px 24px 28px !important;
    text-align: center !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.marketgoo .feature-blocks .block:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(37, 185, 232, 0.44) !important;
    box-shadow: 0 20px 44px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.marketgoo .feature-blocks .block img {
    max-width: 116px !important;
    height: auto !important;
    margin: 0 auto 20px !important;
}

.landing-page.marketgoo .feature-blocks .block span {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
}

.landing-page.marketgoo .feature-blocks .block p {
    max-width: 340px !important;
    margin: 12px auto 0 !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.landing-page.marketgoo .feature-wrapper {
    background:
        radial-gradient(circle at top left, rgba(37, 185, 232, 0.12), transparent 28%),
        linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 24px !important;
    padding: 38px 34px 10px !important;
    box-shadow: 0 16px 42px rgba(16, 48, 82, 0.07) !important;
}

/* =========================================================
   Pricing / Plan Matrix
========================================================= */

.landing-page.marketgoo #features {
    background: #ffffff !important;
    padding-top: 28px !important;
}

.landing-page.marketgoo .plan-container {
    max-width: 880px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1.35fr 1fr 1fr !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
    background: #ffffff !important;
}

.landing-page.marketgoo .plan {
    background: #ffffff !important;
    border-right: 1px solid #e8f0f7 !important;
    display: flex !important;
    flex-direction: column !important;
}

.landing-page.marketgoo .plan:last-child {
    border-right: 0 !important;
}

.landing-page.marketgoo .plan.labels {
    background: #f7fbfe !important;
}

.landing-page.marketgoo .plan .header {
    min-height: 130px !important;
    padding: 26px 22px 20px !important;
    border-bottom: 1px solid #e8f0f7 !important;
    text-align: center !important;
}

.landing-page.marketgoo .plan.labels .header {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.marketgoo .plan .header h4 {
    margin: 0 0 8px !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
    color: var(--gh-navy) !important;
}

.landing-page.marketgoo .plan .header h4 span:first-child {
    display: block !important;
}

.landing-page.marketgoo .plan.pro .header h4,
.landing-page.marketgoo .plan.professional .header h4 {
    color: var(--mg-purple) !important;
}

.landing-page.marketgoo .best-value {
    display: inline-block !important;
    margin-top: 8px !important;
    background: linear-gradient(135deg, var(--gh-cyan), var(--gh-blue)) !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    padding: 5px 10px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

.landing-page.marketgoo .plan .pricing {
    display: block !important;
    color: var(--gh-blue) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

.landing-page.marketgoo .plan ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 1 1 auto !important;
}

.landing-page.marketgoo .plan ul li {
    min-height: 48px !important;
    padding: 13px 16px !important;
    border-bottom: 1px solid #e8f0f7 !important;
    color: #42586f !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.landing-page.marketgoo .plan.labels ul li {
    justify-content: flex-start !important;
    text-align: left !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    background: #f7fbfe !important;
}

.landing-page.marketgoo .plan ul li img {
    width: 18px !important;
    height: 18px !important;
}

.landing-page.marketgoo .plan form {
    margin: 0 !important;
    padding: 24px 20px 28px !important;
    border-top: 1px solid #e8f0f7 !important;
    background: #ffffff !important;
}

.landing-page.marketgoo .plan .btn-signup {
    width: 100% !important;
    padding: 11px 18px !important;
}

.landing-page.marketgoo .currency-selector {
    max-width: 220px !important;
}

/* =========================================================
   Testimonials
========================================================= */

.landing-page.marketgoo .testimonials {
    background: #ffffff !important;
    padding: 86px 0 !important;
    text-align: center !important;
}

.landing-page.marketgoo #marketgoo-testimonials {
    max-width: 760px !important;
    margin: 0 auto !important;
}

.landing-page.marketgoo .testimonial {
    color: #60758a !important;
    font-size: 24px !important;
    line-height: 1.55 !important;
    font-weight: 600 !important;
    max-width: 720px !important;
    margin: 0 auto 34px !important;
    position: relative !important;
}

.landing-page.marketgoo .testimonial::before {
    content: "“" !important;
    display: block !important;
    color: rgba(37, 185, 232, 0.22) !important;
    font-size: 86px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    margin-bottom: -24px !important;
}

.landing-page.marketgoo .user {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 16px !important;
    text-align: left !important;
}

.landing-page.marketgoo .user img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 4px solid #e8f7fd !important;
}

.landing-page.marketgoo .user .bio span {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

.landing-page.marketgoo .user .bio em {
    display: block !important;
    color: #64788f !important;
    font-size: 13px !important;
    font-style: normal !important;
    margin-bottom: 4px !important;
}

.landing-page.marketgoo .user .bio a {
    color: var(--gh-blue) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.landing-page.marketgoo .carousel-indicators {
    position: static !important;
    margin: 30px 0 0 !important;
}

.landing-page.marketgoo .carousel-indicators li {
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: #c7d9e8 !important;
    opacity: 1 !important;
}

.landing-page.marketgoo .carousel-indicators li.active {
    background: var(--gh-blue) !important;
}

/* =========================================================
   FAQs
========================================================= */

.landing-page.marketgoo .faqs {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    padding: 86px 0 !important;
}

.landing-page.marketgoo .faqs h3 {
    color: var(--gh-navy) !important;
    font-size: 34px !important;
    margin-bottom: 44px !important;
}

.landing-page.marketgoo .faqs h3::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.marketgoo .faqs .row > div {
    margin-bottom: 24px !important;
}

.landing-page.marketgoo .faq {
    height: 100% !important;
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 28px 24px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.marketgoo .faq:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(37, 185, 232, 0.44) !important;
    box-shadow: 0 20px 44px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.marketgoo .faq h4 {
    color: var(--gh-navy) !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
}

.landing-page.marketgoo .faq p {
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    margin-bottom: 0 !important;
}

.landing-page.marketgoo .faq img {
    max-width: 100% !important;
    border-radius: 12px !important;
    margin-top: 18px !important;
    box-shadow: 0 10px 24px rgba(16, 48, 82, 0.08) !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.marketgoo .container {
        max-width: 960px !important;
    }

    .landing-page.marketgoo .hero h2 {
        font-size: 37px !important;
    }

    .landing-page.marketgoo .navbar-nav .nav-item {
        min-width: 155px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.marketgoo .container {
        max-width: 720px !important;
    }

    .landing-page.marketgoo .hero {
        padding: 88px 0 98px !important;
    }

    .landing-page.marketgoo .hero .container {
        flex-direction: column !important;
        gap: 18px !important;
    }

    .landing-page.marketgoo .hero h2,
    .landing-page.marketgoo .hero h2.strong-green,
    .landing-page.marketgoo .hero h2:not(.strong-green) {
        text-align: center !important;
        max-width: 100% !important;
    }

    .landing-page.marketgoo .hero h2.strong-green::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.marketgoo .navbar-nav .nav-item {
        min-width: auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .landing-page.marketgoo .content-block,
    .landing-page.marketgoo .testimonials,
    .landing-page.marketgoo .faqs {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.marketgoo .plan-container {
        grid-template-columns: 1fr !important;
    }

    .landing-page.marketgoo .plan.labels {
        display: none !important;
    }

    .landing-page.marketgoo .plan {
        border-right: 0 !important;
        border-bottom: 1px solid #e8f0f7 !important;
    }

    .landing-page.marketgoo .plan:last-child {
        border-bottom: 0 !important;
    }

    .landing-page.marketgoo .plan .header {
        min-height: auto !important;
    }

    .landing-page.marketgoo .plan ul li {
        min-height: auto !important;
        padding: 12px 16px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.marketgoo .hero {
        padding: 70px 0 80px !important;
    }

    .landing-page.marketgoo .hero .logo img {
        max-width: 120px !important;
    }

    .landing-page.marketgoo .hero h2 {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }

    .landing-page.marketgoo .video-banner {
        padding: 42px 0 !important;
    }

    .landing-page.marketgoo .video-banner .embed-responsive {
        border-width: 5px !important;
        border-radius: 15px !important;
    }

    .landing-page.marketgoo .navbar-toggler {
        margin: 10px auto !important;
        border-radius: 10px !important;
        border-color: #d7e7f4 !important;
    }

    .landing-page.marketgoo .navbar-nav {
        padding: 10px 0 !important;
    }

    .landing-page.marketgoo .navbar-nav .nav-link {
        padding: 12px 18px !important;
    }

    .landing-page.marketgoo .feature-wrapper {
        padding: 28px 20px 4px !important;
    }

    .landing-page.marketgoo .testimonial {
        font-size: 20px !important;
    }

    .landing-page.marketgoo .faqs h3 {
        font-size: 27px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.marketgoo .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.marketgoo .hero {
        padding: 58px 0 68px !important;
    }

    .landing-page.marketgoo .hero h2 {
        font-size: 24px !important;
    }

    .landing-page.marketgoo .content-block,
    .landing-page.marketgoo .testimonials,
    .landing-page.marketgoo .faqs {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.marketgoo p {
        font-size: 14px !important;
    }

    .landing-page.marketgoo .feature-blocks .block {
        padding: 28px 20px 24px !important;
    }

    .landing-page.marketgoo .plan .header h4 {
        font-size: 24px !important;
    }

    .landing-page.marketgoo .testimonial {
        font-size: 18px !important;
    }

    .landing-page.marketgoo .user {
        display: block !important;
        text-align: center !important;
    }

    .landing-page.marketgoo .user img {
        margin-bottom: 12px !important;
    }
}


/* =========================================================
   GiddyHost Marketgoo - FINAL FIX / REFINED DESIGN
   Add this AFTER the previous Marketgoo CSS
========================================================= */

/* Reset broken inherited Marketgoo layout */
.landing-page.marketgoo .plan-container,
.landing-page.marketgoo .plan-container * {
    box-sizing: border-box !important;
}

.landing-page.marketgoo .plan-container {
    width: 100% !important;
    max-width: 980px !important;
    margin: 20px auto 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 1.35fr) minmax(220px, 1fr) minmax(220px, 1fr) !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: #ffffff !important;
    border: 1px solid #dcecf7 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: 0 18px 45px rgba(16, 48, 82, 0.10) !important;
}

/* Very important:
   Marketgoo template outputs a labels column before EACH plan.
   Keep only the first labels column. */
.landing-page.marketgoo .plan-container > .plan.labels:not(:first-child) {
    display: none !important;
}

/* Remove old float/width behaviour */
.landing-page.marketgoo .plan-container > .plan {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 0 !important;
    border-right: 1px solid #e7f0f7 !important;
    box-shadow: none !important;
}

.landing-page.marketgoo .plan-container > .plan:last-child {
    border-right: 0 !important;
}

/* Labels column */
.landing-page.marketgoo .plan-container > .plan.labels {
    background: #f7fbfe !important;
}

.landing-page.marketgoo .plan.labels .header {
    background: #f7fbfe !important;
}

.landing-page.marketgoo .plan.labels .header::before {
    content: "Features" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    background: rgba(37, 185, 232, 0.12) !important;
    color: #0b74d1 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.35px !important;
}

/* Header */
.landing-page.marketgoo .plan .header {
    min-height: 150px !important;
    padding: 30px 24px 24px !important;
    border-bottom: 1px solid #e7f0f7 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%) !important;
    text-align: center !important;
}

.landing-page.marketgoo .plan .header br {
    display: none !important;
}

.landing-page.marketgoo .plan .header h4 {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    color: #102a43 !important;
    font-size: 30px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    text-align: center !important;
}

.landing-page.marketgoo .plan.pro .header h4,
.landing-page.marketgoo .plan.professional .header h4 {
    color: #102a43 !important;
}

.landing-page.marketgoo .plan .header h4 > span:first-child {
    display: block !important;
}

.landing-page.marketgoo .plan .pricing {
    display: block !important;
    margin-top: 8px !important;
    color: #0b74d1 !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

.landing-page.marketgoo .plan.pro .pricing,
.landing-page.marketgoo .plan.professional .pricing {
    color: #0b74d1 !important;
}

.landing-page.marketgoo .best-value {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 8px auto 0 !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

/* Feature rows */
.landing-page.marketgoo .plan ul {
    flex: 1 1 auto !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.marketgoo .plan ul li {
    width: 100% !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 13px 18px !important;
    border-bottom: 1px solid #e7f0f7 !important;
    background: #ffffff !important;
    color: #40566e !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.marketgoo .plan.labels ul li {
    justify-content: flex-start !important;
    text-align: left !important;
    background: #f7fbfe !important;
    color: #102a43 !important;
    font-weight: 900 !important;
}

.landing-page.marketgoo .plan ul li img {
    width: 19px !important;
    height: 19px !important;
    display: inline-block !important;
}

/* Use a clean green check color only for checks */
.landing-page.marketgoo .plan ul li img[src*="icon-check"] {
    filter: none !important;
}

/* Signup area */
.landing-page.marketgoo .plan form {
    margin: 0 !important;
    padding: 24px 22px 28px !important;
    background: #ffffff !important;
    border-top: 1px solid #e7f0f7 !important;
}

.landing-page.marketgoo .plan .btn-signup {
    width: 100% !important;
    max-width: 170px !important;
    margin: 0 auto !important;
    display: block !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    padding: 11px 22px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    box-shadow: 0 10px 22px rgba(11, 116, 209, 0.22) !important;
}

.landing-page.marketgoo .plan .btn-signup:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    transform: translateY(-1px) !important;
}

/* Currency selector inside labels header */
.landing-page.marketgoo .plan.labels .currency-selector {
    width: 100% !important;
    max-width: 210px !important;
    margin: 0 auto !important;
    height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    color: #31526f !important;
    font-size: 13px !important;
}

/* Prevent PRO column from becoming skinny */
.landing-page.marketgoo .plan.lite,
.landing-page.marketgoo .plan.pro,
.landing-page.marketgoo .plan.professional {
    min-width: 0 !important;
}

/* Make section spacing cleaner */
.landing-page.marketgoo #features {
    padding-top: 80px !important;
    padding-bottom: 86px !important;
    background: #ffffff !important;
}

/* =========================================================
   Hero / Video refinement
========================================================= */

.landing-page.marketgoo .hero {
    min-height: 360px !important;
    display: flex !important;
    align-items: center !important;
}

.landing-page.marketgoo .hero .container {
    gap: 34px !important;
}

.landing-page.marketgoo .hero h2 {
    font-size: 40px !important;
    line-height: 1.12 !important;
    color: #102a43 !important;
}

.landing-page.marketgoo .hero h2.strong-green::after {
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

.landing-page.marketgoo .video-banner {
    padding: 46px 0 !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
}

.landing-page.marketgoo .video-banner .container {
    max-width: 820px !important;
}

.landing-page.marketgoo .video-banner .embed-responsive {
    border-radius: 16px !important;
    border: 7px solid rgba(255,255,255,0.16) !important;
    box-shadow: 0 22px 52px rgba(6, 41, 78, 0.25) !important;
}

/* =========================================================
   Feature blocks cleaner sizing
========================================================= */

.landing-page.marketgoo .feature-blocks .block {
    min-height: 170px !important;
}

.landing-page.marketgoo .feature-blocks .block img {
    max-height: 86px !important;
    width: auto !important;
}

.landing-page.marketgoo .feature-wrapper {
    max-width: 760px !important;
    margin: 0 auto !important;
}

/* =========================================================
   Responsive pricing table
========================================================= */

@media (max-width: 991px) {
    .landing-page.marketgoo .plan-container {
        display: block !important;
        max-width: 520px !important;
        border-radius: 20px !important;
        overflow: hidden !important;
    }

    .landing-page.marketgoo .plan-container > .plan.labels {
        display: none !important;
    }

    .landing-page.marketgoo .plan-container > .plan {
        display: block !important;
        border-right: 0 !important;
        border-bottom: 1px solid #e7f0f7 !important;
    }

    .landing-page.marketgoo .plan-container > .plan:last-child {
        border-bottom: 0 !important;
    }

    .landing-page.marketgoo .plan .header {
        min-height: auto !important;
        padding: 28px 22px 22px !important;
    }

    .landing-page.marketgoo .plan ul li {
        min-height: auto !important;
        padding: 12px 18px !important;
    }

    .landing-page.marketgoo .plan ul li::before {
        content: "Feature";
        display: inline-block !important;
        margin-right: 10px !important;
        color: #102a43 !important;
        font-weight: 900 !important;
    }
}

@media (max-width: 767px) {
    .landing-page.marketgoo .hero {
        min-height: auto !important;
        padding: 70px 0 80px !important;
    }

    .landing-page.marketgoo .hero h2 {
        font-size: 28px !important;
        text-align: center !important;
    }

    .landing-page.marketgoo .video-banner {
        padding: 38px 0 !important;
    }

    .landing-page.marketgoo #features {
        padding-top: 60px !important;
        padding-bottom: 64px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.marketgoo .plan-container {
        max-width: 100% !important;
    }

    .landing-page.marketgoo .plan .header h4 {
        font-size: 25px !important;
    }

    .landing-page.marketgoo .plan .pricing {
        font-size: 16px !important;
    }

    .landing-page.marketgoo .plan form {
        padding: 22px 18px 26px !important;
    }
}




/* =========================================================
   GiddyHost - WHMCS Email Services / SpamExperts Redesign
   Scope: .landing-page.mail-services
   Add AFTER store.css
========================================================= */

.landing-page.mail-services {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.mail-services *,
.landing-page.mail-services *::before,
.landing-page.mail-services *::after {
    box-sizing: border-box !important;
}

.landing-page.mail-services .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.mail-services h1,
.landing-page.mail-services h2,
.landing-page.mail-services h3,
.landing-page.mail-services h4,
.landing-page.mail-services h5,
.landing-page.mail-services h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.mail-services p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.mail-services a {
    text-decoration: none !important;
}

/* =========================================================
   Buttons / Forms
========================================================= */

.landing-page.mail-services .btn,
.landing-page.mail-services button {
    transition: all 0.22s ease !important;
}

.landing-page.mail-services .btn-buy,
.landing-page.mail-services .btn-order-now,
.landing-page.mail-services .btn-primary {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 10px 24px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.mail-services .btn-buy:hover,
.landing-page.mail-services .btn-order-now:hover,
.landing-page.mail-services .btn-primary:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

.landing-page.mail-services .btn-learn-more,
.landing-page.mail-services .btn-default {
    background: #eef8fe !important;
    border: 1px solid #d7eaf7 !important;
    border-radius: 999px !important;
    color: var(--gh-blue) !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 10px 22px !important;
}

.landing-page.mail-services .btn-learn-more:hover,
.landing-page.mail-services .btn-default:hover,
.landing-page.mail-services .btn-default.active {
    background: var(--gh-blue) !important;
    border-color: var(--gh-blue) !important;
    color: #ffffff !important;
}

.landing-page.mail-services .form-control {
    min-height: 42px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    color: #31526f !important;
    font-size: 13px !important;
    box-shadow: none !important;
}

.landing-page.mail-services .form-control:focus {
    border-color: var(--gh-cyan) !important;
    box-shadow: 0 0 0 3px rgba(37, 185, 232, 0.16) !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.mail-services .hero {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.16), transparent 28%),
        radial-gradient(circle at 85% 24%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    min-height: 360px !important;
    padding: 105px 0 112px !important;
    display: flex !important;
    align-items: center !important;
    text-align: center !important;
    position: relative !important;
}

.landing-page.mail-services .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 35px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.mail-services .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 35px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.mail-services .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 70px !important;
    flex-wrap: wrap !important;
}

.landing-page.mail-services .hero h2 {
    margin: 0 !important;
    color: var(--gh-navy) !important;
    font-size: 42px !important;
    line-height: 1.14 !important;
    text-align: left !important;
    font-weight: 700 !important;
}

.landing-page.mail-services .hero h2::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.mail-services .hero h3 {
    margin: 0 !important;
    color: #4f6479 !important;
    font-size: 21px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
    text-align: left !important;
}

/* =========================================================
   Anchor Navigation
========================================================= */

.landing-page.mail-services .navbar.navbar-light {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.mail-services .navbar .container {
    justify-content: center !important;
}

.landing-page.mail-services #nav-landing-page {
    justify-content: center !important;
}

.landing-page.mail-services .navbar-nav {
    width: 100% !important;
    justify-content: center !important;
}

.landing-page.mail-services .navbar-nav .nav-item {
    min-width: 175px !important;
    text-align: center !important;
    border-left: 1px solid #edf3f8 !important;
}

.landing-page.mail-services .navbar-nav .nav-item:last-child {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.mail-services .navbar-nav .nav-link {
    color: #60758a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 16px 20px !important;
}

.landing-page.mail-services .navbar-nav .nav-link:hover {
    color: var(--gh-blue) !important;
    background: #f4fbff !important;
}

/* =========================================================
   Product Options / Overview Cards
========================================================= */

.landing-page.mail-services .product-options {
    background:
        radial-gradient(circle at top left, rgba(255,255,255,0.18), transparent 28%),
        linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    padding: 64px 0 52px !important;
    position: relative !important;
}

.landing-page.mail-services .product-options::before {
    content: "" !important;
    position: absolute !important;
    left: -110px !important;
    top: 0 !important;
    width: 420px !important;
    height: 100% !important;
    background: rgba(255,255,255,0.10) !important;
    transform: skewX(-18deg) !important;
}

.landing-page.mail-services .product-options .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.mail-services .product-options .row {
    justify-content: center !important;
}

.landing-page.mail-services .product-options .row > div {
    margin-bottom: 26px !important;
}

.landing-page.mail-services .product-options .item {
    height: 100% !important;
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.35) !important;
    border-radius: 20px !important;
    padding: 30px 24px 26px !important;
    text-align: center !important;
    box-shadow: 0 18px 44px rgba(6, 41, 78, 0.16) !important;
    transition: all 0.22s ease !important;
}

.landing-page.mail-services .product-options .item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 24px 54px rgba(6, 41, 78, 0.22) !important;
}

.landing-page.mail-services .product-options .item h4 {
    font-size: 19px !important;
    margin-bottom: 18px !important;
    color: var(--gh-navy) !important;
}

.landing-page.mail-services .product-options .item .icon {
    width: 76px !important;
    height: 76px !important;
    margin: 0 auto 18px !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, rgba(37, 185, 232, 0.13), rgba(11, 116, 209, 0.08)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.mail-services .product-options .item .icon i {
    color: var(--gh-blue) !important;
    font-size: 32px !important;
}

.landing-page.mail-services .product-options .item span {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    margin-bottom: 8px !important;
}

.landing-page.mail-services .product-options .item p {
    color: var(--gh-muted) !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
    margin-bottom: 12px !important;
}

.landing-page.mail-services .product-options .item .price {
    color: var(--gh-blue) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    margin-bottom: 18px !important;
}

.landing-page.mail-services .product-options .item .btn {
    margin: 4px !important;
}

.landing-page.mail-services .powered-by {
    text-align: right !important;
    color: rgba(255,255,255,0.82) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    margin-top: 4px !important;
}

.landing-page.mail-services .powered-by img {
    max-height: 42px !important;
    margin-left: 10px !important;
    vertical-align: middle !important;
}

/* =========================================================
   Spam Headline
========================================================= */

.landing-page.mail-services .text20 {
    background: #ffffff !important;
    padding: 72px 0 !important;
}

.landing-page.mail-services .text20 h2 {
    max-width: 820px !important;
    margin: 0 auto !important;
    font-size: 32px !important;
    line-height: 1.32 !important;
    color: var(--gh-navy) !important;
}

.landing-page.mail-services .text20 h2::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 18px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

/* =========================================================
   Tabs / How It Works
========================================================= */

.landing-page.mail-services .tabs.light-grey-bg {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    padding: 82px 0 !important;
}

.landing-page.mail-services .tabs .nav-tabs {
    border: 0 !important;
    justify-content: center !important;
    gap: 10px !important;
    margin-bottom: 0 !important;
}

.landing-page.mail-services .tabs .nav-tabs .nav-link {
    border: 1px solid #dceaf5 !important;
    background: #ffffff !important;
    color: #60758a !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 11px 18px !important;
}

.landing-page.mail-services .tabs .nav-tabs .nav-link:hover,
.landing-page.mail-services .tabs .nav-tabs .nav-link.active {
    background: linear-gradient(135deg, var(--gh-cyan), var(--gh-blue)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.landing-page.mail-services .responsive-tabs-sm-connector {
    display: none !important;
}

.landing-page.mail-services .tabs .tab-content {
    background: #ffffff !important;
    border: 1px solid #e2edf5 !important;
    border-radius: 22px !important;
    padding: 34px 36px !important;
    margin-top: 28px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.mail-services .tabs .tab-pane h3 {
    font-size: 25px !important;
    margin-bottom: 14px !important;
    color: var(--gh-navy) !important;
}

.landing-page.mail-services .tabs .tab-pane p {
    color: var(--gh-text) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

.landing-page.mail-services .benefits {
    background: #f4fbff !important;
    border: 1px solid #dceef8 !important;
    border-radius: 18px !important;
    padding: 26px 28px !important;
    margin-bottom: 28px !important;
}

.landing-page.mail-services .benefits h3 {
    margin-bottom: 20px !important;
}

.landing-page.mail-services .benefits .row > div {
    color: #40566e !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 12px !important;
    font-weight: 600 !important;
}

.landing-page.mail-services .benefits i.fa-check {
    color: #0eb67c !important;
    margin-right: 8px !important;
}

/* =========================================================
   Pricing / Get Started
========================================================= */

.landing-page.mail-services .get-started {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.18), transparent 26%),
        linear-gradient(135deg, #0e2f50 0%, #0b74d1 100%) !important;
    padding: 82px 0 !important;
    color: #ffffff !important;
    position: relative !important;
}

.landing-page.mail-services .get-started::before {
    content: "" !important;
    position: absolute !important;
    right: -130px !important;
    top: -130px !important;
    width: 350px !important;
    height: 350px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.08) !important;
}

.landing-page.mail-services .get-started .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.mail-services .get-started form {
    margin: 0 !important;
}

.landing-page.mail-services .get-started h2 {
    color: #ffffff !important;
    font-size: 34px !important;
    margin-bottom: 18px !important;
}

.landing-page.mail-services .get-started h2::after {
    content: "" !important;
    display: block !important;
    width: 72px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: var(--gh-cyan) !important;
}

.landing-page.mail-services .get-started h4 {
    color: rgba(255,255,255,0.90) !important;
    font-size: 16px !important;
    margin-bottom: 12px !important;
}

.landing-page.mail-services .choose-product {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.landing-page.mail-services .choose-product .btn {
    margin: 0 !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1px solid rgba(255,255,255,0.22) !important;
    color: #ffffff !important;
}

.landing-page.mail-services .choose-product .btn.active,
.landing-page.mail-services .choose-product .btn:hover {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: var(--gh-blue) !important;
}

.landing-page.mail-services .additional-options {
    margin-top: 12px !important;
}

.landing-page.mail-services .additional-options label {
    color: rgba(255,255,255,0.86) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.landing-page.mail-services .additional-options input {
    margin-right: 8px !important;
}

.landing-page.mail-services .get-started .price {
    display: none;
    color: #ffffff !important;
    font-size: 32px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

.landing-page.mail-services .get-started .price:first-of-type {
    display: inline-block;
}

.landing-page.mail-services .btn-order-now {
    min-width: 160px !important;
    background: #ffffff !important;
    color: var(--gh-blue) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16) !important;
}

.landing-page.mail-services .btn-order-now:hover {
    background: var(--gh-cyan) !important;
    color: #ffffff !important;
}

.landing-page.mail-services .ssl-currency-selector {
    max-width: 260px !important;
    width: 100% !important;
    background: #ffffff !important;
}

/* =========================================================
   FAQ
========================================================= */

.landing-page.mail-services .faq {
    background: #ffffff !important;
    padding: 86px 0 76px !important;
}

.landing-page.mail-services .faq h3 {
    color: var(--gh-navy) !important;
    font-size: 34px !important;
    margin-bottom: 42px !important;
}

.landing-page.mail-services .faq h3::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.mail-services .faq .row > div {
    margin-bottom: 24px !important;
}

.landing-page.mail-services .faq h4 {
    color: var(--gh-navy) !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    margin-bottom: 9px !important;
}

.landing-page.mail-services .faq p {
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.landing-page.mail-services .faq hr {
    border-top: 1px solid #e1edf5 !important;
    margin: 22px 0 !important;
}

/* =========================================================
   Bottom Logo
========================================================= */

.landing-page.mail-services > .content-block:last-child {
    background: #ffffff !important;
    padding: 58px 0 !important;
}

.landing-page.mail-services > .content-block:last-child img {
    max-width: 300px !important;
    width: 100% !important;
    height: auto !important;
    opacity: 0.85 !important;
}

/* =========================================================
   Fix small template typo impact
   Template has: <h3{lang key=... instead of <h3>
   CSS cannot fully repair invalid HTML, but spacing is handled above.
========================================================= */

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.mail-services .container {
        max-width: 960px !important;
    }

    .landing-page.mail-services .hero h2 {
        font-size: 38px !important;
    }

    .landing-page.mail-services .navbar-nav .nav-item {
        min-width: 150px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.mail-services .container {
        max-width: 720px !important;
    }

    .landing-page.mail-services .hero {
        min-height: auto !important;
        padding: 88px 0 98px !important;
    }

    .landing-page.mail-services .hero .container {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .landing-page.mail-services .hero h2,
    .landing-page.mail-services .hero h3 {
        text-align: center !important;
        max-width: 100% !important;
    }

    .landing-page.mail-services .hero h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.mail-services .navbar-nav .nav-item {
        min-width: auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .landing-page.mail-services .content-block,
    .landing-page.mail-services .tabs.light-grey-bg,
    .landing-page.mail-services .get-started,
    .landing-page.mail-services .faq {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.mail-services .get-started .text-right {
        text-align: left !important;
        margin-top: 26px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.mail-services .hero {
        padding: 70px 0 80px !important;
    }

    .landing-page.mail-services .hero h2 {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }

    .landing-page.mail-services .hero h3 {
        font-size: 16px !important;
    }

    .landing-page.mail-services .navbar-toggler {
        margin: 10px auto !important;
        border-radius: 10px !important;
        border-color: #d7e7f4 !important;
    }

    .landing-page.mail-services .navbar-nav {
        padding: 10px 0 !important;
    }

    .landing-page.mail-services .navbar-nav .nav-link {
        padding: 12px 18px !important;
    }

    .landing-page.mail-services .text20 h2,
    .landing-page.mail-services .get-started h2,
    .landing-page.mail-services .faq h3 {
        font-size: 27px !important;
    }

    .landing-page.mail-services .tabs .tab-content {
        padding: 26px 22px !important;
    }

    .landing-page.mail-services .benefits {
        padding: 22px 20px !important;
    }

    .landing-page.mail-services .powered-by {
        text-align: center !important;
    }
}

@media (max-width: 575px) {
    .landing-page.mail-services .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.mail-services .hero {
        padding: 58px 0 68px !important;
    }

    .landing-page.mail-services .hero h2 {
        font-size: 24px !important;
    }

    .landing-page.mail-services .hero h3 {
        font-size: 15px !important;
    }

    .landing-page.mail-services .content-block,
    .landing-page.mail-services .tabs.light-grey-bg,
    .landing-page.mail-services .get-started,
    .landing-page.mail-services .faq {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.mail-services p {
        font-size: 14px !important;
    }

    .landing-page.mail-services .product-options .item {
        padding: 26px 20px 24px !important;
    }

    .landing-page.mail-services .choose-product {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .landing-page.mail-services .choose-product .btn {
        width: 100% !important;
    }

    .landing-page.mail-services .get-started .price {
        font-size: 26px !important;
    }

    .landing-page.mail-services .btn-order-now {
        width: 100% !important;
    }

    .landing-page.mail-services > .content-block:last-child img {
        max-width: 230px !important;
    }
}




/* =========================================================
   GiddyHost - 360 Monitoring Page Redesign
   Scope: .landing-page.site-monitoring
   If your wrapper class is different, replace it globally.
========================================================= */

.landing-page.site-monitoring {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;

    --mon-purple: #8d4de8;
    --mon-pink: #cf2d78;
    --mon-light: #eef5ff;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.site-monitoring *,
.landing-page.site-monitoring *::before,
.landing-page.site-monitoring *::after {
    box-sizing: border-box !important;
}

.landing-page.site-monitoring .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.site-monitoring h1,
.landing-page.site-monitoring h2,
.landing-page.site-monitoring h3,
.landing-page.site-monitoring h4,
.landing-page.site-monitoring h5,
.landing-page.site-monitoring h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.site-monitoring p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.site-monitoring a {
    text-decoration: none !important;
}

/* =========================================================
   Buttons / Inputs
========================================================= */

.landing-page.site-monitoring .btn,
.landing-page.site-monitoring button {
    transition: all 0.22s ease !important;
}

.landing-page.site-monitoring .btn-primary,
.landing-page.site-monitoring .btn-start,
.landing-page.site-monitoring .btn-order,
.landing-page.site-monitoring .btn-get-started,
.landing-page.site-monitoring .btn-monitor {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 26px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.site-monitoring .btn-primary:hover,
.landing-page.site-monitoring .btn-start:hover,
.landing-page.site-monitoring .btn-order:hover,
.landing-page.site-monitoring .btn-get-started:hover,
.landing-page.site-monitoring .btn-monitor:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

.landing-page.site-monitoring .btn-secondary,
.landing-page.site-monitoring .btn-default {
    background: #eef8fe !important;
    border: 1px solid #d7eaf7 !important;
    border-radius: 999px !important;
    color: var(--gh-blue) !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 10px 22px !important;
}

.landing-page.site-monitoring .btn-secondary:hover,
.landing-page.site-monitoring .btn-default:hover {
    background: var(--gh-blue) !important;
    border-color: var(--gh-blue) !important;
    color: #ffffff !important;
}

.landing-page.site-monitoring .form-control,
.landing-page.site-monitoring input[type="text"],
.landing-page.site-monitoring input[type="url"],
.landing-page.site-monitoring select {
    min-height: 46px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    color: #31526f !important;
    font-size: 14px !important;
    box-shadow: none !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.landing-page.site-monitoring .form-control:focus,
.landing-page.site-monitoring input[type="text"]:focus,
.landing-page.site-monitoring input[type="url"]:focus,
.landing-page.site-monitoring select:focus {
    border-color: var(--gh-cyan) !important;
    box-shadow: 0 0 0 3px rgba(37, 185, 232, 0.16) !important;
    outline: none !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.site-monitoring .hero {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.18), transparent 28%),
        radial-gradient(circle at 85% 24%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    min-height: 440px !important;
    padding: 88px 0 70px !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.site-monitoring .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 25px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.site-monitoring .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 20px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.site-monitoring .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 40px !important;
    flex-wrap: wrap !important;
}

.landing-page.site-monitoring .hero .hero-content,
.landing-page.site-monitoring .hero .content-left {
    flex: 1 1 420px !important;
    max-width: 500px !important;
}

.landing-page.site-monitoring .hero .hero-visual,
.landing-page.site-monitoring .hero .content-right {
    flex: 1 1 420px !important;
    text-align: center !important;
}

.landing-page.site-monitoring .hero .hero-visual img,
.landing-page.site-monitoring .hero .content-right img {
    max-width: 100% !important;
    height: auto !important;
}

.landing-page.site-monitoring .hero h1,
.landing-page.site-monitoring .hero h2 {
    font-size: 44px !important;
    line-height: 1.12 !important;
    color: var(--gh-navy) !important;
    margin-bottom: 16px !important;
    font-weight: 800 !important;
}

.landing-page.site-monitoring .hero h1::after,
.landing-page.site-monitoring .hero h2::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.site-monitoring .hero p,
.landing-page.site-monitoring .hero h3 {
    color: #4f6479 !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
    font-weight: 500 !important;
    margin-bottom: 18px !important;
}

.landing-page.site-monitoring .hero .monitor-form,
.landing-page.site-monitoring .hero form {
    margin-top: 22px !important;
    padding: 18px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,0.72) !important;
    border: 1px solid rgba(255,255,255,0.8) !important;
    box-shadow: 0 18px 42px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.site-monitoring .hero .monitor-form .row,
.landing-page.site-monitoring .hero form .row {
    align-items: center !important;
}

.landing-page.site-monitoring .hero .monitor-form .btn,
.landing-page.site-monitoring .hero form .btn {
    width: 100% !important;
}

/* =========================================================
   Sticky / Tab Nav
========================================================= */

.landing-page.site-monitoring .nav-tabs-wrapper,
.landing-page.site-monitoring .monitor-tabs-wrapper {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.site-monitoring .nav-tabs-wrapper .container,
.landing-page.site-monitoring .monitor-tabs-wrapper .container {
    display: flex !important;
    justify-content: center !important;
}

.landing-page.site-monitoring .monitor-tabs,
.landing-page.site-monitoring .nav-tabs {
    width: 100% !important;
    border: 0 !important;
    justify-content: center !important;
    gap: 0 !important;
}

.landing-page.site-monitoring .monitor-tabs .nav-item,
.landing-page.site-monitoring .nav-tabs .nav-item {
    min-width: 230px !important;
    text-align: center !important;
}

.landing-page.site-monitoring .monitor-tabs .nav-link,
.landing-page.site-monitoring .nav-tabs .nav-link {
    border: 0 !important;
    border-radius: 0 !important;
    color: #60758a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 16px 24px !important;
    background: transparent !important;
    position: relative !important;
}

.landing-page.site-monitoring .monitor-tabs .nav-link.active,
.landing-page.site-monitoring .nav-tabs .nav-link.active {
    background: #f4fbff !important;
    color: var(--gh-blue) !important;
}

.landing-page.site-monitoring .monitor-tabs .nav-link.active::after,
.landing-page.site-monitoring .nav-tabs .nav-link.active::after {
    content: "" !important;
    position: absolute !important;
    left: 20px !important;
    right: 20px !important;
    bottom: 0 !important;
    height: 4px !important;
    border-radius: 999px 999px 0 0 !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

/* =========================================================
   Generic Section
========================================================= */

.landing-page.site-monitoring .content-block,
.landing-page.site-monitoring section {
    padding: 86px 0 !important;
}

.landing-page.site-monitoring .section-title,
.landing-page.site-monitoring .section-heading,
.landing-page.site-monitoring section h2 {
    font-size: 34px !important;
    line-height: 1.25 !important;
    margin-bottom: 16px !important;
    color: var(--gh-navy) !important;
    text-align: center !important;
}

.landing-page.site-monitoring .section-title::after,
.landing-page.site-monitoring .section-heading::after,
.landing-page.site-monitoring section h2.text-center::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.site-monitoring .section-subtitle,
.landing-page.site-monitoring section .lead {
    max-width: 760px !important;
    margin: 0 auto 22px !important;
    text-align: center !important;
    color: var(--gh-muted) !important;
}

/* =========================================================
   Intro / What is Monitoring
========================================================= */

.landing-page.site-monitoring .intro-section,
.landing-page.site-monitoring .what-is-monitoring,
.landing-page.site-monitoring .overview-section {
    background: #ffffff !important;
}

.landing-page.site-monitoring .intro-section .screenshot,
.landing-page.site-monitoring .what-is-monitoring img,
.landing-page.site-monitoring .overview-section img {
    display: block !important;
    max-width: 100% !important;
    margin: 0 auto 30px !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.site-monitoring .feature-icons-row,
.landing-page.site-monitoring .intro-features,
.landing-page.site-monitoring .mini-feature-row {
    margin-top: 34px !important;
}

.landing-page.site-monitoring .mini-feature,
.landing-page.site-monitoring .intro-feature,
.landing-page.site-monitoring .feature-icons-row .item {
    text-align: center !important;
    padding: 14px 10px !important;
}

.landing-page.site-monitoring .mini-feature .icon,
.landing-page.site-monitoring .intro-feature .icon,
.landing-page.site-monitoring .feature-icons-row .item .icon {
    width: 72px !important;
    height: 72px !important;
    margin: 0 auto 16px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, rgba(37, 185, 232, 0.12), rgba(11, 116, 209, 0.08)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 10px 24px rgba(16, 48, 82, 0.06) !important;
}

.landing-page.site-monitoring .mini-feature .icon i,
.landing-page.site-monitoring .intro-feature .icon i,
.landing-page.site-monitoring .feature-icons-row .item .icon i {
    color: var(--gh-blue) !important;
    font-size: 28px !important;
}

.landing-page.site-monitoring .mini-feature h4,
.landing-page.site-monitoring .intro-feature h4,
.landing-page.site-monitoring .feature-icons-row .item h4 {
    font-size: 17px !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
    color: var(--gh-navy) !important;
}

.landing-page.site-monitoring .mini-feature p,
.landing-page.site-monitoring .intro-feature p,
.landing-page.site-monitoring .feature-icons-row .item p {
    font-size: 13px !important;
    line-height: 1.7 !important;
    color: var(--gh-muted) !important;
    margin-bottom: 0 !important;
}

.landing-page.site-monitoring .center-cta {
    text-align: center !important;
    margin-top: 30px !important;
}

/* =========================================================
   Blue Feature Area
========================================================= */

.landing-page.site-monitoring .feature-section-blue,
.landing-page.site-monitoring .how-monitoring-helps,
.landing-page.site-monitoring .monitoring-benefits {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
}

.landing-page.site-monitoring .feature-panel,
.landing-page.site-monitoring .benefits-panel,
.landing-page.site-monitoring .white-panel {
    background: #ffffff !important;
    border: 1px solid #e2edf5 !important;
    border-radius: 24px !important;
    padding: 36px 34px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.site-monitoring .feature-panel .nav-tabs,
.landing-page.site-monitoring .benefits-panel .nav-tabs {
    justify-content: center !important;
    border-bottom: 0 !important;
    gap: 10px !important;
    margin-bottom: 24px !important;
}

.landing-page.site-monitoring .feature-panel .nav-link,
.landing-page.site-monitoring .benefits-panel .nav-link {
    border: 1px solid #dceaf5 !important;
    background: #ffffff !important;
    color: #60758a !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 11px 18px !important;
}

.landing-page.site-monitoring .feature-panel .nav-link.active,
.landing-page.site-monitoring .benefits-panel .nav-link.active {
    background: linear-gradient(135deg, var(--gh-cyan), var(--gh-blue)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.landing-page.site-monitoring .benefit-card,
.landing-page.site-monitoring .feature-card {
    height: 100% !important;
    text-align: center !important;
    padding: 18px 14px !important;
}

.landing-page.site-monitoring .benefit-card .icon,
.landing-page.site-monitoring .feature-card .icon {
    width: 74px !important;
    height: 74px !important;
    margin: 0 auto 14px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, rgba(37, 185, 232, 0.12), rgba(11, 116, 209, 0.08)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.site-monitoring .benefit-card .icon i,
.landing-page.site-monitoring .feature-card .icon i {
    color: var(--gh-blue) !important;
    font-size: 28px !important;
}

.landing-page.site-monitoring .benefit-card h4,
.landing-page.site-monitoring .feature-card h4 {
    font-size: 16px !important;
    margin-bottom: 8px !important;
}

.landing-page.site-monitoring .benefit-card p,
.landing-page.site-monitoring .feature-card p {
    font-size: 13px !important;
    color: var(--gh-muted) !important;
    line-height: 1.7 !important;
}

/* =========================================================
   Favorite App Icons Section
========================================================= */

.landing-page.site-monitoring .apps-section,
.landing-page.site-monitoring .app-alerts {
    background: #ffffff !important;
}

.landing-page.site-monitoring .apps-grid,
.landing-page.site-monitoring .integration-icons {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 20px 26px !important;
    margin-top: 28px !important;
}

.landing-page.site-monitoring .apps-grid .app-item,
.landing-page.site-monitoring .integration-icons .item {
    width: 72px !important;
    text-align: center !important;
}

.landing-page.site-monitoring .apps-grid .app-item img,
.landing-page.site-monitoring .integration-icons .item img {
    width: 42px !important;
    height: 42px !important;
    object-fit: contain !important;
    margin-bottom: 8px !important;
}

.landing-page.site-monitoring .apps-grid .app-item span,
.landing-page.site-monitoring .integration-icons .item span {
    display: block !important;
    font-size: 12px !important;
    color: var(--gh-muted) !important;
    font-weight: 700 !important;
}

/* =========================================================
   CTA Split Section
========================================================= */

.landing-page.site-monitoring .cta-split,
.landing-page.site-monitoring .monitor-communicate {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.20), transparent 26%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
}

.landing-page.site-monitoring .cta-split .container,
.landing-page.site-monitoring .monitor-communicate .container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 36px !important;
}

.landing-page.site-monitoring .cta-split .text-side,
.landing-page.site-monitoring .monitor-communicate .content-left {
    flex: 1 1 380px !important;
}

.landing-page.site-monitoring .cta-split .image-side,
.landing-page.site-monitoring .monitor-communicate .content-right {
    flex: 1 1 420px !important;
    text-align: center !important;
}

.landing-page.site-monitoring .cta-split .image-side img,
.landing-page.site-monitoring .monitor-communicate .content-right img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.site-monitoring .cta-split h2,
.landing-page.site-monitoring .monitor-communicate h2 {
    text-align: left !important;
    margin-bottom: 14px !important;
}

.landing-page.site-monitoring .cta-split h2::after,
.landing-page.site-monitoring .monitor-communicate h2::after {
    margin-left: 0 !important;
}

/* =========================================================
   Pricing Table
========================================================= */

.landing-page.site-monitoring .pricing-section,
.landing-page.site-monitoring #pricing {
    background: #ffffff !important;
}

.landing-page.site-monitoring .pricing-table-wrap {
    margin-top: 30px !important;
    background: #ffffff !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.site-monitoring table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
}

.landing-page.site-monitoring table thead th {
    background: #f7fbfe !important;
    color: var(--gh-navy) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    text-align: center !important;
    padding: 18px 12px !important;
    border-bottom: 1px solid #e3edf5 !important;
}

.landing-page.site-monitoring table thead th:first-child {
    text-align: left !important;
    padding-left: 22px !important;
}

.landing-page.site-monitoring table tbody td,
.landing-page.site-monitoring table tbody th {
    font-size: 13px !important;
    color: #486076 !important;
    padding: 14px 12px !important;
    border-bottom: 1px solid #edf3f8 !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.landing-page.site-monitoring table tbody th,
.landing-page.site-monitoring table tbody td:first-child {
    text-align: left !important;
    padding-left: 22px !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    background: #fbfdff !important;
}

.landing-page.site-monitoring table tbody tr:last-child td,
.landing-page.site-monitoring table tbody tr:last-child th {
    border-bottom: 0 !important;
}

.landing-page.site-monitoring .pricing-footer-row,
.landing-page.site-monitoring .plan-cta-row {
    display: grid !important;
    grid-template-columns: 1.3fr repeat(4, 1fr) !important;
    gap: 0 !important;
    border-top: 1px solid #e3edf5 !important;
    background: #ffffff !important;
}

.landing-page.site-monitoring .pricing-footer-row > div,
.landing-page.site-monitoring .plan-cta-row > div {
    padding: 18px 14px 22px !important;
    text-align: center !important;
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.site-monitoring .pricing-footer-row > div:first-child,
.landing-page.site-monitoring .plan-cta-row > div:first-child {
    text-align: left !important;
    padding-left: 22px !important;
    font-weight: 800 !important;
    color: var(--gh-navy) !important;
    background: #fbfdff !important;
}

.landing-page.site-monitoring .pricing-footer-row > div:last-child,
.landing-page.site-monitoring .plan-cta-row > div:last-child {
    border-right: 0 !important;
}

.landing-page.site-monitoring .plan-price {
    font-size: 18px !important;
    font-weight: 900 !important;
    color: var(--gh-blue) !important;
    margin-bottom: 10px !important;
}

/* =========================================================
   FAQ
========================================================= */

.landing-page.site-monitoring .faq-section,
.landing-page.site-monitoring #faq {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
}

.landing-page.site-monitoring .faq-grid,
.landing-page.site-monitoring .faq-list {
    margin-top: 30px !important;
}

.landing-page.site-monitoring .faq-item,
.landing-page.site-monitoring .card.faq,
.landing-page.site-monitoring .accordion .card {
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 28px rgba(16, 48, 82, 0.06) !important;
    overflow: hidden !important;
    margin-bottom: 16px !important;
}

.landing-page.site-monitoring .faq-item .faq-question,
.landing-page.site-monitoring .accordion .card-header {
    background: #ffffff !important;
    border-bottom: 0 !important;
    padding: 0 !important;
}

.landing-page.site-monitoring .faq-item .faq-question button,
.landing-page.site-monitoring .accordion .btn-link,
.landing-page.site-monitoring .accordion .card-header button {
    width: 100% !important;
    text-align: left !important;
    padding: 18px 20px !important;
    color: var(--gh-navy) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    position: relative !important;
}

.landing-page.site-monitoring .faq-item .faq-question button::after,
.landing-page.site-monitoring .accordion .btn-link::after,
.landing-page.site-monitoring .accordion .card-header button::after {
    content: "+" !important;
    position: absolute !important;
    right: 20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    color: var(--gh-blue) !important;
    font-weight: 700 !important;
}

.landing-page.site-monitoring .faq-item .faq-answer,
.landing-page.site-monitoring .accordion .card-body {
    padding: 0 20px 18px !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* =========================================================
   Bottom brand logo
========================================================= */

.landing-page.site-monitoring .brand-logo-section,
.landing-page.site-monitoring .logo-section {
    background: #ffffff !important;
    padding: 52px 0 !important;
    text-align: center !important;
}

.landing-page.site-monitoring .brand-logo-section img,
.landing-page.site-monitoring .logo-section img {
    max-width: 260px !important;
    width: 100% !important;
    opacity: 0.92 !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.site-monitoring .container {
        max-width: 960px !important;
    }

    .landing-page.site-monitoring .hero h1,
    .landing-page.site-monitoring .hero h2 {
        font-size: 38px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.site-monitoring .container {
        max-width: 720px !important;
    }

    .landing-page.site-monitoring .hero {
        min-height: auto !important;
        padding: 78px 0 62px !important;
    }

    .landing-page.site-monitoring .hero .container,
    .landing-page.site-monitoring .cta-split .container,
    .landing-page.site-monitoring .monitor-communicate .container {
        flex-direction: column !important;
    }

    .landing-page.site-monitoring .hero .hero-content,
    .landing-page.site-monitoring .hero .content-left,
    .landing-page.site-monitoring .hero .hero-visual,
    .landing-page.site-monitoring .hero .content-right {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }

    .landing-page.site-monitoring .hero h1,
    .landing-page.site-monitoring .hero h2,
    .landing-page.site-monitoring .hero p,
    .landing-page.site-monitoring .hero h3 {
        text-align: center !important;
    }

    .landing-page.site-monitoring .hero h1::after,
    .landing-page.site-monitoring .hero h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.site-monitoring .cta-split h2,
    .landing-page.site-monitoring .monitor-communicate h2 {
        text-align: center !important;
    }

    .landing-page.site-monitoring .cta-split h2::after,
    .landing-page.site-monitoring .monitor-communicate h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.site-monitoring .pricing-footer-row,
    .landing-page.site-monitoring .plan-cta-row {
        grid-template-columns: 1fr !important;
    }

    .landing-page.site-monitoring .pricing-footer-row > div,
    .landing-page.site-monitoring .plan-cta-row > div {
        border-right: 0 !important;
        border-bottom: 1px solid #edf3f8 !important;
        text-align: center !important;
        padding-left: 14px !important;
    }

    .landing-page.site-monitoring .pricing-footer-row > div:first-child,
    .landing-page.site-monitoring .plan-cta-row > div:first-child {
        text-align: center !important;
        background: #f7fbfe !important;
        padding-left: 14px !important;
    }

    .landing-page.site-monitoring .pricing-footer-row > div:last-child,
    .landing-page.site-monitoring .plan-cta-row > div:last-child {
        border-bottom: 0 !important;
    }

    .landing-page.site-monitoring .monitor-tabs .nav-item,
    .landing-page.site-monitoring .nav-tabs .nav-item {
        min-width: auto !important;
        flex: 1 1 50% !important;
    }
}

@media (max-width: 767px) {
    .landing-page.site-monitoring .hero h1,
    .landing-page.site-monitoring .hero h2 {
        font-size: 30px !important;
        line-height: 1.18 !important;
    }

    .landing-page.site-monitoring .hero p,
    .landing-page.site-monitoring .hero h3 {
        font-size: 16px !important;
    }

    .landing-page.site-monitoring .content-block,
    .landing-page.site-monitoring section {
        padding: 68px 0 !important;
    }

    .landing-page.site-monitoring .feature-panel,
    .landing-page.site-monitoring .benefits-panel,
    .landing-page.site-monitoring .white-panel {
        padding: 26px 22px !important;
    }

    .landing-page.site-monitoring .section-title,
    .landing-page.site-monitoring .section-heading,
    .landing-page.site-monitoring section h2 {
        font-size: 27px !important;
    }

    .landing-page.site-monitoring table {
        display: block !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 575px) {
    .landing-page.site-monitoring .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.site-monitoring .hero {
        padding: 60px 0 54px !important;
    }

    .landing-page.site-monitoring .hero h1,
    .landing-page.site-monitoring .hero h2 {
        font-size: 24px !important;
    }

    .landing-page.site-monitoring .hero .monitor-form,
    .landing-page.site-monitoring .hero form {
        padding: 16px !important;
        border-radius: 16px !important;
    }

    .landing-page.site-monitoring .content-block,
    .landing-page.site-monitoring section {
        padding: 54px 0 !important;
    }

    .landing-page.site-monitoring p {
        font-size: 14px !important;
    }

    .landing-page.site-monitoring .monitor-tabs .nav-item,
    .landing-page.site-monitoring .nav-tabs .nav-item {
        flex: 1 1 100% !important;
    }

    .landing-page.site-monitoring .monitor-tabs .nav-link,
    .landing-page.site-monitoring .nav-tabs .nav-link {
        padding: 13px 16px !important;
    }
}




/* =========================================================
   GiddyHost - 360 Monitoring Final Redesign
   Scope: .landing-page.threesixtymonitoring
   Add AFTER store.css
========================================================= */

.landing-page.threesixtymonitoring {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.threesixtymonitoring *,
.landing-page.threesixtymonitoring *::before,
.landing-page.threesixtymonitoring *::after {
    box-sizing: border-box !important;
}

.landing-page.threesixtymonitoring .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.threesixtymonitoring h1,
.landing-page.threesixtymonitoring h2,
.landing-page.threesixtymonitoring h3,
.landing-page.threesixtymonitoring h4,
.landing-page.threesixtymonitoring h5,
.landing-page.threesixtymonitoring h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.threesixtymonitoring h1 {
    font-size: 42px !important;
    line-height: 1.16 !important;
    margin-bottom: 16px !important;
}

.landing-page.threesixtymonitoring h2 {
    font-size: 34px !important;
    line-height: 1.25 !important;
    margin-bottom: 16px !important;
}

.landing-page.threesixtymonitoring .p-tagline,
.landing-page.threesixtymonitoring p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.threesixtymonitoring a {
    text-decoration: none !important;
}

/* =========================================================
   Buttons / Forms
========================================================= */

.landing-page.threesixtymonitoring .btn {
    transition: all 0.22s ease !important;
}

.landing-page.threesixtymonitoring .btn-primary,
.landing-page.threesixtymonitoring .btn-search {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 26px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.threesixtymonitoring .btn-primary:hover,
.landing-page.threesixtymonitoring .btn-search:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

.landing-page.threesixtymonitoring .form-control {
    min-height: 46px !important;
    border-radius: 999px !important;
    border: 1px solid #d7e7f4 !important;
    background: #ffffff !important;
    color: #31526f !important;
    font-size: 14px !important;
    box-shadow: none !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.landing-page.threesixtymonitoring .form-control:focus {
    border-color: var(--gh-cyan) !important;
    box-shadow: 0 0 0 3px rgba(37, 185, 232, 0.16) !important;
}

.landing-page.threesixtymonitoring .btn-search {
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* =========================================================
   Hero Header
========================================================= */

.landing-page.threesixtymonitoring .section-header {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.16), transparent 28%),
        radial-gradient(circle at 88% 26%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    background-size: cover !important;
    background-position: center !important;
    padding: 88px 0 78px !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.threesixtymonitoring .section-header::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 30px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.threesixtymonitoring .section-header::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 30px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.threesixtymonitoring .section-header .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.threesixtymonitoring .section-header .row {
    align-items: center !important;
}

.landing-page.threesixtymonitoring .section-header .img-logo {
    max-width: 190px !important;
    width: auto !important;
    height: auto !important;
    margin-bottom: 28px !important;
}

.landing-page.threesixtymonitoring .section-header h1::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.threesixtymonitoring .section-header .p-tagline {
    max-width: 460px !important;
    margin-bottom: 22px !important;
    font-size: 17px !important;
}

.landing-page.threesixtymonitoring .section-header form {
    max-width: 560px !important;
    padding: 16px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,0.78) !important;
    border: 1px solid rgba(255,255,255,0.90) !important;
    box-shadow: 0 18px 42px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.threesixtymonitoring .section-header .form-group {
    margin-bottom: 0 !important;
}

.landing-page.threesixtymonitoring .section-header .col-6.d-none img {
    max-width: 100% !important;
    height: auto !important;
    filter: drop-shadow(0 22px 34px rgba(16, 48, 82, 0.13)) !important;
}

/* =========================================================
   Primary Website / Server Tabs
========================================================= */

.landing-page.threesixtymonitoring .nav-primary {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.threesixtymonitoring .nav-primary .nav {
    justify-content: center !important;
}

.landing-page.threesixtymonitoring .nav-primary .nav-item {
    min-width: 260px !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .nav-primary .nav-link {
    border-radius: 0 !important;
    color: #60758a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 18px 26px !important;
    background: transparent !important;
    position: relative !important;
}

.landing-page.threesixtymonitoring .nav-primary .nav-link.active,
.landing-page.threesixtymonitoring .nav-primary .nav-link:hover {
    color: var(--gh-blue) !important;
    background: #f4fbff !important;
}

.landing-page.threesixtymonitoring .nav-primary .nav-link.active::after {
    content: "" !important;
    position: absolute !important;
    left: 26px !important;
    right: 26px !important;
    bottom: 0 !important;
    height: 4px !important;
    border-radius: 999px 999px 0 0 !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

/* =========================================================
   Common Sections
========================================================= */

.landing-page.threesixtymonitoring section {
    padding: 86px 0 !important;
}

.landing-page.threesixtymonitoring section h2 {
    text-align: center !important;
    margin-bottom: 18px !important;
}

.landing-page.threesixtymonitoring section h2::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.threesixtymonitoring section .p-tagline {
    max-width: 760px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

/* =========================================================
   Discover Section
========================================================= */

.landing-page.threesixtymonitoring .section-discover {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .div-heading-container {
    max-width: 820px !important;
    margin: 0 auto 50px !important;
}

.landing-page.threesixtymonitoring .div-heading-container > img {
    max-width: 560px !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto 30px !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.threesixtymonitoring .div-heading-text h2 {
    margin-bottom: 12px !important;
}

.landing-page.threesixtymonitoring .row-features {
    justify-content: center !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features > div {
    margin-bottom: 26px !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features > div > .row {
    height: 100% !important;
    margin: 0 !important;
    padding: 28px 22px !important;
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    transition: all 0.22s ease !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features > div > .row:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(37, 185, 232, 0.44) !important;
    box-shadow: 0 20px 44px rgba(16, 48, 82, 0.11) !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features img {
    max-width: 72px !important;
    height: auto !important;
    margin-bottom: 14px !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features p {
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    margin-bottom: 0 !important;
}

.landing-page.threesixtymonitoring .section-discover .row-features strong {
    color: var(--gh-navy) !important;
}

/* =========================================================
   Features Section
========================================================= */

.landing-page.threesixtymonitoring .section-features {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .nav-secondary {
    margin: 30px auto 32px !important;
}

.landing-page.threesixtymonitoring .nav-secondary .nav {
    justify-content: center !important;
    gap: 10px !important;
}

.landing-page.threesixtymonitoring .nav-secondary .nav-link {
    border: 1px solid #dceaf5 !important;
    background: #ffffff !important;
    color: #60758a !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 11px 20px !important;
}

.landing-page.threesixtymonitoring .nav-secondary .nav-link.active,
.landing-page.threesixtymonitoring .nav-secondary .nav-link:hover {
    background: linear-gradient(135deg, var(--gh-cyan), var(--gh-blue)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.landing-page.threesixtymonitoring .section-features .tab-content > .tab-pane {
    background: #ffffff !important;
    border: 1px solid #e2edf5 !important;
    border-radius: 24px !important;
    padding: 38px 36px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.threesixtymonitoring .section-features .row-features > div {
    margin-bottom: 28px !important;
}

.landing-page.threesixtymonitoring .section-features .row-features > div > .row {
    height: 100% !important;
    padding: 24px 16px !important;
    border-radius: 18px !important;
    transition: all 0.22s ease !important;
}

.landing-page.threesixtymonitoring .section-features .row-features > div > .row:hover {
    background: #f4fbff !important;
}

.landing-page.threesixtymonitoring .section-features .row-features img {
    max-width: 76px !important;
    height: auto !important;
    margin-bottom: 16px !important;
}

.landing-page.threesixtymonitoring .section-features .row-features span {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin-bottom: 9px !important;
}

.landing-page.threesixtymonitoring .section-features .row-features p {
    color: var(--gh-muted) !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
    margin-bottom: 6px !important;
}

/* =========================================================
   Notifications Section
========================================================= */

.landing-page.threesixtymonitoring .section-notifications {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .row-notifications {
    justify-content: center !important;
    margin-top: 34px !important;
}

.landing-page.threesixtymonitoring .row-notifications > div {
    margin-bottom: 22px !important;
}

.landing-page.threesixtymonitoring .row-notifications .col-3 {
    margin-bottom: 22px !important;
}

.landing-page.threesixtymonitoring .col-brand-img {
    min-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.threesixtymonitoring .col-brand-img img {
    max-width: 46px !important;
    max-height: 46px !important;
    object-fit: contain !important;
    transition: all 0.22s ease !important;
}

.landing-page.threesixtymonitoring .row-notifications .col-3:hover img {
    transform: translateY(-3px) !important;
}

.landing-page.threesixtymonitoring .row-notifications p {
    color: var(--gh-muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin-bottom: 0 !important;
}

/* =========================================================
   Monitoring CTA Section
========================================================= */

.landing-page.threesixtymonitoring .section-monitoring {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.18), transparent 26%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    background-size: cover !important;
    background-position: center !important;
    position: relative !important;
}

.landing-page.threesixtymonitoring .section-monitoring .row {
    align-items: center !important;
}

.landing-page.threesixtymonitoring .section-monitoring h2 {
    text-align: left !important;
}

.landing-page.threesixtymonitoring .section-monitoring h2::after {
    margin-left: 0 !important;
}

.landing-page.threesixtymonitoring .section-monitoring .p-tagline {
    text-align: left !important;
    margin-left: 0 !important;
    max-width: 470px !important;
}

.landing-page.threesixtymonitoring .section-monitoring img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.12) !important;
}

/* Server revenue boxes */
.landing-page.threesixtymonitoring .row-revenue {
    justify-content: center !important;
    margin: 34px 0 !important;
}

.landing-page.threesixtymonitoring .row-revenue > div {
    margin-bottom: 22px !important;
}

.landing-page.threesixtymonitoring .row-revenue > div > .row {
    height: 100% !important;
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 26px 18px !important;
    text-align: center !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
}

.landing-page.threesixtymonitoring .row-revenue .col-12:first-child,
.landing-page.threesixtymonitoring .row-revenue .col-12:nth-child(4) {
    color: var(--gh-blue) !important;
    font-size: 28px !important;
    font-weight: 900 !important;
}

/* =========================================================
   Pricing Section
========================================================= */

.landing-page.threesixtymonitoring .section-pricing {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .div-pricing-container {
    max-width: 1080px !important;
    margin: 36px auto 0 !important;
    display: flex !important;
    align-items: stretch !important;
    background: #ffffff !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 24px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.threesixtymonitoring .div-feature-labels,
.landing-page.threesixtymonitoring .div-feature-values {
    float: none !important;
    margin: 0 !important;
    flex: 1 0 170px !important;
    min-width: 170px !important;
    border-right: 1px solid #e8f0f7 !important;
    background: #ffffff !important;
}

.landing-page.threesixtymonitoring .div-feature-labels {
    flex: 1.25 0 230px !important;
    min-width: 230px !important;
    background: #f7fbfe !important;
}

.landing-page.threesixtymonitoring .div-feature-values:last-child {
    border-right: 0 !important;
}

.landing-page.threesixtymonitoring .div-feature-labels:not(:first-child) {
    display: none !important;
}

.landing-page.threesixtymonitoring .div-feature-labels .header,
.landing-page.threesixtymonitoring .div-feature-values .header {
    min-height: 128px !important;
    padding: 22px 16px !important;
    border-bottom: 1px solid #e8f0f7 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%) !important;
}

.landing-page.threesixtymonitoring .div-feature-labels .header {
    background: #f7fbfe !important;
}

.landing-page.threesixtymonitoring .div-feature-labels .header::before {
    content: "Features" !important;
    display: inline-flex !important;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    background: rgba(37, 185, 232, 0.12) !important;
    color: var(--gh-blue) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

.landing-page.threesixtymonitoring .div-plan-name {
    color: var(--gh-navy) !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
}

.landing-page.threesixtymonitoring .div-heading-border {
    width: 42px !important;
    height: 3px !important;
    margin: 10px auto !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.threesixtymonitoring .div-plan-tagline {
    color: var(--gh-muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

.landing-page.threesixtymonitoring .div-feature-labels ul,
.landing-page.threesixtymonitoring .div-feature-values ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.landing-page.threesixtymonitoring .div-feature-labels li,
.landing-page.threesixtymonitoring .div-feature-values li {
    min-height: 44px !important;
    padding: 12px 14px !important;
    border-bottom: 1px solid #e8f0f7 !important;
    color: #42586f !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.landing-page.threesixtymonitoring .div-feature-labels li {
    justify-content: flex-start !important;
    text-align: left !important;
    color: var(--gh-navy) !important;
    background: #f7fbfe !important;
    font-weight: 900 !important;
}

.landing-page.threesixtymonitoring .div-feature-values li i.fa-times {
    color: #c9d4df !important;
}

.landing-page.threesixtymonitoring .div-feature-values li:not(:has(.fa-times)) {
    color: var(--gh-blue) !important;
}

.landing-page.threesixtymonitoring .div-feature-label-starting,
.landing-page.threesixtymonitoring .div-feature-price {
    min-height: 58px !important;
    padding: 17px 14px !important;
    border-bottom: 1px solid #e8f0f7 !important;
    color: var(--gh-blue) !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.landing-page.threesixtymonitoring .div-feature-label-starting {
    justify-content: flex-start !important;
    text-align: left !important;
    color: var(--gh-navy) !important;
    background: #f7fbfe !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
}

.landing-page.threesixtymonitoring .div-feature-order {
    padding: 20px 14px 24px !important;
}

.landing-page.threesixtymonitoring .div-feature-order .btn {
    width: 100% !important;
    max-width: 130px !important;
    padding: 10px 16px !important;
    font-size: 12px !important;
}

.landing-page.threesixtymonitoring .p-pricing-cta {
    margin-top: 28px !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
}

.landing-page.threesixtymonitoring .p-pricing-cta a {
    color: var(--gh-blue) !important;
    font-weight: 900 !important;
}

/* =========================================================
   FAQ
========================================================= */

.landing-page.threesixtymonitoring .section-faq {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
}

.landing-page.threesixtymonitoring .section-faq .card {
    border: 1px solid var(--gh-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    margin-bottom: 16px !important;
    box-shadow: 0 12px 28px rgba(16, 48, 82, 0.06) !important;
    background: #ffffff !important;
}

.landing-page.threesixtymonitoring .section-faq .card-header {
    background: #ffffff !important;
    border: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

.landing-page.threesixtymonitoring .section-faq .btn-link {
    width: 100% !important;
    padding: 18px 52px 18px 20px !important;
    text-align: left !important;
    color: var(--gh-navy) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.landing-page.threesixtymonitoring .section-faq .card-header > i {
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: #eef8fe !important;
    color: var(--gh-blue) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.landing-page.threesixtymonitoring .section-faq .card-body {
    padding: 0 20px 20px !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* =========================================================
   Modal
========================================================= */

.landing-page.threesixtymonitoring .modal-results .modal-content {
    border: 0 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: 0 24px 60px rgba(16, 48, 82, 0.22) !important;
}

.landing-page.threesixtymonitoring .modal-results .modal-header {
    background: linear-gradient(135deg, var(--gh-cyan), var(--gh-blue)) !important;
    color: #ffffff !important;
    border: 0 !important;
    padding: 20px 24px !important;
}

.landing-page.threesixtymonitoring .modal-results .modal-title {
    color: #ffffff !important;
    font-weight: 900 !important;
}

.landing-page.threesixtymonitoring .modal-results .close {
    color: #ffffff !important;
    opacity: 1 !important;
}

.landing-page.threesixtymonitoring .modal-results .modal-body {
    background-color: #f7fbfe !important;
    background-size: cover !important;
    padding: 34px 28px !important;
}

.landing-page.threesixtymonitoring .div-results {
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 22px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.threesixtymonitoring .container {
        max-width: 960px !important;
    }

    .landing-page.threesixtymonitoring h1 {
        font-size: 38px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.threesixtymonitoring .container {
        max-width: 720px !important;
    }

    .landing-page.threesixtymonitoring .section-header {
        text-align: center !important;
        padding: 74px 0 70px !important;
    }

    .landing-page.threesixtymonitoring .section-header h1::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.threesixtymonitoring .section-header .p-tagline {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.threesixtymonitoring .section-header form {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.threesixtymonitoring .img-full {
        max-width: 100% !important;
        height: auto !important;
        margin: 22px auto !important;
    }

    .landing-page.threesixtymonitoring section {
        padding: 68px 0 !important;
    }

    .landing-page.threesixtymonitoring .section-monitoring h2,
    .landing-page.threesixtymonitoring .section-monitoring .p-tagline {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.threesixtymonitoring .section-monitoring h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.threesixtymonitoring .nav-primary .nav-item {
        min-width: 50% !important;
    }
}

@media (max-width: 767px) {
    .landing-page.threesixtymonitoring h1 {
        font-size: 30px !important;
    }

    .landing-page.threesixtymonitoring h2 {
        font-size: 27px !important;
    }

    .landing-page.threesixtymonitoring .section-header {
        padding: 62px 0 58px !important;
    }

    .landing-page.threesixtymonitoring .section-header form {
        padding: 14px !important;
    }

    .landing-page.threesixtymonitoring .section-header .form-row > div {
        margin-bottom: 10px !important;
    }

    .landing-page.threesixtymonitoring .section-header .form-row > div:last-child {
        margin-bottom: 0 !important;
    }

    .landing-page.threesixtymonitoring .btn-search {
        width: 100% !important;
    }

    .landing-page.threesixtymonitoring .section-features .tab-content > .tab-pane {
        padding: 28px 22px !important;
    }

    .landing-page.threesixtymonitoring .div-pricing-container {
        border-radius: 18px !important;
    }

    .landing-page.threesixtymonitoring .div-feature-labels,
    .landing-page.threesixtymonitoring .div-feature-values {
        min-width: 160px !important;
    }
}

@media (max-width: 575px) {
    .landing-page.threesixtymonitoring .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.threesixtymonitoring h1 {
        font-size: 25px !important;
    }

    .landing-page.threesixtymonitoring h2 {
        font-size: 24px !important;
    }

    .landing-page.threesixtymonitoring .p-tagline,
    .landing-page.threesixtymonitoring p {
        font-size: 14px !important;
    }

    .landing-page.threesixtymonitoring section {
        padding: 54px 0 !important;
    }

    .landing-page.threesixtymonitoring .nav-primary .nav-item {
        min-width: 100% !important;
    }

    .landing-page.threesixtymonitoring .nav-primary .nav-link {
        padding: 14px 18px !important;
    }

    .landing-page.threesixtymonitoring .section-discover .row-features > div {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
    }

    .landing-page.threesixtymonitoring .row-notifications .col-3 {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        margin-left: 0 !important;
    }

    .landing-page.threesixtymonitoring .div-feature-labels,
    .landing-page.threesixtymonitoring .div-feature-values {
        min-width: 150px !important;
    }
}





/* =========================================================
   GiddyHost - NordVPN WHMCS Page Final Redesign
   Scope: .landing-page.nordvpn
   Add AFTER store.css
========================================================= */

.landing-page.nordvpn {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-dark: #081b35;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;
    --gh-success: #20b86d;
    --gh-danger: #ff4f67;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.nordvpn *,
.landing-page.nordvpn *::before,
.landing-page.nordvpn *::after {
    box-sizing: border-box !important;
}

.landing-page.nordvpn .container {
    max-width: 1140px !important;
}

/* =========================================================
   Global Typography
========================================================= */

.landing-page.nordvpn h1,
.landing-page.nordvpn h2,
.landing-page.nordvpn h3,
.landing-page.nordvpn h4,
.landing-page.nordvpn h5,
.landing-page.nordvpn h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.nordvpn h1 {
    font-size: 34px !important;
    line-height: 1.22 !important;
    margin-bottom: 18px !important;
}

.landing-page.nordvpn h2 {
    font-size: 22px !important;
    line-height: 1.45 !important;
    margin-bottom: 18px !important;
}

.landing-page.nordvpn h3 {
    font-size: 20px !important;
    line-height: 1.35 !important;
}

.landing-page.nordvpn p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.nordvpn a {
    text-decoration: none !important;
}

.landing-page.nordvpn .blue {
    color: var(--gh-cyan) !important;
}

/* =========================================================
   Buttons
========================================================= */

.landing-page.nordvpn .btn {
    transition: all 0.22s ease !important;
}

.landing-page.nordvpn .btn-default,
.landing-page.nordvpn .btn-primary,
.landing-page.nordvpn .btn-get-nord {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    padding: 11px 28px !important;
    box-shadow: 0 12px 28px rgba(11, 116, 209, 0.26) !important;
}

.landing-page.nordvpn .btn-default:hover,
.landing-page.nordvpn .btn-primary:hover,
.landing-page.nordvpn .btn-get-nord:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 16px 34px rgba(11, 116, 209, 0.34) !important;
}

.landing-page.nordvpn .btn-get-deal {
    background: linear-gradient(135deg, var(--gh-danger) 0%, #e73552 100%) !important;
    box-shadow: 0 12px 28px rgba(255, 79, 103, 0.24) !important;
}

.landing-page.nordvpn .btn-get-deal:hover {
    background: linear-gradient(135deg, #e73552 0%, #c92b45 100%) !important;
    box-shadow: 0 16px 34px rgba(255, 79, 103, 0.32) !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.nordvpn .hero {
    background:
        radial-gradient(circle at 18% 18%, rgba(37, 185, 232, 0.18), transparent 27%),
        radial-gradient(circle at 86% 20%, rgba(11, 116, 209, 0.14), transparent 28%),
        linear-gradient(135deg, #061832 0%, #0b2343 52%, #102f55 100%) !important;
    padding: 70px 0 78px !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.nordvpn .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: -70px !important;
    width: 320px !important;
    height: 320px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.nordvpn .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -130px !important;
    bottom: -90px !important;
    width: 340px !important;
    height: 340px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.045) !important;
}

.landing-page.nordvpn .hero .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.nordvpn .hero-bg {
    min-height: auto !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

.landing-page.nordvpn .hero .row {
    align-items: center !important;
}

.landing-page.nordvpn .hero-image {
    max-width: 245px !important;
    width: auto !important;
    height: auto !important;
    margin-bottom: 24px !important;
}

.landing-page.nordvpn .hero h1 {
    color: #ffffff !important;
    font-size: 42px !important;
    line-height: 1.13 !important;
    margin-bottom: 14px !important;
    max-width: 520px !important;
}

.landing-page.nordvpn .hero h1::after {
    content: "" !important;
    display: block !important;
    width: 88px !important;
    height: 4px !important;
    margin-top: 18px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.nordvpn .hero h2 {
    color: rgba(255, 255, 255, 0.84) !important;
    font-size: 18px !important;
    line-height: 1.7 !important;
    font-weight: 500 !important;
    max-width: 560px !important;
}

.landing-page.nordvpn .hero .col-6 img {
    max-width: 100% !important;
    height: auto !important;
    filter: drop-shadow(0 24px 50px rgba(0, 0, 0, 0.32)) !important;
}

.landing-page.nordvpn .hero .col-12 {
    margin-top: 30px !important;
    text-align: center !important;
}

.landing-page.nordvpn .hero .col-12 p {
    color: rgba(255, 255, 255, 0.78) !important;
    margin-bottom: 10px !important;
}

.landing-page.nordvpn .hero .col-12 img {
    max-width: 340px !important;
    height: auto !important;
    margin: 8px auto 14px !important;
    opacity: 0.94 !important;
}

.landing-page.nordvpn .hero .guarantee {
    color: var(--gh-cyan) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.35px !important;
    margin-top: 12px !important;
}

/* =========================================================
   Shared Feature Sections
========================================================= */

.landing-page.nordvpn .feature {
    padding: 86px 0 !important;
    position: relative !important;
}

.landing-page.nordvpn .feature > .container > h1,
.landing-page.nordvpn .feature .container > .row:first-child h1,
.landing-page.nordvpn .feature.faq h1 {
    text-align: center !important;
}

.landing-page.nordvpn .feature > .container > h1::after,
.landing-page.nordvpn .feature .container > .row:first-child h1::after,
.landing-page.nordvpn .feature.faq h1::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.nordvpn .line-break {
    height: 1px !important;
    background: var(--gh-border) !important;
    padding: 0 !important;
}

/* =========================================================
   Top Icon Feature Section
========================================================= */

.landing-page.nordvpn .feature.icon {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.nordvpn .feature.icon .row > div:not(.col-12) {
    margin-bottom: 26px !important;
}

.landing-page.nordvpn .feature.icon .row > div:not(.col-12) {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.landing-page.nordvpn .feature.icon .row > div:not(.col-12) > img {
    max-width: 72px !important;
    height: auto !important;
    margin-bottom: 16px !important;
    filter: drop-shadow(0 10px 18px rgba(11, 116, 209, 0.10)) !important;
}

.landing-page.nordvpn .feature.icon .row > div:not(.col-12) p {
  
    margin-left: auto !important;
    margin-right: auto !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
}

/* Cards for second icon section */
.landing-page.nordvpn .feature.icon .col-lg-4 {
    margin-bottom: 28px !important;
}

.landing-page.nordvpn .feature.icon .col-lg-4 {
    text-align: center !important;
}

.landing-page.nordvpn .feature.icon .col-lg-4 h3 {
    font-size: 19px !important;
    margin-bottom: 10px !important;
}

/* =========================================================
   Comparison Section
========================================================= */

.landing-page.nordvpn .feature.comparison {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    text-align: center !important;
}

.landing-page.nordvpn .comparison-container {
    max-width: 960px !important;
    margin: 34px auto 0 !important;
    background: #ffffff !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 22px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
}

.landing-page.nordvpn .comparison-container > .row {
    min-width: 850px !important;
}

.landing-page.nordvpn .comparison-container .row.no-gutters {
    margin: 0 !important;
}

.landing-page.nordvpn .comparison-container .col-2 {
    border-right: 1px solid #e8f0f7 !important;
    border-bottom: 1px solid #e8f0f7 !important;
    min-height: 54px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
}

.landing-page.nordvpn .comparison-container .col-2:first-child {
    background: #f7fbfe !important;
    justify-content: flex-start !important;
    text-align: left !important;
}

.landing-page.nordvpn .comparison-container .col-2:last-child {
    border-right: 0 !important;
}

.landing-page.nordvpn .comparison-container span {
    display: block !important;
    width: 100% !important;
    padding: 11px 12px !important;
    color: #42586f !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    text-align: center !important;
}

.landing-page.nordvpn .comparison-container .col-2:first-child span {
    color: var(--gh-navy) !important;
    font-weight: 900 !important;
    text-align: left !important;
}

.landing-page.nordvpn .comparison-container img {
    max-width: 96px !important;
    max-height: 32px !important;
    object-fit: contain !important;
}

.landing-page.nordvpn .comparison-container img[src*="tick-yes"] {
    width: 18px !important;
    height: 18px !important;
}

.landing-page.nordvpn .comparison-container img[src*="tick-no"] {
    width: 18px !important;
    height: 18px !important;
    opacity: 0.65 !important;
}

.landing-page.nordvpn .comparison-container .btn-get-deal {
    padding: 8px 14px !important;
    font-size: 12px !important;
}

.landing-page.nordvpn .comparison-note {
    max-width: 760px !important;
    margin: 18px auto 0 !important;
    color: var(--gh-muted) !important;
    font-size: 13px !important;
}

.landing-page.nordvpn .comparison-note a {
    color: var(--gh-blue) !important;
    font-weight: 800 !important;
}

/* =========================================================
   Threat Protection
========================================================= */

.landing-page.nordvpn .feature.threat {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.nordvpn .feature.threat .row:first-child p {
    max-width: 720px !important;
    margin: 0 auto 34px !important;
    color: var(--gh-muted) !important;
}

.landing-page.nordvpn .feature.threat .row:nth-child(2) > div {
    margin-bottom: 28px !important;
}

.landing-page.nordvpn .feature.threat .row:nth-child(2) > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.landing-page.nordvpn .feature.threat .row:nth-child(2) img {
    max-width: 220px !important;
    width: 100% !important;
    height: auto !important;
    margin-bottom: 18px !important;
}

.landing-page.nordvpn .feature.threat .row:nth-child(2) p {
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    padding: 22px 20px !important;
    min-height: 120px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    color: var(--gh-muted) !important;
}

.landing-page.nordvpn .feature.threat strong {
    color: var(--gh-navy) !important;
}

/* =========================================================
   Device Section
========================================================= */

.landing-page.nordvpn .feature.device {
    background: linear-gradient(180deg, #f7fbfe 0%, #ffffff 100%) !important;
}

.landing-page.nordvpn .feature.device .row {
    align-items: center !important;
}

.landing-page.nordvpn .feature.device img {
    max-width: 100% !important;
    height: auto !important;
}

.landing-page.nordvpn .feature.device .col-lg-6:first-child img {
    border-radius: 20px !important;
    filter: drop-shadow(0 18px 34px rgba(16, 48, 82, 0.10)) !important;
}

.landing-page.nordvpn .feature.device h3 {
    color: var(--gh-navy) !important;
    font-size: 22px !important;
    margin-bottom: 10px !important;
}

.landing-page.nordvpn .feature.device p {
    color: var(--gh-muted) !important;
    margin-bottom: 24px !important;
}

.landing-page.nordvpn .feature.device .col-lg-6:last-child img {
    max-width: 280px !important;
    opacity: 0.9 !important;
}

/* =========================================================
   World / Server Network Section
========================================================= */

.landing-page.nordvpn .feature.world {
    background:
        radial-gradient(circle at 20% 28%, rgba(37, 185, 232, 0.13), transparent 26%),
        linear-gradient(135deg, #061832 0%, #0b2343 100%) !important;
    color: #ffffff !important;
}

.landing-page.nordvpn .feature.world h1,
.landing-page.nordvpn .feature.world p {
    color: #ffffff !important;
}

.landing-page.nordvpn .world-image {
    max-width: 100% !important;
    height: auto !important;
    opacity: 0.92 !important;
}

.landing-page.nordvpn .world-desc {
    padding: 20px 0 !important;
}

.landing-page.nordvpn .world-desc h1 {
    text-align: left !important;
}

.landing-page.nordvpn .world-desc h1::after {
    margin-left: 0 !important;
    background: linear-gradient(90deg, var(--gh-cyan), #ffffff) !important;
}

.landing-page.nordvpn .world-tagline {
    color: rgba(255, 255, 255, 0.78) !important;
    max-width: 560px !important;
}

.landing-page.nordvpn .world-data {
    margin: 26px 0 8px !important;
}

.landing-page.nordvpn .world-data > div {
    margin-bottom: 18px !important;
}

.landing-page.nordvpn .world-data > div p:first-child {
    color: rgba(255, 255, 255, 0.68) !important;
    font-size: 13px !important;
    margin-bottom: 5px !important;
}

.landing-page.nordvpn .world-data > div p:nth-child(2) {
    color: #ffffff !important;
    font-size: 32px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
}

.landing-page.nordvpn .world-data img {
    max-height: 34px !important;
    width: auto !important;
}

/* =========================================================
   Logo Strip
========================================================= */

.landing-page.nordvpn .feature.logo {
    padding: 30px 0 !important;
    background: #f3f7fb !important;
    border-top: 1px solid var(--gh-border) !important;
    border-bottom: 1px solid var(--gh-border) !important;
}

.landing-page.nordvpn .feature.logo img {
    max-width: 120px !important;
    max-height: 34px !important;
    width: auto !important;
    height: auto !important;
    opacity: 0.55 !important;
    filter: grayscale(1) !important;
    transition: all 0.22s ease !important;
    margin: 10px auto !important;
    display: block !important;
}

.landing-page.nordvpn .feature.logo img:hover {
    opacity: 0.95 !important;
    filter: grayscale(0) !important;
}

/* =========================================================
   Security Section
========================================================= */

.landing-page.nordvpn .feature.security {
    background: #ffffff !important;
}

.landing-page.nordvpn .feature.security .row:first-child {
    align-items: center !important;
    margin-bottom: 44px !important;
}

.landing-page.nordvpn .feature.security h1 {
    text-align: left !important;
}

.landing-page.nordvpn .feature.security h1::after {
    margin-left: 0 !important;
}

.landing-page.nordvpn .feature.security p {
    color: var(--gh-muted) !important;
}

.landing-page.nordvpn .feature.security strong {
    color: var(--gh-navy) !important;
}

.landing-page.nordvpn .feature.security img {
    max-width: 100% !important;
    height: auto !important;
    filter: drop-shadow(0 18px 34px rgba(16, 48, 82, 0.10)) !important;
}

.landing-page.nordvpn .feature.security .row:last-child > div {
    margin-bottom: 24px !important;
}

.landing-page.nordvpn .feature.security .row:last-child h3 {
    font-size: 20px !important;
    color: var(--gh-navy) !important;
    margin-bottom: 8px !important;
}

/* =========================================================
   Use Cases
========================================================= */

.landing-page.nordvpn .feature.use {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
    text-align: center !important;
}

.landing-page.nordvpn .feature.use > .container > .row:first-of-type p {
    max-width: 850px !important;
    margin: 0 auto 36px !important;
    color: var(--gh-muted) !important;
}

.landing-page.nordvpn .feature.use strong {
    color: var(--gh-navy) !important;
}

.landing-page.nordvpn .feature.use .headers h3,
.landing-page.nordvpn .feature.use .d-lg-none h3 {
    color: var(--gh-navy) !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
}

.landing-page.nordvpn .feature.use .d-none.d-lg-block .row:not(.headers) > div,
.landing-page.nordvpn .feature.use .d-lg-none > div {
    margin-bottom: 28px !important;
}

.landing-page.nordvpn .feature.use .d-none.d-lg-block .row:not(.headers) > div {
   
    padding: 22px 20px !important;
}

.landing-page.nordvpn .feature.use .d-none.d-lg-block .row:not(.headers) p,
.landing-page.nordvpn .feature.use .d-lg-none p {
    color: var(--gh-muted) !important;
    font-size: 14px !important;
	    margin-bottom: 0 !important;
}

/* =========================================================
   Pricing Section
========================================================= */

.landing-page.nordvpn .feature.pricing {
    background: #ffffff !important;
    text-align: center !important;
}

.landing-page.nordvpn .feature.pricing .row {
    justify-content: center !important;
    margin-top: 34px !important;
}

.landing-page.nordvpn .feature.pricing .row > div {
    margin-bottom: 28px !important;
}

.landing-page.nordvpn .feature.pricing .row > div {
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.08) !important;
    padding: 32px 24px !important;
    text-align: center !important;
    max-width: 340px !important;
    transition: all 0.22s ease !important;
}

.landing-page.nordvpn .feature.pricing .row > div:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(37, 185, 232, 0.42) !important;
    box-shadow: 0 22px 50px rgba(16, 48, 82, 0.12) !important;
}

.landing-page.nordvpn .billing-cycle {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    margin-bottom: 8px !important;
}

.landing-page.nordvpn .billing-price {
    color: var(--gh-blue) !important;
    font-size: 34px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    margin-bottom: 6px !important;
}

.landing-page.nordvpn .billing-save {
    min-height: 24px !important;
    color: var(--gh-success) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    margin-bottom: 20px !important;
}

.landing-page.nordvpn .feature.pricing .btn-default {
    width: 100% !important;
    max-width: 180px !important;
   margin-bottom: 0 !important;
}

/* =========================================================
   FAQ
========================================================= */

.landing-page.nordvpn .feature.faq {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
}

.landing-page.nordvpn .feature.faq .accordion {
    margin-top: 32px !important;
}

.landing-page.nordvpn .feature.faq .card {
    border: 1px solid var(--gh-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    margin-bottom: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(16, 48, 82, 0.06) !important;
}

.landing-page.nordvpn .feature.faq .card-header {
    background: #ffffff !important;
    border: 0 !important;
    padding: 0 !important;
}

.landing-page.nordvpn .feature.faq .card-header h2 {
    margin: 0 !important;
}

.landing-page.nordvpn .feature.faq .btn-link {
    width: 100% !important;
    padding: 18px 54px 18px 22px !important;
    color: var(--gh-navy) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    background: #ffffff !important;
    border: 0 !important;
    box-shadow: none !important;
    position: relative !important;
}

.landing-page.nordvpn .feature.faq .btn-link:hover {
    background: #f4fbff !important;
    color: var(--gh-blue) !important;
}

.landing-page.nordvpn .feature.faq .btn-link i {
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: #eef8fe !important;
    color: var(--gh-blue) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
}

.landing-page.nordvpn .feature.faq .card-body {
    padding: 0 22px 22px !important;
    color: var(--gh-muted) !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.nordvpn .container {
        max-width: 960px !important;
    }

    .landing-page.nordvpn .hero h1 {
        font-size: 38px !important;
    }

    .landing-page.nordvpn h1 {
        font-size: 31px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.nordvpn .container {
        max-width: 720px !important;
    }

    .landing-page.nordvpn .hero {
        text-align: center !important;
        padding: 72px 0 70px !important;
    }

    .landing-page.nordvpn .hero h1,
    .landing-page.nordvpn .hero h2 {
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.nordvpn .hero h1::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.nordvpn .feature {
        padding: 68px 0 !important;
    }

    .landing-page.nordvpn .feature.security h1,
    .landing-page.nordvpn .world-desc h1 {
        text-align: center !important;
    }

    .landing-page.nordvpn .feature.security h1::after,
    .landing-page.nordvpn .world-desc h1::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.nordvpn .world-desc {
        text-align: center !important;
    }

    .landing-page.nordvpn .feature.security .row:first-child {
        text-align: center !important;
    }

    .landing-page.nordvpn .comparison-container > .row {
        min-width: 820px !important;
    }
}

@media (max-width: 767px) {
    .landing-page.nordvpn .hero {
        padding: 60px 0 62px !important;
    }

    .landing-page.nordvpn .hero-image {
        max-width: 210px !important;
    }

    .landing-page.nordvpn .hero h1 {
        font-size: 30px !important;
    }

    .landing-page.nordvpn .hero h2 {
        font-size: 16px !important;
    }

    .landing-page.nordvpn h1 {
        font-size: 27px !important;
    }

    .landing-page.nordvpn h2 {
        font-size: 20px !important;
    }

    .landing-page.nordvpn .feature {
        padding: 56px 0 !important;
    }

    .landing-page.nordvpn .feature.threat .row:nth-child(2) p {
        min-height: auto !important;
    }

    .landing-page.nordvpn .world-data > div p:nth-child(2) {
        font-size: 26px !important;
    }

    .landing-page.nordvpn .feature.pricing .row > div {
        max-width: 100% !important;
    }
}

@media (max-width: 575px) {
    .landing-page.nordvpn .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.nordvpn .hero h1 {
        font-size: 25px !important;
    }

    .landing-page.nordvpn .hero .col-12 img {
        max-width: 260px !important;
    }

    .landing-page.nordvpn h1 {
        font-size: 24px !important;
    }

    .landing-page.nordvpn p {
        font-size: 14px !important;
    }

    .landing-page.nordvpn .comparison-container {
        border-radius: 16px !important;
    }

    .landing-page.nordvpn .billing-price {
        font-size: 30px !important;
    }

    .landing-page.nordvpn .btn-default,
    .landing-page.nordvpn .btn-primary,
    .landing-page.nordvpn .btn-get-nord {
        width: 100% !important;
    }
}





/* =========================================================
   GiddyHost - SSL Certificates Page Final Redesign
   Scope: .landing-page.ssl
   Add AFTER store.css
========================================================= */

.landing-page.ssl {
    --gh-cyan: #25b9e8;
    --gh-blue: #0b74d1;
    --gh-blue-dark: #0e2f50;
    --gh-navy: #102a43;
    --gh-text: #40566e;
    --gh-muted: #64788f;
    --gh-border: #e6eef6;
    --gh-soft: #f7fbfe;
    --gh-hero: #eefdff;
    --gh-warning: #f5a400;
    --gh-success: #21a870;

    font-family: inherit !important;
    background: #ffffff !important;
    color: var(--gh-navy) !important;
    overflow: hidden !important;
}

.landing-page.ssl *,
.landing-page.ssl *::before,
.landing-page.ssl *::after {
    box-sizing: border-box !important;
}

.landing-page.ssl .container {
    max-width: 1140px !important;
}

/* =========================================================
   Typography
========================================================= */

.landing-page.ssl h1,
.landing-page.ssl h2,
.landing-page.ssl h3,
.landing-page.ssl h4,
.landing-page.ssl h5,
.landing-page.ssl h6 {
    font-family: inherit !important;
    color: var(--gh-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px !important;
}

.landing-page.ssl h2 {
    font-size: 34px !important;
    line-height: 1.25 !important;
    margin-bottom: 18px !important;
}

.landing-page.ssl h3 {
    font-size: 24px !important;
    line-height: 1.35 !important;
}

.landing-page.ssl h4 {
    font-size: 18px !important;
    line-height: 1.45 !important;
}

.landing-page.ssl p {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

.landing-page.ssl a {
    color: var(--gh-blue) !important;
    text-decoration: none !important;
    transition: all 0.22s ease !important;
}

.landing-page.ssl a:hover {
    color: #075aa4 !important;
}

/* =========================================================
   Buttons
========================================================= */

.landing-page.ssl .btn {
    border-radius: 999px !important;
    font-weight: 800 !important;
    transition: all 0.22s ease !important;
}

.landing-page.ssl .btn-primary,
.landing-page.ssl .btn-success,
.landing-page.ssl .btn-default {
    background: linear-gradient(135deg, var(--gh-cyan) 0%, var(--gh-blue) 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
    padding: 11px 24px !important;
    font-size: 14px !important;
    box-shadow: 0 10px 24px rgba(11, 116, 209, 0.24) !important;
}

.landing-page.ssl .btn-primary:hover,
.landing-page.ssl .btn-success:hover,
.landing-page.ssl .btn-default:hover {
    background: linear-gradient(135deg, var(--gh-blue) 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 30px rgba(11, 116, 209, 0.32) !important;
}

/* =========================================================
   Hero
========================================================= */

.landing-page.ssl .hero {
    background:
        radial-gradient(circle at 18% 22%, rgba(37, 185, 232, 0.16), transparent 28%),
        radial-gradient(circle at 85% 24%, rgba(11, 116, 209, 0.10), transparent 30%),
        linear-gradient(180deg, #eefdff 0%, #f7fdff 100%) !important;
    min-height: 360px !important;
  
    position: relative !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
}

.landing-page.ssl .hero::before {
    content: "" !important;
    position: absolute !important;
    left: -120px !important;
    top: 35px !important;
    width: 280px !important;
    height: 280px !important;
    border-radius: 50% !important;
    background: rgba(37, 185, 232, 0.10) !important;
}

.landing-page.ssl .hero::after {
    content: "" !important;
    position: absolute !important;
    right: -120px !important;
    bottom: 35px !important;
    width: 260px !important;
    height: 260px !important;
    border-radius: 50% !important;
    background: rgba(11, 116, 209, 0.08) !important;
}

.landing-page.ssl .hero .container {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 55px !important;
    flex-wrap: wrap !important;
}

.landing-page.ssl .hero h2 {
    margin: 0 !important;
    color: var(--gh-navy) !important;
    font-size: 42px !important;
    line-height: 1.15 !important;
    text-align: left !important;
    font-weight: 800 !important;
}

.landing-page.ssl .hero h2::after {
    content: "" !important;
    display: block !important;
    width: 86px !important;
    height: 4px !important;
    margin-top: 16px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

.landing-page.ssl .hero h3 {
    max-width: 520px !important;
    margin: 0 !important;
    color: #4f6479 !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
    font-weight: 500 !important;
    text-align: left !important;
}

/* =========================================================
   Validation Level Cards
========================================================= */

.landing-page.ssl .validation-levels {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.20), transparent 26%),
        linear-gradient(135deg, #0e2f50 0%, #0b74d1 100%) !important;
    padding: 78px 0 72px !important;
    color: #ffffff !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.ssl .validation-levels::before {
    content: "" !important;
    position: absolute !important;
    right: -130px !important;
    top: -130px !important;
    width: 350px !important;
    height: 350px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.08) !important;
}

.landing-page.ssl .validation-levels .container {
    position: relative !important;
    z-index: 2 !important;
}

.landing-page.ssl .validation-levels h3 {
    color: #ffffff !important;
    text-align: center !important;
    font-size: 30px !important;
    margin-bottom: 36px !important;
}

.landing-page.ssl .validation-levels h3::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 16px auto 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    opacity: 0.9 !important;
}

.landing-page.ssl .validation-levels .row {
    justify-content: center !important;
    align-items: stretch !important;
}

/* certificate-item.tpl common Bootstrap/card targeting */
.landing-page.ssl .validation-levels .row > div {
    margin-bottom: 24px !important;
}

.landing-page.ssl .validation-levels .card,
.landing-page.ssl .validation-levels .certificate-item,
.landing-page.ssl .validation-levels .product-card,
.landing-page.ssl .validation-levels .ssl-cert {
    height: 100% !important;
    background: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 22px 48px rgba(0,0,0,0.16) !important;
    transition: all 0.22s ease !important;
}

.landing-page.ssl .validation-levels .card:hover,
.landing-page.ssl .validation-levels .certificate-item:hover,
.landing-page.ssl .validation-levels .product-card:hover,
.landing-page.ssl .validation-levels .ssl-cert:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 28px 58px rgba(0,0,0,0.22) !important;
}

.landing-page.ssl .validation-levels .card-body,
.landing-page.ssl .validation-levels .panel-body {
    padding: 28px 24px !important;
    text-align: center !important;
}

.landing-page.ssl .validation-levels h4,
.landing-page.ssl .validation-levels h5 {
    color: var(--gh-navy) !important;
}

.landing-page.ssl .validation-levels p,
.landing-page.ssl .validation-levels li,
.landing-page.ssl .validation-levels span {
    color: var(--gh-muted) !important;
}

.landing-page.ssl .validation-levels img {
    max-width: 160px !important;
    height: auto !important;
    margin-bottom: 14px !important;
}

.landing-page.ssl .validation-levels ul {
    text-align: left !important;
    margin: 18px 0 !important;
    padding-left: 0 !important;
    list-style: none !important;
}

.landing-page.ssl .validation-levels li {
    position: relative !important;
    padding-left: 24px !important;
    margin-bottom: 8px !important;
    font-size: 13px !important;
}

.landing-page.ssl .validation-levels li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: var(--gh-blue) !important;
    font-weight: 900 !important;
}

.landing-page.ssl .validation-levels .help-me-choose {
    text-align: center !important;
    margin: 24px 0 0 !important;
    color: rgba(255,255,255,0.76) !important;
}

.landing-page.ssl .validation-levels .help-me-choose a {
    color: #ffffff !important;
    font-weight: 800 !important;
}

.landing-page.ssl .validation-levels .help-me-choose a:hover {
    color: #d9f7ff !important;
}

/* =========================================================
   SSL Navigation
========================================================= */

.landing-page.ssl .navbar,
.landing-page.ssl .store-ssl-nav,
.landing-page.ssl .ssl-nav {
    background: #ffffff !important;
    border-top: 1px solid #e9f2f8 !important;
    border-bottom: 1px solid #e9f2f8 !important;
    box-shadow: 0 8px 22px rgba(16, 48, 82, 0.04) !important;
}

.landing-page.ssl .navbar-nav {
    justify-content: center !important;
    width: 100% !important;
}

.landing-page.ssl .navbar-nav .nav-item {
    min-width: 160px !important;
    text-align: center !important;
}

.landing-page.ssl .navbar-nav .nav-link {
    color: #60758a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    padding: 16px 18px !important;
}

.landing-page.ssl .navbar-nav .nav-link:hover,
.landing-page.ssl .navbar-nav .nav-link.active {
    color: var(--gh-blue) !important;
    background: #f4fbff !important;
}

/* =========================================================
   Content Blocks
========================================================= */

.landing-page.ssl .content-block {
    padding: 84px 0 !important;
}

.landing-page.ssl .content-block.standout {
    background: #ffffff !important;
}

.landing-page.ssl .content-block h2::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin-top: 16px !important;
    margin-bottom: 22px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--gh-cyan), var(--gh-blue)) !important;
}

/* =========================================================
   What is SSL
========================================================= */

.landing-page.ssl .what-is-ssl {
    background: #ffffff !important;
}

.landing-page.ssl .what-is-ssl img.float-md-right {
    max-width: 280px !important;
    height: auto !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.10) !important;
}

.landing-page.ssl .what-is-ssl ul {
    list-style: none !important;
    margin: 24px 0 !important;
    padding: 0 !important;
}

.landing-page.ssl .what-is-ssl ul li {
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    margin-bottom: 10px !important;
}

.landing-page.ssl .what-is-ssl ul li i {
    color: var(--gh-success) !important;
    margin-right: 8px !important;
}

/* =========================================================
   SSL Benefits
========================================================= */

.landing-page.ssl .ssl-benefits {
    background: #ffffff !important;
    padding-top: 40px !important;
}

.landing-page.ssl .ssl-benefits h4 {
    color: var(--gh-text) !important;
    font-weight: 700 !important;
    margin-bottom: 18px !important;
}

.landing-page.ssl .ssl-benefits .row {
    justify-content: center !important;
    margin-top: 36px !important;
}

.landing-page.ssl .ssl-benefits .row > div {
    text-align: center !important;
    color: var(--gh-muted) !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-bottom: 24px !important;
    font-weight: 700 !important;
}

.landing-page.ssl .ssl-benefits .row > div i {
    width: 68px !important;
    height: 68px !important;
    margin: 0 auto 14px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, rgba(37,185,232,0.12), rgba(11,116,209,0.08)) !important;
    color: var(--gh-blue) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 27px !important;
}

/* =========================================================
   Browser Warning
========================================================= */

.landing-page.ssl .standout-1 {
    background: linear-gradient(135deg, #f5a400 0%, #ffb423 100%) !important;
    padding: 76px 0 0 !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
}

.landing-page.ssl .standout-1 h3 {
    color: #ffffff !important;
    font-size: 30px !important;
    margin-bottom: 28px !important;
}

.landing-page.ssl .browser-image img {
    max-width: 620px !important;
    width: 100% !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 20px 46px rgba(0,0,0,0.16) !important;
}

.landing-page.ssl .browser-notice {
    background: #ffffff !important;
    padding: 0 0 70px !important;
}

.landing-page.ssl .browser-notice .wrapper-container {
    max-width: 520px !important;
    margin: -78px auto 0 !important;
    position: relative !important;
    z-index: 3 !important;
}

.landing-page.ssl .browser-notice .wrapper {
    background: #ffffff !important;
    border: 1px solid #edf3f8 !important;
    border-radius: 18px !important;
    padding: 32px 28px !important;
    box-shadow: 0 18px 44px rgba(16, 48, 82, 0.12) !important;
    color: var(--gh-text) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

.landing-page.ssl .browser-notice .wrapper img {
    display: block !important;
    max-width: 92px !important;
    margin: 0 auto 16px !important;
}

/* =========================================================
   Promo Strip
========================================================= */

.landing-page.ssl .competitive-upgrade-promo {
    background:
        radial-gradient(circle at 18% 25%, rgba(37, 185, 232, 0.18), transparent 26%),
        linear-gradient(135deg, #0e2f50 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    text-align: center !important;
    padding: 46px 0 !important;
    font-size: 22px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
}

.landing-page.ssl .competitive-upgrade-promo .container {
    color: #ffffff !important;
}

/* =========================================================
   Secure Wildcard
========================================================= */

.landing-page.ssl .secure-wildcard {
    background: #ffffff !important;
}

.landing-page.ssl .secure-wildcard .row {
    align-items: center !important;
}

.landing-page.ssl .secure-wildcard ul {
    padding-left: 20px !important;
    color: var(--gh-text) !important;
}

.landing-page.ssl .secure-wildcard li {
    margin-bottom: 6px !important;
    color: var(--gh-text) !important;
}

.landing-page.ssl .quote-section {
    background: #f7fbfe !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 20px !important;
    padding: 30px 26px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.06) !important;
    text-align: center !important;
}

.landing-page.ssl .google-quote {
    display: block !important;
    color: var(--gh-navy) !important;
    font-size: 20px !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
}

.landing-page.ssl .quote-section p {
    font-size: 13px !important;
    color: var(--gh-muted) !important;
}

.landing-page.ssl .quote-section img {
    max-width: 140px !important;
    height: auto !important;
}

/* =========================================================
   Accordion Detailed Info
========================================================= */

.landing-page.ssl .detailed-info {
    background: linear-gradient(180deg, #f7fbfe 0%, #eef8fd 100%) !important;
}

.landing-page.ssl #sslAccordion {
    max-width: 980px !important;
}

.landing-page.ssl #sslAccordion .card {
    border: 1px solid var(--gh-border) !important;
    border-radius: 18px !important;
    margin-bottom: 14px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(16, 48, 82, 0.06) !important;
}

.landing-page.ssl #sslAccordion .card-header {
    background: #ffffff !important;
    border: 0 !important;
    padding: 0 !important;
}

.landing-page.ssl #sslAccordion .card-header h4 {
    margin: 0 !important;
    padding: 18px 24px !important;
    color: var(--gh-navy) !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 900 !important;
    cursor: pointer !important;
    position: relative !important;
}

.landing-page.ssl #sslAccordion .card-header:hover h4 {
    background: #f4fbff !important;
    color: var(--gh-blue) !important;
}

.landing-page.ssl #sslAccordion .arrow {
    display: inline-flex !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: #eef8fe !important;
    color: var(--gh-blue) !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 10px !important;
}

.landing-page.ssl #sslAccordion .card-body {
    border-top: 1px solid #edf3f8 !important;
    padding: 28px 30px !important;
    color: var(--gh-text) !important;
}

.landing-page.ssl #sslAccordion .card-body h4 {
    color: var(--gh-navy) !important;
    font-size: 18px !important;
    margin-bottom: 12px !important;
}

/* Help me choose cards */
.landing-page.ssl #sslAccordion .help-me-choose > div {
    margin-bottom: 26px !important;
}

.landing-page.ssl #sslAccordion .help-me-choose > div {
    border-right: 1px solid #edf3f8 !important;
}

.landing-page.ssl #sslAccordion .help-me-choose > div:last-child {
    border-right: 0 !important;
}

.landing-page.ssl #sslAccordion .help-me-choose h4 {
    text-align: center !important;
    color: var(--gh-navy) !important;
}

.landing-page.ssl #sslAccordion .help-me-choose ul {
    padding-left: 20px !important;
    min-height: 92px !important;
}

.landing-page.ssl #sslAccordion .help-me-choose li {
    margin-bottom: 6px !important;
    color: var(--gh-text) !important;
    font-size: 14px !important;
}

.landing-page.ssl #sslAccordion .help-me-choose .ideal {
    background: #f4fbff !important;
    border: 1px solid #dceef8 !important;
    border-radius: 14px !important;
    padding: 14px !important;
    min-height: 76px !important;
    color: var(--gh-navy) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
}

.landing-page.ssl #sslAccordion .help-me-choose img {
    display: block !important;
    max-height: 150px !important;
    margin: 16px auto !important;
}

.landing-page.ssl #sslAccordion .ssl-types-expl {
    color: var(--gh-muted) !important;
    font-size: 13px !important;
    min-height: 72px !important;
}

/* View all certificate list */
.landing-page.ssl .ssl-certs-all {
    list-style: none !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
}

.landing-page.ssl .ssl-certs-all li {
    background: #ffffff !important;
    border: 1px solid var(--gh-border) !important;
    border-radius: 16px !important;
    padding: 22px !important;
    margin-bottom: 14px !important;
    box-shadow: 0 10px 24px rgba(16, 48, 82, 0.05) !important;
}

.landing-page.ssl .ssl-certs-all li.featured {
    border-color: rgba(37,185,232,0.46) !important;
    box-shadow: 0 14px 34px rgba(11,116,209,0.10) !important;
}

.landing-page.ssl .ssl-certs-all h4 {
    color: var(--gh-navy) !important;
    margin-bottom: 8px !important;
}

.landing-page.ssl .ssl-certs-all .price {
    color: var(--gh-blue) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-align: center !important;
}

.landing-page.ssl .ssl-certs-all .price strong {
    font-size: 22px !important;
}

/* =========================================================
   Bottom SSL Logos Include
========================================================= */

.landing-page.ssl .ssl-logos,
.landing-page.ssl .logos,
.landing-page.ssl .brand-logos {
    background: #ffffff !important;
    padding: 50px 0 !important;
    text-align: center !important;
}

.landing-page.ssl .ssl-logos img,
.landing-page.ssl .logos img,
.landing-page.ssl .brand-logos img {
    max-height: 52px !important;
    width: auto !important;
    margin: 12px 24px !important;
    opacity: 0.86 !important;
    transition: all 0.22s ease !important;
}

.landing-page.ssl .ssl-logos img:hover,
.landing-page.ssl .logos img:hover,
.landing-page.ssl .brand-logos img:hover {
    opacity: 1 !important;
    transform: translateY(-2px) !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .landing-page.ssl .container {
        max-width: 960px !important;
    }

    .landing-page.ssl .hero h2 {
        font-size: 38px !important;
    }
}

@media (max-width: 991px) {
    .landing-page.ssl .container {
        max-width: 720px !important;
    }

    .landing-page.ssl .hero {
        min-height: auto !important;
        padding: 88px 0 92px !important;
    }

    .landing-page.ssl .hero .container {
        display: block !important;
        text-align: center !important;
    }

    .landing-page.ssl .hero h2,
    .landing-page.ssl .hero h3 {
        text-align: center !important;
        max-width: 100% !important;
    }

    .landing-page.ssl .hero h2::after {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .landing-page.ssl .content-block,
    .landing-page.ssl .validation-levels {
        padding-top: 68px !important;
        padding-bottom: 68px !important;
    }

    .landing-page.ssl .navbar-nav .nav-item {
        min-width: auto !important;
    }

    .landing-page.ssl .what-is-ssl img.float-md-right {
        float: none !important;
        display: block !important;
        margin: 0 auto 28px !important;
    }

    .landing-page.ssl .secure-wildcard {
        text-align: center !important;
    }

    .landing-page.ssl .secure-wildcard .text-left {
        text-align: center !important;
    }

    .landing-page.ssl .quote-section {
        margin-top: 30px !important;
    }

    .landing-page.ssl #sslAccordion .help-me-choose > div {
        border-right: 0 !important;
        border-bottom: 1px solid #edf3f8 !important;
        padding-bottom: 26px !important;
    }

    .landing-page.ssl #sslAccordion .help-me-choose > div:last-child {
        border-bottom: 0 !important;
    }
}

@media (max-width: 767px) {
    .landing-page.ssl .hero {
        padding: 72px 0 78px !important;
    }

    .landing-page.ssl .hero h2 {
        font-size: 30px !important;
    }

    .landing-page.ssl .hero h3 {
        font-size: 16px !important;
    }

    .landing-page.ssl h2 {
        font-size: 27px !important;
    }

    .landing-page.ssl .validation-levels h3,
    .landing-page.ssl .standout-1 h3 {
        font-size: 25px !important;
    }

    .landing-page.ssl .browser-notice .wrapper-container {
        margin-top: -55px !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.ssl .browser-notice .wrapper {
        padding: 26px 22px !important;
    }

    .landing-page.ssl .competitive-upgrade-promo {
        font-size: 18px !important;
    }

    .landing-page.ssl #sslAccordion .card-body {
        padding: 24px 22px !important;
    }

    .landing-page.ssl .ssl-certs-all .price {
        text-align: left !important;
        margin: 12px 0 !important;
    }
}

@media (max-width: 575px) {
    .landing-page.ssl .container {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .landing-page.ssl .hero {
        padding: 60px 0 66px !important;
    }

    .landing-page.ssl .hero h2 {
        font-size: 25px !important;
    }

    .landing-page.ssl h2 {
        font-size: 24px !important;
    }

    .landing-page.ssl p {
        font-size: 14px !important;
    }

    .landing-page.ssl .content-block,
    .landing-page.ssl .validation-levels {
        padding-top: 54px !important;
        padding-bottom: 54px !important;
    }

    .landing-page.ssl .standout-1 {
        padding-top: 54px !important;
    }

    .landing-page.ssl .browser-image img {
        border-radius: 14px 14px 0 0 !important;
    }

    .landing-page.ssl .browser-notice {
        padding-bottom: 54px !important;
    }

    .landing-page.ssl #sslAccordion .card-header h4 {
        padding: 16px 18px !important;
        font-size: 15px !important;
    }

    .landing-page.ssl #sslAccordion .arrow {
        width: 24px !important;
        height: 24px !important;
        margin-right: 8px !important;
    }

    .landing-page.ssl .ssl-logos img,
    .landing-page.ssl .logos img,
    .landing-page.ssl .brand-logos img {
        max-height: 42px !important;
        margin: 10px 14px !important;
    }
}



/* =========================================================
   GiddyHost - Submit Ticket / Support Request Page Design
   Page: submitticket.php
   Works with WHMCS default classes
========================================================= */

body:has(#frmSubmitTicket),
body:has(form[action*="submitticket"]) {
    background: #eefdff !important;
}

/* Main ticket card */
.card:has(#frmSubmitTicket),
.card:has(form[action*="submitticket"]) {
    max-width: 940px !important;
    margin: 34px auto 42px auto !important;
    border: 1px solid rgba(11, 116, 209, 0.12) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 45px rgba(16, 48, 82, 0.08) !important;
    overflow: hidden !important;
}

.card:has(#frmSubmitTicket) .card-body,
.card:has(form[action*="submitticket"]) .card-body {
    padding: 42px 46px !important;
}

/* Page title */
.card:has(#frmSubmitTicket) h2,
.card:has(#frmSubmitTicket) h3,
.card:has(#frmSubmitTicket) h4,
.card:has(#frmSubmitTicket) .h3,
.card:has(form[action*="submitticket"]) h2,
.card:has(form[action*="submitticket"]) h3,
.card:has(form[action*="submitticket"]) h4,
.card:has(form[action*="submitticket"]) .h3 {
    color: #102a43 !important;
    font-size: 30px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    margin-bottom: 26px !important;
    letter-spacing: -0.3px !important;
}

.card:has(#frmSubmitTicket) h2::after,
.card:has(#frmSubmitTicket) h3::after,
.card:has(#frmSubmitTicket) .h3::after,
.card:has(form[action*="submitticket"]) h2::after,
.card:has(form[action*="submitticket"]) h3::after,
.card:has(form[action*="submitticket"]) .h3::after {
    content: "" !important;
    display: block !important;
    width: 72px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

/* Form layout */
#frmSubmitTicket,
form[action*="submitticket"] {
    max-width: 100% !important;
}

#frmSubmitTicket .form-group,
form[action*="submitticket"] .form-group {
    margin-bottom: 22px !important;
}

#frmSubmitTicket label,
form[action*="submitticket"] label {
    color: #102a43 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    margin-bottom: 8px !important;
}

/* Inputs, selects and textarea */
#frmSubmitTicket .form-control,
form[action*="submitticket"] .form-control,
#frmSubmitTicket input[type="text"],
#frmSubmitTicket input[type="email"],
#frmSubmitTicket select,
#frmSubmitTicket textarea,
form[action*="submitticket"] input[type="text"],
form[action*="submitticket"] input[type="email"],
form[action*="submitticket"] select,
form[action*="submitticket"] textarea {
    min-height: 48px !important;
    border: 1px solid #d9ebf7 !important;
    border-radius: 12px !important;
    background: #f5fbff !important;
    color: #102a43 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 12px 16px !important;
    box-shadow: none !important;
    transition: all 0.22s ease !important;
}

#frmSubmitTicket .form-control:hover,
form[action*="submitticket"] .form-control:hover {
    border-color: rgba(37, 185, 232, 0.45) !important;
    background: #ffffff !important;
}

#frmSubmitTicket .form-control:focus,
form[action*="submitticket"] .form-control:focus {
    border-color: #25b9e8 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(37, 185, 232, 0.14) !important;
    outline: none !important;
}

/* Disabled / readonly fields */
#frmSubmitTicket .form-control[readonly],
#frmSubmitTicket .form-control:disabled,
form[action*="submitticket"] .form-control[readonly],
form[action*="submitticket"] .form-control:disabled {
    background: #eef3f8 !important;
    color: #60758a !important;
    border-color: #e2eaf1 !important;
}

/* Subject field full width */
#frmSubmitTicket input[name="subject"],
form[action*="submitticket"] input[name="subject"] {
    width: 100% !important;
}

/* Select dropdowns */
#frmSubmitTicket select.form-control,
form[action*="submitticket"] select.form-control {
    cursor: pointer !important;
    background-color: #e8f8ff !important;
}

/* Markdown editor wrapper */
#frmSubmitTicket .md-editor,
form[action*="submitticket"] .md-editor {
    border: 1px solid #d9ebf7 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

#frmSubmitTicket .md-header,
form[action*="submitticket"] .md-header {
    background: #f7fbfe !important;
    border-bottom: 1px solid #e6eef6 !important;
    padding: 8px 10px !important;
}

#frmSubmitTicket .md-footer,
form[action*="submitticket"] .md-footer {
    background: #f7fbfe !important;
    border-top: 1px solid #e6eef6 !important;
    color: #8a9ab0 !important;
    font-size: 12px !important;
}

/* Markdown toolbar buttons */
#frmSubmitTicket .md-header .btn,
form[action*="submitticket"] .md-header .btn {
    background: #ffffff !important;
    border: 1px solid #dbe8f2 !important;
    color: #102a43 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    padding: 5px 8px !important;
    font-size: 12px !important;
}

#frmSubmitTicket .md-header .btn:hover,
form[action*="submitticket"] .md-header .btn:hover {
    background: #eef8fe !important;
    border-color: #25b9e8 !important;
    color: #0b74d1 !important;
}

/* Preview button inside editor */
#frmSubmitTicket .md-header .btn-primary,
#frmSubmitTicket .md-header .btn-info,
form[action*="submitticket"] .md-header .btn-primary,
form[action*="submitticket"] .md-header .btn-info {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 14px rgba(11, 116, 209, 0.20) !important;
}

/* Message textarea */
#frmSubmitTicket textarea,
form[action*="submitticket"] textarea {
    min-height: 230px !important;
    resize: vertical !important;
    line-height: 1.7 !important;
    background: #ffffff !important;
    border-radius: 0 !important;
    border: 0 !important;
}

/* Attachments */
#frmSubmitTicket input[type="file"],
form[action*="submitticket"] input[type="file"] {
    border: 1px solid #d9ebf7 !important;
    background: #ffffff !important;
    border-radius: 10px !important;
    padding: 8px !important;
    color: #40566e !important;
}

#frmSubmitTicket .input-group,
form[action*="submitticket"] .input-group {
    border-radius: 12px !important;
}

#frmSubmitTicket .input-group .form-control,
form[action*="submitticket"] .input-group .form-control {
    border-radius: 12px 0 0 12px !important;
}

#frmSubmitTicket .input-group-append .btn,
#frmSubmitTicket .input-group-prepend .btn,
form[action*="submitticket"] .input-group-append .btn,
form[action*="submitticket"] .input-group-prepend .btn {
    border-radius: 0 12px 12px 0 !important;
}

/* Attachment small note */
#frmSubmitTicket small,
form[action*="submitticket"] small,
#frmSubmitTicket .text-muted,
form[action*="submitticket"] .text-muted {
    color: #64788f !important;
    font-size: 12px !important;
}

/* =========================================================
   THEME BUTTON FIXES
========================================================= */

/* Main submit button */
#frmSubmitTicket button[type="submit"],
form[action*="submitticket"] button[type="submit"],
#frmSubmitTicket .btn.btn-primary,
form[action*="submitticket"] .btn.btn-primary {
    min-width: 150px !important;
    min-height: 44px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 11px 28px !important;
    box-shadow: 0 12px 26px rgba(11, 116, 209, 0.24) !important;
    transition: all 0.22s ease !important;
}

#frmSubmitTicket button[type="submit"]:hover,
form[action*="submitticket"] button[type="submit"]:hover,
#frmSubmitTicket .btn.btn-primary:hover,
form[action*="submitticket"] .btn.btn-primary:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 16px 32px rgba(11, 116, 209, 0.32) !important;
}

/* Cancel / secondary buttons */
#frmSubmitTicket .btn.btn-default,
#frmSubmitTicket .btn.btn-secondary,
form[action*="submitticket"] .btn.btn-default,
form[action*="submitticket"] .btn.btn-secondary {
    min-height: 44px !important;
    border-radius: 999px !important;
    border: 1px solid #d9ebf7 !important;
    background: #ffffff !important;
    color: #40566e !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 11px 24px !important;
    box-shadow: none !important;
}

#frmSubmitTicket .btn.btn-default:hover,
#frmSubmitTicket .btn.btn-secondary:hover,
form[action*="submitticket"] .btn.btn-default:hover,
form[action*="submitticket"] .btn.btn-secondary:hover {
    background: #eef8fe !important;
    border-color: #25b9e8 !important;
    color: #0b74d1 !important;
}

/* Add More / Browse buttons */
#frmSubmitTicket .btn:not(.btn-primary):not(.btn-info),
form[action*="submitticket"] .btn:not(.btn-primary):not(.btn-info) {
    border-radius: 10px !important;
    border: 1px solid #d9ebf7 !important;
    background: #ffffff !important;
    color: #40566e !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#frmSubmitTicket .btn:not(.btn-primary):not(.btn-info):hover,
form[action*="submitticket"] .btn:not(.btn-primary):not(.btn-info):hover {
    background: #eef8fe !important;
    color: #0b74d1 !important;
    border-color: #25b9e8 !important;
}

/* Final action buttons alignment */
#frmSubmitTicket .text-center,
form[action*="submitticket"] .text-center {
    margin-top: 26px !important;
}

#frmSubmitTicket .text-center .btn,
form[action*="submitticket"] .text-center .btn {
    margin: 4px 5px !important;
}

/* Alert boxes */
.card:has(#frmSubmitTicket) .alert,
.card:has(form[action*="submitticket"]) .alert {
    border-radius: 14px !important;
    border: 0 !important;
    padding: 16px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Captcha area */
#frmSubmitTicket .captchaimage,
#frmSubmitTicket .recaptcha,
form[action*="submitticket"] .captchaimage,
form[action*="submitticket"] .recaptcha {
    margin: 24px 0 !important;
    padding: 20px !important;
    background: #f7fbfe !important;
    border: 1px solid #e6eef6 !important;
    border-radius: 16px !important;
}

/* Responsive */
@media (max-width: 991px) {
    .card:has(#frmSubmitTicket),
    .card:has(form[action*="submitticket"]) {
        margin: 28px 18px 36px 18px !important;
    }

    .card:has(#frmSubmitTicket) .card-body,
    .card:has(form[action*="submitticket"]) .card-body {
        padding: 34px 30px !important;
    }

    .card:has(#frmSubmitTicket) h2,
    .card:has(#frmSubmitTicket) h3,
    .card:has(#frmSubmitTicket) .h3,
    .card:has(form[action*="submitticket"]) h2,
    .card:has(form[action*="submitticket"]) h3,
    .card:has(form[action*="submitticket"]) .h3 {
        font-size: 26px !important;
    }
}

@media (max-width: 575px) {
    .card:has(#frmSubmitTicket),
    .card:has(form[action*="submitticket"]) {
        border-radius: 18px !important;
        margin: 22px 14px 32px 14px !important;
    }

    .card:has(#frmSubmitTicket) .card-body,
    .card:has(form[action*="submitticket"]) .card-body {
        padding: 28px 22px !important;
    }

    .card:has(#frmSubmitTicket) h2,
    .card:has(#frmSubmitTicket) h3,
    .card:has(#frmSubmitTicket) .h3,
    .card:has(form[action*="submitticket"]) h2,
    .card:has(form[action*="submitticket"]) h3,
    .card:has(form[action*="submitticket"]) .h3 {
        font-size: 23px !important;
    }

    #frmSubmitTicket .form-control,
    form[action*="submitticket"] .form-control {
        min-height: 46px !important;
        font-size: 14px !important;
    }

    #frmSubmitTicket textarea,
    form[action*="submitticket"] textarea {
        min-height: 180px !important;
    }

    #frmSubmitTicket button[type="submit"],
    #frmSubmitTicket .btn.btn-primary,
    #frmSubmitTicket .btn.btn-default,
    #frmSubmitTicket .btn.btn-secondary,
    form[action*="submitticket"] button[type="submit"],
    form[action*="submitticket"] .btn.btn-primary,
    form[action*="submitticket"] .btn.btn-default,
    form[action*="submitticket"] .btn.btn-secondary {
        width: 100% !important;
        margin: 6px 0 !important;
    }
}




/* =========================================================
   GiddyHost - WHMCS Client Area Dashboard Redesign
   Page: clientarea.php
   Uses WHMCS default classes from clientareahome.tpl
========================================================= */

body:has(.tiles):has(.client-home-cards) {
    background: #eefdff !important;
}

/* Main dashboard width */
.tiles,
.client-home-cards {
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* =========================================================
   Dashboard Tiles
========================================================= */

.tiles {
    margin-top: 22px !important;
    margin-bottom: 28px !important;
}

.tiles .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.tiles .row > div {
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-bottom: 18px !important;
}

.tiles .tile {
    position: relative !important;
    display: block !important;
    min-height: 132px !important;
    padding: 24px 22px 20px !important;
    background: #ffffff !important;
    border: 1px solid rgba(11, 116, 209, 0.10) !important;
    border-radius: 20px !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.07) !important;
    overflow: hidden !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.tiles .tile:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(37, 185, 232, 0.45) !important;
    box-shadow: 0 20px 44px rgba(16, 48, 82, 0.12) !important;
    text-decoration: none !important;
}

.tiles .tile i {
    position: absolute !important;
    right: 20px !important;
    top: 18px !important;
    color: rgba(16, 42, 67, 0.10) !important;
    font-size: 48px !important;
    line-height: 1 !important;
    transition: all 0.25s ease !important;
}

.tiles .tile:hover i {
    color: rgba(37, 185, 232, 0.18) !important;
    transform: scale(1.08) !important;
}

.tiles .tile .stat {
    position: relative !important;
    z-index: 2 !important;
    color: #102a43 !important;
    font-size: 34px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    margin-bottom: 10px !important;
}

.tiles .tile .title {
    position: relative !important;
    z-index: 2 !important;
    color: #64788f !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.35px !important;
}

.tiles .tile .highlight {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 4px !important;
    opacity: 1 !important;
}

.tiles .tile .highlight.bg-color-blue,
.tiles .tile .highlight.bg-color-green,
.tiles .tile .highlight.bg-color-red,
.tiles .tile .highlight.bg-color-gold {
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

/* Individual subtle accent colors */
.tiles .col-6:nth-child(1) .tile .highlight {
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

.tiles .col-6:nth-child(2) .tile .highlight {
    background: linear-gradient(90deg, #2fd184 0%, #0b74d1 100%) !important;
}

.tiles .col-6:nth-child(3) .tile .highlight {
    background: linear-gradient(90deg, #ff5f6d 0%, #0b74d1 100%) !important;
}

.tiles .col-6:nth-child(4) .tile .highlight {
    background: linear-gradient(90deg, #f5a400 0%, #0b74d1 100%) !important;
}

/* =========================================================
   Client Home Cards
========================================================= */

.client-home-cards {
    margin-bottom: 42px !important;
}

.client-home-cards .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.client-home-cards .row > div {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.client-home-cards .card {
    border: 1px solid rgba(11, 116, 209, 0.10) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.07) !important;
    overflow: hidden !important;
    margin-bottom: 22px !important;
    transition: all 0.25s ease !important;
}

.client-home-cards .card:hover {
    border-color: rgba(37, 185, 232, 0.35) !important;
    box-shadow: 0 18px 40px rgba(16, 48, 82, 0.10) !important;
}

/* Card header */
.client-home-cards .card-header {
    background: #ffffff !important;
    border-bottom: 1px solid #e6eef6 !important;
    padding: 18px 22px !important;
    position: relative !important;
}

.client-home-cards .card-header::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

.client-home-cards .card-title {
    color: #102a43 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    letter-spacing: -0.15px !important;
}

.client-home-cards .card-title i {
    color: #0b74d1 !important;
    margin-right: 6px !important;
}

.client-home-cards .card-title .badge {
    background: #eef8fe !important;
    color: #0b74d1 !important;
    border-radius: 999px !important;
    padding: 5px 9px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

/* Header action buttons */
.client-home-cards .card-header .btn,
.client-home-cards .card-title .btn {
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    padding: 7px 13px !important;
    box-shadow: 0 8px 18px rgba(11, 116, 209, 0.20) !important;
}

.client-home-cards .card-header .btn:hover,
.client-home-cards .card-title .btn:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
}

/* Card body */
.client-home-cards .card-body {
    padding: 24px 22px !important;
    color: #40566e !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.client-home-cards .card-body p {
    color: #40566e !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

/* Card footer */
.client-home-cards .card-footer {
    background: #f7fbfe !important;
    border-top: 1px solid #e6eef6 !important;
    padding: 12px 18px !important;
    color: #64788f !important;
    font-size: 13px !important;
}

/* =========================================================
   Accent Cards Override
========================================================= */

.client-home-cards .card[class*="card-accent-"] {
    border-top: 0 !important;
}

.client-home-cards .card-accent-blue .card-header::after,
.client-home-cards .card-accent-green .card-header::after,
.client-home-cards .card-accent-red .card-header::after,
.client-home-cards .card-accent-gold .card-header::after,
.client-home-cards .card-accent-orange .card-header::after {
    background: linear-gradient(90deg, #25b9e8 0%, #0b74d1 100%) !important;
}

/* =========================================================
   Sidebar Style Cards Generated by WHMCS Panels
========================================================= */

.client-home-cards .list-group {
    border-radius: 0 !important;
}

.client-home-cards .list-group-item {
    border-color: #e6eef6 !important;
    color: #40566e !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 14px 18px !important;
    background: #ffffff !important;
    transition: all 0.22s ease !important;
}

.client-home-cards .list-group-item:hover {
    background: #f4fbff !important;
    color: #0b74d1 !important;
}

.client-home-cards .list-group-item.active {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.client-home-cards .list-group-item i {
    color: #0b74d1 !important;
    width: 18px !important;
}

.client-home-cards .list-group-item.active i {
    color: #ffffff !important;
}

.client-home-cards .list-group-item .badge {
    float: right !important;
    background: #eef8fe !important;
    color: #0b74d1 !important;
    border-radius: 999px !important;
    padding: 5px 8px !important;
    font-size: 11px !important;
}

/* =========================================================
   Recommended / MarketConnect Promotion Panel
========================================================= */

.client-home-cards [menuitemname*="Recommended"],
.client-home-cards [menuitemname*="recommended"],
.client-home-cards .card:has(img[src*="sitebuilder"]),
.client-home-cards .card:has(img[src*="site-builder"]) {
    border-radius: 20px !important;
    overflow: hidden !important;
}

.client-home-cards [menuitemname*="Recommended"] .card-header,
.client-home-cards [menuitemname*="recommended"] .card-header {
    background: #ffffff !important;
}

.client-home-cards [menuitemname*="Recommended"] .card-body,
.client-home-cards [menuitemname*="recommended"] .card-body {
    background:
        radial-gradient(circle at right top, rgba(37, 185, 232, 0.10), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%) !important;
}

/* Promo buttons inside panels */
.client-home-cards .card-body .btn,
.client-home-cards .card-footer .btn {
    border-radius: 999px !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    padding: 9px 18px !important;
}

.client-home-cards .card-body .btn-primary,
.client-home-cards .card-footer .btn-primary,
.client-home-cards .card-body .btn-success,
.client-home-cards .card-footer .btn-success {
    border: 0 !important;
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(11, 116, 209, 0.22) !important;
}

.client-home-cards .card-body .btn-primary:hover,
.client-home-cards .card-footer .btn-primary:hover,
.client-home-cards .card-body .btn-success:hover,
.client-home-cards .card-footer .btn-success:hover {
    background: linear-gradient(135deg, #0b74d1 0%, #075aa4 100%) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

/* Default buttons */
.client-home-cards .card-body .btn-default,
.client-home-cards .card-footer .btn-default,
.client-home-cards .card-body .btn-secondary,
.client-home-cards .card-footer .btn-secondary {
    background: #ffffff !important;
    color: #40566e !important;
    border: 1px solid #d9ebf7 !important;
}

.client-home-cards .card-body .btn-default:hover,
.client-home-cards .card-footer .btn-default:hover,
.client-home-cards .card-body .btn-secondary:hover,
.client-home-cards .card-footer .btn-secondary:hover {
    background: #eef8fe !important;
    color: #0b74d1 !important;
    border-color: #25b9e8 !important;
}

/* =========================================================
   Left Client Sidebar Cards outside .client-home-cards
   Common WHMCS client area sidebar/panels
========================================================= */

.sidebar .card,
#sidebar .card,
.clientarea-sidebar .card,
.sidebar-primary .card {
    border: 1px solid rgba(11, 116, 209, 0.10) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 34px rgba(16, 48, 82, 0.07) !important;
    overflow: hidden !important;
    margin-bottom: 18px !important;
}

.sidebar .card-header,
#sidebar .card-header,
.clientarea-sidebar .card-header,
.sidebar-primary .card-header {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    padding: 15px 18px !important;
}

.sidebar .card-title,
#sidebar .card-title,
.clientarea-sidebar .card-title,
.sidebar-primary .card-title,
.sidebar .card-header h3,
#sidebar .card-header h3 {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    margin: 0 !important;
}

.sidebar .card-body,
#sidebar .card-body,
.clientarea-sidebar .card-body,
.sidebar-primary .card-body {
    padding: 20px 18px !important;
    color: #40566e !important;
    font-size: 14px !important;
}

.sidebar .list-group-item,
#sidebar .list-group-item,
.clientarea-sidebar .list-group-item,
.sidebar-primary .list-group-item {
    border-color: #e6eef6 !important;
    color: #40566e !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 13px 16px !important;
}

.sidebar .list-group-item:hover,
#sidebar .list-group-item:hover,
.clientarea-sidebar .list-group-item:hover,
.sidebar-primary .list-group-item:hover {
    background: #f4fbff !important;
    color: #0b74d1 !important;
}

/* Sidebar buttons */
.sidebar .btn,
#sidebar .btn,
.clientarea-sidebar .btn,
.sidebar-primary .btn {
    border-radius: 999px !important;
    font-weight: 800 !important;
}

.sidebar .btn-primary,
#sidebar .btn-primary,
.clientarea-sidebar .btn-primary,
.sidebar-primary .btn-primary {
    background: linear-gradient(135deg, #25b9e8 0%, #0b74d1 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
}

/* =========================================================
   Support Pin / Client Info Specific Refinement
========================================================= */

.sidebar .card-body .text-success,
#sidebar .card-body .text-success,
.clientarea-sidebar .card-body .text-success {
    color: #79d400 !important;
    font-weight: 900 !important;
}

.sidebar .card-body a,
#sidebar .card-body a,
.clientarea-sidebar .card-body a {
    color: #0b74d1 !important;
    font-weight: 700 !important;
}

/* =========================================================
   Domain Register / Transfer Mini Form
========================================================= */

.client-home-cards input[type="text"],
.client-home-cards input[type="search"],
.client-home-cards select,
.client-home-cards .form-control {
    min-height: 44px !important;
    border: 1px solid #d9ebf7 !important;
    border-radius: 12px !important;
    background: #f5fbff !important;
    color: #102a43 !important;
    box-shadow: none !important;
}

.client-home-cards .input-group .form-control {
    border-radius: 12px 0 0 12px !important;
}

.client-home-cards .input-group .btn {
    border-radius: 0 12px 12px 0 !important;
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1199px) {
    .tiles,
    .client-home-cards {
        max-width: 920px !important;
    }
}

@media (max-width: 991px) {
    .tiles,
    .client-home-cards {
        max-width: 100% !important;
    }

    .tiles {
        margin-top: 20px !important;
    }

    .tiles .tile {
        min-height: 120px !important;
    }

    .tiles .tile .stat {
        font-size: 30px !important;
    }

    .client-home-cards .card-header {
        padding: 16px 18px !important;
    }

    .client-home-cards .card-body {
        padding: 20px 18px !important;
    }
}

@media (max-width: 575px) {
    .tiles .row > div {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .tiles .tile {
        min-height: 112px !important;
        padding: 22px 20px !important;
    }

    .tiles .tile .stat {
        font-size: 28px !important;
    }

    .client-home-cards .card {
        border-radius: 16px !important;
    }

    .client-home-cards .card-title {
        font-size: 16px !important;
    }

    .client-home-cards .card-header .float-right {
        float: none !important;
        margin-bottom: 10px !important;
    }

    .client-home-cards .card-header .btn,
    .client-home-cards .card-title .btn {
        width: 100% !important;
        margin-top: 8px !important;
    }
}



@media screen and (max-width: 767px) {
	.top_bar_so {
  display: none;
 
}
	.top-bar .container, .top-left, .top-right 
 
{
	 gap: 0
	
	}
	
	
}










.client-account-dropdown {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    z-index: 9999 !important;
}

.client-account-dropdown .user-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #001b44 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    font-size: 22px !important;
    transition: all 0.25s ease !important;
}

.client-account-dropdown .user-icon:hover {
    background: #00aeef !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

.client-account-menu {
    position: absolute !important;
    top: calc(100% + 16px) !important;
    right: 0 !important;
    width: 310px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 45px rgba(0, 27, 68, 0.18) !important;
    padding: 12px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(12px) !important;
    transition: all 0.25s ease !important;
    z-index: 99999 !important;
}

.client-account-dropdown:hover .client-account-menu,
.client-account-dropdown.active .client-account-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

.client-account-menu:before {
    content: "" !important;
    position: absolute !important;
    top: -8px !important;
    right: 22px !important;
    width: 18px !important;
    height: 18px !important;
    background: #ffffff !important;
    transform: rotate(45deg) !important;
    box-shadow: -3px -3px 8px rgba(0, 27, 68, 0.04) !important;
}

.client-account-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px !important;
    margin-bottom: 8px !important;
    border-radius: 12px !important;
    background: #eefaff !important;
    position: relative !important;
    z-index: 1 !important;
}

.client-account-avatar {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: #001b44 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.client-account-header strong {
    display: block !important;
    color: #001b44 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.client-account-header span {
    display: block !important;
    color: #61708a !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    max-width: 205px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.client-account-menu a {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 11px 12px !important;
    border-radius: 10px !important;
    color: #001b44 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    z-index: 1 !important;
}

.client-account-menu a i {
    width: 18px !important;
    color: #00aeef !important;
    font-size: 15px !important;
    text-align: center !important;
}

.client-account-menu a:hover {
    background: #eefaff !important;
    color: #00aeef !important;
    padding-left: 16px !important;
}

.client-account-divider {
    height: 1px !important;
    background: #e7edf5 !important;
    margin: 8px 0 !important;
}

.client-account-menu a.client-account-logout {
    color: #dc3545 !important;
}

.client-account-menu a.client-account-logout i {
    color: #dc3545 !important;
}

.client-account-menu a.client-account-logout:hover {
    background: #fff1f2 !important;
    color: #dc3545 !important;
}

@media (max-width: 991px) {
    .client-account-dropdown {
        margin-left: auto !important;
    }

    .client-account-dropdown .user-icon {
        width: 46px !important;
        height: 46px !important;
        font-size: 18px !important;
    }

    .client-account-menu {
        position: fixed !important;
        top: 85px !important;
        right: 15px !important;
        left: 15px !important;
        width: auto !important;
        max-height: calc(100vh - 110px) !important;
        overflow-y: auto !important;
    }

    .client-account-menu:before {
        display: none !important;
    }
}


.card-body #sPIN {
 color: #000 !important;
  font-size: 24px !important;
 font-weight: 600 !important ;
}










/* =========================================================
   ONLY Register Domain Page - GiddyHost Design
   Page condition: has #frmDomainChecker + .domain-pricing
   Paste at the VERY BOTTOM of custom.css
========================================================= */

body:has(#frmDomainChecker):has(.domain-pricing) {
    background: #eefcff !important;
}

/* Main wrapper only for register-domain page */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart {
    max-width: 1180px !important;
    margin: 0 auto !important;
    padding: 36px 20px 60px !important;
    color: #071529 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart.order_form_bx .cart-body {
    width: 100% !important;
    max-width: 100% !important;
}

/* Hide sidebar category include only on this page */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .sidebar-collapsed,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .cart-sidebar,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .categories-collapsed {
    display: none !important;
}

/* Page heading */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .header-lined {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .header-lined h1,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart h1.font-size-36 {
    color: #071529 !important;
    font-size: 38px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
    margin: 0 0 18px !important;
    letter-spacing: -0.5px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .header-lined h1::after,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart h1.font-size-36::after {
    content: "" !important;
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin-top: 14px !important;
    border-radius: 50px !important;
    background: linear-gradient(90deg, #31b9eb 0%, #2478ff 100%) !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .cart-body > p {
    color: #5e636e !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
}

/* =========================================================
   Domain Search Hero
========================================================= */

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-container {
    margin: 0 0 28px !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg {
    position: relative !important;
    overflow: hidden !important;
    min-height: 230px !important;
    border-radius: 14px !important;
    padding: 68px 36px !important;
    background:
        radial-gradient(circle at 87% 50%, rgba(255, 246, 186, 0.95) 0 2px, transparent 3px),
        linear-gradient(135deg, #31b9eb 0%, #22aee6 48%, #0b99d3 100%) !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.10) !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg::before {
    content: "" !important;
    position: absolute !important;
    right: -55px !important;
    top: 30px !important;
    width: 230px !important;
    height: 230px !important;
    border: 13px solid rgba(255, 246, 186, 0.92) !important;
    border-radius: 50% !important;
    opacity: 0.95 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg::after {
    content: "" !important;
    position: absolute !important;
    right: 34px !important;
    top: 68px !important;
    width: 150px !important;
    height: 95px !important;
    border-top: 10px solid rgba(255, 246, 186, 0.92) !important;
    border-bottom: 10px solid rgba(255, 246, 186, 0.92) !important;
    border-radius: 50% !important;
    transform: rotate(-17deg) !important;
    opacity: 0.82 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #frmDomainChecker {
    position: relative !important;
    z-index: 2 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-container .input-group,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .input-group-box {
    max-width: 670px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 10px !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: rgba(255,255,255,0.22) !important;
    border: 1px solid rgba(255,255,255,0.36) !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 34px rgba(6, 41, 78, 0.16) !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #inputDomain {
    height: 56px !important;
    min-height: 56px !important;
    border: 0 !important;
    border-radius: 8px 0 0 8px !important;
    background: #ffffff !important;
    color: #071529 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 20px !important;
    box-shadow: none !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #inputDomain::placeholder {
    color: #8a9ab0 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #btnCheckAvailability {
    height: 56px !important;
    min-height: 56px !important;
    min-width: 126px !important;
    border: 0 !important;
    border-radius: 0 8px 8px 0 !important;
    background: #dbe9ff !important;
    color: #159ef0 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
    padding: 0 24px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #btnCheckAvailability:hover {
    background: #ffffff !important;
    color: #071529 !important;
}

/* =========================================================
   Domain Pricing Box
========================================================= */

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing {
    background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 14px !important;
    padding: 30px 34px !important;
    margin: 28px 0 34px !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.08) !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing h4.font-size-18 {
    color: #071529 !important;
    font-size: 20px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    margin: 0 0 14px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing h4.font-size-18::after {
    content: "" !important;
    display: block !important;
    width: 62px !important;
    height: 3px !important;
    margin-top: 11px !important;
    border-radius: 50px !important;
    background: linear-gradient(90deg, #31b9eb 0%, #2478ff 100%) !important;
}

/* Category badges */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    margin: 0 0 24px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters a.badge,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters .badge {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 27px !important;
    padding: 7px 11px !important;
    border: 1px solid #d9ebf7 !important;
    border-radius: 50px !important;
    background: #eefcff !important;
    color: #40566e !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters a.badge:hover,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters a.badge.active,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters .badge.active {
    background: linear-gradient(90deg, #31b9eb 0%, #2478ff 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

/* Pricing table wrapper */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing > .bg-white {
    background: #ffffff !important;
    border: 1px solid #e3edf5 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 22px rgba(6, 22, 47, 0.04) !important;
}

/* Table header */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-pricing-header {
    background: #f6fbff !important;
    border-bottom: 2px solid #2478ff !important;
    color: #071529 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-pricing-header > div,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-pricing-header .row > div {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

/* TLD rows */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row {
    min-height: 56px !important;
    border-bottom: 1px solid #edf3f8 !important;
    background: #ffffff !important;
    transition: all 0.16s ease !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row:nth-child(even) {
    background: #f6fbff !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row:hover {
    background: #eefcff !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row > div {
    display: flex !important;
    align-items: center !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .two-row-center {
    min-height: 56px !important;
    justify-content: flex-start !important;
    color: #071529 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .row {
    width: 100% !important;
    margin: 0 !important;
    align-items: center !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-4,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-xs-4 {
    min-height: 56px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    color: #071529 !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    border-left: 1px solid #e3edf5 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row small {
    color: #64788f !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    margin-top: 2px !important;
}

/* =========================================================
   Results / Suggestions Only On This Page
========================================================= */

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #DomainSearchResults {
    margin: 28px 0 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-result-headline,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .suggested-domains {
    background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 45px rgba(6, 22, 47, 0.08) !important;
    overflow: hidden !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-result-headline {
    padding: 26px 24px !important;
    text-align: center !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .suggested-domains .card-header,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .suggested-domains .panel-heading {
    background: #ffffff !important;
    color: #071529 !important;
    border-bottom: 2px solid #31b9eb !important;
    padding: 18px 22px !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-suggestion {
    background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 10px !important;
    margin: 12px !important;
    padding: 16px 20px !important;
    box-shadow: 0 8px 24px rgba(6, 22, 47, 0.05) !important;
}

/* Buttons inside results */
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .btn-add-to-cart,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-contact-support {
    background: linear-gradient(90deg, #31b9eb 0%, #2478ff 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    min-height: 40px !important;
    padding: 9px 18px !important;
    box-shadow: none !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .btn-add-to-cart:hover,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-contact-support:hover {
    background: #071529 !important;
    color: #ffffff !important;
}

/* =========================================================
   Bottom Promo Boxes
========================================================= */

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box {
    min-height: 210px !important;
    padding: 30px 28px !important;
    margin-bottom: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e8eef7 !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 34px rgba(6, 22, 47, 0.07) !important;
    transition: all 0.22s ease !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 18px 44px rgba(6, 22, 47, 0.10) !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box i.fa-4x {
    float: right !important;
    color: rgba(7, 21, 41, 0.18) !important;
    font-size: 52px !important;
    margin-left: 18px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box h3 {
    color: #071529 !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 900 !important;
    margin-bottom: 8px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box p {
    color: #5e636e !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box .btn-primary,
body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box .btn-warning {
    border: 0 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
    background: linear-gradient(90deg, #31b9eb 0%, #2478ff 100%) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding: 12px 22px !important;
}

body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box .btn-warning {
    background: #ffc107 !important;
    color: #071529 !important;
}

/* =========================================================
   Mobile Responsive - Only This Page
========================================================= */

@media (max-width: 991px) {
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart {
        padding: 32px 16px 50px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg {
        padding: 52px 24px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing {
        padding: 26px 24px !important;
    }
}

@media (max-width: 767px) {
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .header-lined h1,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart h1.font-size-36 {
        font-size: 29px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg {
        min-height: auto !important;
        padding: 38px 18px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg::before,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-bg::after {
        opacity: 0.25 !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-checker-container .input-group,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .input-group-box {
        display: block !important;
        padding: 9px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #inputDomain {
        width: 100% !important;
        border-radius: 8px !important;
        margin-bottom: 10px !important;
        text-align: left !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .input-group-append,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .input-group-btn {
        width: 100% !important;
        display: block !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart #btnCheckAvailability {
        width: 100% !important;
        border-radius: 8px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-pricing-header {
        display: none !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row {
        display: block !important;
        padding: 16px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row > div,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .row {
        display: block !important;
        width: 100% !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .two-row-center {
        min-height: auto !important;
        padding: 0 0 12px !important;
        font-size: 18px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-4,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-xs-4 {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        border-left: 0 !important;
        border-top: 1px solid #edf3f8 !important;
        padding: 11px 0 !important;
        text-align: right !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-4:nth-child(1)::before,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-xs-4:nth-child(1)::before {
        content: "Register";
        color: #071529;
        font-weight: 900;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-4:nth-child(2)::before,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-xs-4:nth-child(2)::before {
        content: "Transfer";
        color: #071529;
        font-weight: 900;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-4:nth-child(3)::before,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-row .col-md-8 .col-xs-4:nth-child(3)::before {
        content: "Renewal";
        color: #071529;
        font-weight: 900;
    }
}

@media (max-width: 575px) {
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart {
        padding: 26px 12px 44px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .header-lined h1,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart h1.font-size-36 {
        font-size: 25px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-pricing {
        padding: 22px 16px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters a.badge,
    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .tld-filters .badge {
        font-size: 10px !important;
        padding: 7px 9px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box {
        padding: 24px 20px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box i.fa-4x {
        float: none !important;
        display: block !important;
        margin: 0 0 14px !important;
    }

    body:has(#frmDomainChecker):has(.domain-pricing) #order-standard_cart .domain-promo-box .btn {
        width: 100% !important;
    }
}