/*
 JomeTech Hosting — Official Web Brand System

 Exact sampled colours from approved header:
 Royal Blue: #0000CC
 CTA Red:    #FE2D2B
 Nav Text:   #3A4260
 Divider:    #E4E7EE
*/

:root{
    --jt-blue:#0000CC;
    --jt-blue-hover:#0000B3;
    --jt-red:#FE2D2B;
    --jt-red-hover:#E82523;

    --jt-nav:#3A4260;
    --jt-heading:#171B35;
    --jt-body:#5B6479;
    --jt-muted:#7C8598;

    --jt-white:#FFFFFF;
    --jt-soft:#F7F8FC;
    --jt-soft-blue:#F1F2FF;
    --jt-line:#E4E7EE;

    --jt-radius:12px;
    --jt-card-radius:18px;

    --jt-shadow:
        0 14px 40px rgba(31,39,70,.07);

    --jt-shadow-hover:
        0 24px 60px rgba(31,39,70,.12);
}


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

html{
    scroll-behavior:smooth;
}

body{
    color:var(--jt-body)!important;
    background:var(--jt-white)!important;
}

body,
p,
li,
input,
textarea,
select,
button{
    font-family:"Manrope",sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6{
    color:var(--jt-heading)!important;
    font-family:"Sora",sans-serif;
}

a{
    color:var(--jt-blue);
}

a:hover{
    color:var(--jt-blue-hover);
}


/* ====================================================
   ANNOUNCEMENT BAR
==================================================== */

.jt-topbar{
    color:#fff!important;
    background:var(--jt-blue)!important;
}

.jt-topbar a{
    color:#fff!important;
}

.jt-topbar a:hover{
    opacity:.88;
}


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

.jt-header,
.site-header{
    background:#fff!important;
}

.jt-header-inner{
    min-height:82px!important;
}

.jt-container{
    width:min(1220px,calc(100% - 40px))!important;
}

.jt-brand img{
    max-width:195px!important;
    max-height:52px!important;
}


/* Navigation */

.jt-nav>a,
.jt-nav-item>a,
.jt-nav a{
    color:var(--jt-nav)!important;
}

.jt-nav>a:hover,
.jt-nav-item>a:hover,
.jt-nav a:hover,
.jt-nav .current-menu-item>a{
    color:var(--jt-blue)!important;
}


/* Dropdowns */

.jt-dropdown{
    border-color:var(--jt-line)!important;
    background:#fff!important;
    box-shadow:var(--jt-shadow)!important;
}

.jt-dropdown strong{
    color:var(--jt-heading)!important;
}

.jt-dropdown span{
    color:var(--jt-muted)!important;
}

.jt-dropdown a:hover{
    background:var(--jt-soft-blue)!important;
}


/* Header Login */

.jt-actions .jt-button:not(:last-child){
    color:var(--jt-nav)!important;
    border-color:var(--jt-line)!important;
    background:#fff!important;
}


/* GET STARTED — RED */

.jt-actions .jt-button:last-child,
.jt-header .jt-button-primary,
.jt-header .jt-btn-primary{
    color:#fff!important;
    border-color:var(--jt-red)!important;
    background:var(--jt-red)!important;
    box-shadow:
        0 10px 24px rgba(254,45,43,.18)!important;
}

.jt-actions .jt-button:last-child:hover,
.jt-header .jt-button-primary:hover{
    border-color:var(--jt-red-hover)!important;
    background:var(--jt-red-hover)!important;
}


/* Header bottom separator */

.jt-header,
.site-header{
    border-bottom:
        1px solid var(--jt-line)!important;
}


/* ====================================================
   BUTTON SYSTEM
==================================================== */

.wp-block-button__link,
.jt-button,
.jt-v3-plan-btn{
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        background-color .18s ease!important;
}


/* STANDARD PRIMARY = BLUE */

.jt-v3-primary .wp-block-button__link,
.jt-btn-primary .wp-block-button__link,
.jt-native-page .jt-btn-primary .wp-block-button__link,
.jt-button-primary:not(.jt-header .jt-button-primary){
    color:#fff!important;
    border-color:var(--jt-blue)!important;
    background:var(--jt-blue)!important;
    box-shadow:
        0 9px 24px rgba(0,0,204,.16)!important;
}

.jt-v3-primary .wp-block-button__link:hover,
.jt-btn-primary .wp-block-button__link:hover{
    transform:translateY(-1px);
    background:var(--jt-blue-hover)!important;
}


/* SECONDARY */

.jt-v3-secondary .wp-block-button__link,
.jt-btn-secondary .wp-block-button__link{
    color:var(--jt-blue)!important;
    border:
        1px solid var(--jt-line)!important;
    background:#fff!important;
}

.jt-v3-secondary .wp-block-button__link:hover,
.jt-btn-secondary .wp-block-button__link:hover{
    border-color:var(--jt-blue)!important;
    background:var(--jt-soft-blue)!important;
}


/* FINAL HIGH-VALUE CTA = RED */

.jt-v3-red .wp-block-button__link{
    color:#fff!important;
    background:var(--jt-red)!important;
}

.jt-v3-red .wp-block-button__link:hover{
    background:var(--jt-red-hover)!important;
}


/* ====================================================
   HOMEPAGE HERO
==================================================== */

.jt-v3-hero{
    background:
        radial-gradient(
            circle at 88% 14%,
            rgba(0,0,204,.055),
            transparent 29%
        ),
        linear-gradient(
            180deg,
            #FFFFFF,
            #F8F8FC
        )!important;
}

.jt-v3-h1{
    color:var(--jt-heading)!important;
}

.jt-v3-h1 span{
    color:var(--jt-blue)!important;
}

.jt-v3-kicker{
    color:var(--jt-blue)!important;
}

.jt-v3-lead,
.jt-v3-section-lead{
    color:var(--jt-body)!important;
}


/* Hero infrastructure card */

.jt-v3-visual{
    border-color:
        rgba(255,255,255,.12)!important;

    background:
        linear-gradient(
            145deg,
            #161A36,
            #090D25
        )!important;
}

.jt-v3-floating-card{
    border-color:var(--jt-line)!important;
    background:
        rgba(255,255,255,.96)!important;
}

.jt-v3-floating-card h3{
    color:var(--jt-heading)!important;
}

.jt-v3-floating-card p{
    color:var(--jt-muted)!important;
}


/* ====================================================
   DOMAIN SEARCH
==================================================== */

.jth-domain-field{
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

.jth-domain-field:focus-within{
    border-color:var(--jt-blue)!important;
    box-shadow:
        0 0 0 3px rgba(0,0,204,.07)!important;
}

.jth-domain-field input{
    color:var(--jt-heading)!important;
}

.jth-domain-search button{
    color:#fff!important;
    background:var(--jt-blue)!important;
}

.jth-domain-search button:hover{
    background:var(--jt-blue-hover)!important;
}

.jth-domain-ext span{
    color:var(--jt-blue)!important;
    background:var(--jt-soft-blue)!important;
}


/* ====================================================
   TRUST STRIP
==================================================== */

.jt-v3-trust>.wp-block-columns,
.jt-trust-grid{
    border-color:var(--jt-line)!important;
}

.jt-v3-trust .wp-block-column,
.jt-trust-item{
    border-color:var(--jt-line)!important;
}

.jt-v3-trust h3,
.jt-trust-item h3{
    color:var(--jt-heading)!important;
}

.jt-v3-trust p,
.jt-trust-item p{
    color:var(--jt-muted)!important;
}


/* ====================================================
   LIGHT SECTION BACKGROUNDS
==================================================== */

.jt-v3-services,
.jt-v3-migration,
.jt-v3-resources,
.jt-soft-section{
    background:var(--jt-soft)!important;
}


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

.jt-v3-card,
.jt-card{
    border:
        1px solid var(--jt-line)!important;

    background:#fff!important;

    box-shadow:var(--jt-shadow)!important;
}

.jt-v3-card:hover,
.jt-card:hover{
    border-color:
        rgba(0,0,204,.20)!important;

    box-shadow:
        var(--jt-shadow-hover)!important;
}

.jt-v3-card>span{
    color:var(--jt-blue)!important;
}

.jt-v3-card h3,
.jt-card h3{
    color:var(--jt-heading)!important;
}

.jt-v3-card p,
.jt-card p{
    color:var(--jt-body)!important;
}

.jt-v3-card a,
.jt-card a{
    color:var(--jt-blue)!important;
}


/* ====================================================
   WHY JOMETECH
==================================================== */

.jt-v3-check,
.jt-check-list li{
    color:var(--jt-nav)!important;
}

.jt-v3-check::first-letter{
    color:var(--jt-blue);
}


/* ====================================================
   PRICING
==================================================== */

.jt-v3-plan,
.jt-plan{
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

.jt-v3-plan-name,
.jt-plan-label{
    color:var(--jt-blue)!important;
}

.jt-v3-plan h3,
.jt-plan-price{
    color:var(--jt-heading)!important;
}


/* Featured Business plan */

.jt-v3-featured,
.jt-plan-featured{
    border-color:var(--jt-blue)!important;

    background:
        linear-gradient(
            180deg,
            var(--jt-soft-blue) 0,
            #fff 38%
        )!important;

    box-shadow:
        0 24px 55px
        rgba(0,0,204,.10)!important;
}

.jt-v3-popular{
    color:#fff!important;
    background:var(--jt-blue)!important;
}


/* Pricing order buttons */

.jt-v3-plan-btn{
    color:var(--jt-blue)!important;
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

.jt-v3-featured .jt-v3-plan-btn{
    color:#fff!important;
    border-color:var(--jt-blue)!important;
    background:var(--jt-blue)!important;
}


/* Offer strip */

.jt-v3-offer,
.jt-offer-note{
    color:var(--jt-nav)!important;
    border-color:
        rgba(0,0,204,.12)!important;
    background:var(--jt-soft-blue)!important;
}


/* ====================================================
   MIGRATION
==================================================== */

.jt-v3-step-list>div,
.jt-migration-steps>div{
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

.jt-v3-step-list span{
    color:var(--jt-blue)!important;
}


/* ====================================================
   CLOUD / VPS / DEDICATED
==================================================== */

.jt-v3-cloud,
.jt-cloud-section{
    color:#fff!important;

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(0,0,204,.45),
            transparent 35%
        ),
        #10142E!important;
}

.jt-v3-cloud h2,
.jt-v3-cloud h3,
.jt-cloud-section h2,
.jt-cloud-section h3{
    color:#fff!important;
}

.jt-v3-cloud .jt-v3-kicker,
.jt-cloud-section .jt-kicker{
    color:#B7B8FF!important;
}

.jt-v3-cloud p,
.jt-cloud-section p{
    color:#D3D6E5!important;
}

.jt-v3-cloud-links a{
    color:#fff!important;
}

.jt-v3-cloud-links span{
    color:#B8BAFF!important;
}


/* ====================================================
   HARARE / LOCAL
==================================================== */

.jt-v3-address{
    border:
        1px solid var(--jt-line)!important;
    background:var(--jt-soft)!important;
}

.jt-v3-address>p:first-child{
    color:var(--jt-blue)!important;
}

.jt-v3-address h3{
    color:var(--jt-heading)!important;
}

.jt-v3-address a{
    color:var(--jt-blue)!important;
}


/* ====================================================
   BLOG / RESOURCES
==================================================== */

.jt-v3-resources
.wp-block-latest-posts li{
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

.jt-v3-resources
.wp-block-latest-posts a{
    color:var(--jt-heading)!important;
}

.jt-v3-resources
.wp-block-latest-posts a:hover{
    color:var(--jt-blue)!important;
}


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

.jt-v3-faq-item,
.jt-faq-item{
    border-color:var(--jt-line)!important;
}

.jt-v3-faq-item h3,
.jt-faq-item h3{
    color:var(--jt-heading)!important;
}

.jt-v3-faq-item p,
.jt-faq-item p{
    color:var(--jt-body)!important;
}


/* ====================================================
   FINAL CTA
==================================================== */

.jt-v3-final,
.jt-final-cta{
    color:#fff!important;
    background:var(--jt-blue)!important;
}

.jt-v3-final h2,
.jt-final-cta h2{
    color:#fff!important;
}

.jt-v3-final p,
.jt-final-cta p{
    color:#E8E8FF!important;
}

.jt-v3-final .jt-v3-kicker{
    color:#CCCCFF!important;
}


/* ====================================================
   SERVICE PAGE HEROES
==================================================== */

.jt-page-hero{
    background:
        linear-gradient(
            180deg,
            #F7F7FC,
            #FFFFFF
        )!important;
}

.jt-page-hero h1{
    color:var(--jt-heading)!important;
}

.jt-native-page .jt-kicker{
    color:var(--jt-blue)!important;
}


/* ====================================================
   FORMS
==================================================== */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea,
select{
    color:var(--jt-heading)!important;
    border-color:var(--jt-line)!important;
    background:#fff!important;
}

input:focus,
textarea:focus,
select:focus{
    outline:none!important;
    border-color:var(--jt-blue)!important;
    box-shadow:
        0 0 0 3px rgba(0,0,204,.07)!important;
}


/* ====================================================
   TABLES
==================================================== */

table{
    border-color:var(--jt-line)!important;
}

th{
    color:var(--jt-heading)!important;
    background:var(--jt-soft)!important;
}

td,
th{
    border-color:var(--jt-line)!important;
}


/* ====================================================
   POSTS / STANDARD WORDPRESS CONTENT
==================================================== */

.entry-content a{
    color:var(--jt-blue);
}

.entry-content blockquote{
    border-left:
        4px solid var(--jt-blue)!important;
    background:var(--jt-soft)!important;
}


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

.jt-footer,
.site-footer{
    color:#D7D9E5!important;
    background:#11152F!important;
}

.jt-footer h3,
.jt-footer h4,
.site-footer h3,
.site-footer h4{
    color:#fff!important;
}

.jt-footer a,
.site-footer a{
    color:#D7D9E5!important;
}

.jt-footer a:hover,
.site-footer a:hover{
    color:#fff!important;
}

.jt-footer-brand p{
    color:#B9BDCD!important;
}

.jt-footer-bottom{
    border-color:
        rgba(255,255,255,.10)!important;
}


/* small blue brand accent */

.jt-footer{
    border-top:
        4px solid var(--jt-blue)!important;
}


/* ====================================================
   MOBILE
==================================================== */

@media(max-width:700px){

    .jt-container{
        width:
            calc(100% - 28px)!important;
    }

    .jt-topbar{
        font-size:11px!important;
    }

    .jt-header-inner{
        min-height:70px!important;
    }

    .jt-brand img{
        max-width:165px!important;
    }

    .jt-v3-h1{
        font-size:42px!important;
    }

    .jt-v3-section h2,
    .jt-v3-domain h2{
        font-size:34px!important;
    }

    .jt-v3-final,
    .jt-final-cta{
        border-radius:18px!important;
    }
}