.hmkt{background:#f7f9fc;color:#0f172a}
.hmkt *{box-sizing:border-box}
.hmkt-wrap{width:min(1180px,calc(100% - 48px));margin:0 auto}

.hmkt-hero{
    padding:88px 0 78px;
    background:
        radial-gradient(circle at 80% 10%,rgba(37,99,235,.12),transparent 34%),
        #fff;
}

.hmkt-hero-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:72px;
    align-items:center;
}

.hmkt-kicker,
.hmkt-section-head>span,
.hmkt-cta span{
    display:block;
    color:#2563eb;
    font-size:12px;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.hmkt-hero h1{
    max-width:690px;
    margin:14px 0 20px;
    font-size:54px;
    line-height:1.02;
    letter-spacing:-.045em;
}

.hmkt-hero h1 em{
    color:#2563eb;
    font-style:normal;
}

.hmkt-hero-copy>p{
    max-width:670px;
    margin:0;
    color:#64748b;
    font-size:18px;
    line-height:1.65;
}

.hmkt-actions{
    display:flex;
    gap:12px;
    margin-top:30px;
}

.hmkt-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:48px;
    padding:0 18px;
    border:1px solid #d6dfeb;
    border-radius:10px;
    background:#fff;
    color:#0f172a;
    font-weight:750;
    text-decoration:none;
}

.hmkt-btn.primary{
    border-color:#2563eb;
    background:#2563eb;
    color:#fff;
}

.hmkt-proof{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin-top:24px;
    color:#64748b;
    font-size:12px;
}

.hmkt-preview{
    padding:24px;
    border:1px solid #dce5f0;
    border-radius:20px;
    background:#fff;
    box-shadow:0 24px 70px rgba(15,23,42,.10);
}

.hmkt-preview-top{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:center;
    padding-bottom:18px;
    border-bottom:1px solid #eef2f7;
}

.hmkt-preview-top small,
.hmkt-preview-mailbox small,
.hmkt-preview-grid small{
    display:block;
    color:#64748b;
    font-size:10px;
    letter-spacing:.06em;
}

.hmkt-preview-top strong{
    display:block;
    margin-top:5px;
    font-size:20px;
}

.hmkt-preview-top>span{
    padding:7px 11px;
    border-radius:999px;
    background:#eaf8ef;
    color:#168144;
    font-size:11px;
    font-weight:700;
}

.hmkt-preview-mailbox{
    display:grid;
    grid-template-columns:42px 1fr auto;
    gap:13px;
    align-items:center;
    margin:20px 0;
    padding:16px;
    border:1px solid #e5ebf2;
    border-radius:13px;
    background:#f9fbfe;
}

.hmkt-preview-mailbox i{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#eaf1ff;
    color:#2563eb;
    font-style:normal;
    font-weight:800;
}

.hmkt-preview-mailbox strong{display:block;font-size:14px}
.hmkt-preview-mailbox em{font-style:normal;font-size:12px;color:#64748b}

.hmkt-preview-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.hmkt-preview-grid article{
    padding:14px;
    border:1px solid #e5ebf2;
    border-radius:11px;
}

.hmkt-preview-grid strong{
    display:block;
    margin-top:5px;
    font-size:20px;
}

.hmkt-section{padding:82px 0}

.hmkt-section-head{
    max-width:720px;
    margin-bottom:34px;
}

.hmkt-section-head.centered{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.hmkt-section-head h2,
.hmkt-split h2,
.hmkt-cta h2{
    margin:10px 0 12px;
    font-size:38px;
    line-height:1.12;
    letter-spacing:-.03em;
}

.hmkt-section-head p,
.hmkt-split p,
.hmkt-cta p{
    margin:0;
    color:#64748b;
    line-height:1.65;
}

.hmkt-feature-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.hmkt-feature-grid article{
    min-height:210px;
    padding:24px;
    border:1px solid #dfe6ef;
    border-radius:16px;
    background:#fff;
}

.hmkt-feature-grid b{
    color:#2563eb;
    font-size:11px;
}

.hmkt-feature-grid h3{
    margin:30px 0 9px;
    font-size:18px;
}

.hmkt-feature-grid p{
    margin:0;
    color:#64748b;
    font-size:13px;
    line-height:1.6;
}

.hmkt-dns{background:#fff}

.hmkt-split{
    display:grid;
    grid-template-columns:1fr .8fr;
    gap:72px;
    align-items:center;
}

.hmkt-split ul{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:0;
    margin:24px 0 0;
    list-style:none;
}

.hmkt-split li{
    padding:7px 10px;
    border:1px solid #dbe4ef;
    border-radius:999px;
    background:#f8fafc;
    font-size:11px;
    font-weight:700;
}

.hmkt-dns-card{
    padding:25px;
    border:1px solid #dfe6ef;
    border-radius:18px;
    box-shadow:0 18px 50px rgba(15,23,42,.07);
}

.hmkt-dns-card>small{
    color:#64748b;
    font-size:10px;
    letter-spacing:.08em;
}

.hmkt-dns-card>strong{
    display:block;
    margin:5px 0 17px;
    font-size:21px;
}

.hmkt-dns-card>div{
    display:flex;
    justify-content:space-between;
    padding:11px 0;
    border-top:1px solid #edf1f5;
}

.hmkt-dns-card b{color:#17834a}

.hmkt-dns-card em{
    display:block;
    margin-top:15px;
    padding:10px 12px;
    border-radius:10px;
    background:#eaf8ef;
    color:#168144;
    font-style:normal;
    font-size:12px;
    font-weight:700;
}

.hmkt-pricing-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.hmkt-pricing-grid article{
    position:relative;
    padding:25px;
    border:1px solid #dfe6ef;
    border-radius:17px;
    background:#fff;
}

.hmkt-pricing-grid article.featured{
    border-color:#9ec1ff;
    box-shadow:0 18px 45px rgba(37,99,235,.10);
}

.hmkt-popular{
    position:absolute;
    top:17px;
    right:17px;
    padding:5px 8px;
    border-radius:999px;
    background:#eaf1ff;
    color:#2563eb;
    font-size:9px;
    font-weight:800;
}

.hmkt-pricing-grid small{
    color:#64748b;
    font-size:10px;
    letter-spacing:.08em;
}

.hmkt-pricing-grid h3{
    margin:9px 0 16px;
    font-size:23px;
}

.hmkt-price strong{
    font-size:28px;
    letter-spacing:-.02em;
}

.hmkt-price span{
    color:#64748b;
    font-size:11px;
}

.hmkt-pricing-grid ul{
    display:grid;
    gap:9px;
    min-height:150px;
    padding:20px 0 0;
    margin:20px 0;
    border-top:1px solid #edf1f5;
    list-style:none;
}

.hmkt-pricing-grid li{
    color:#475569;
    font-size:12px;
}

.hmkt-pricing-grid li:before{
    content:"✓";
    margin-right:7px;
    color:#168144;
    font-weight:800;
}

.hmkt-pricing-grid a{
    display:flex;
    justify-content:space-between;
    color:#2563eb;
    font-size:12px;
    font-weight:800;
    text-decoration:none;
}

.hmkt-price-note{
    margin:16px 0 0;
    text-align:center;
    color:#64748b;
    font-size:11px;
}

.hmkt-cta{
    padding:68px 0;
    background:#0f172a;
    color:#fff;
}

.hmkt-cta-inner{
    display:flex;
    justify-content:space-between;
    gap:50px;
    align-items:center;
}

.hmkt-cta p{
    max-width:680px;
    color:#aab6c5;
}

@media(max-width:900px){
    .hmkt-hero-grid,
    .hmkt-split{
        grid-template-columns:1fr;
    }

    .hmkt-feature-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .hmkt-pricing-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:620px){
    .hmkt-wrap{
        width:min(100% - 28px,1180px);
    }

    .hmkt-hero{
        padding:58px 0;
    }

    .hmkt-hero h1{
        font-size:38px;
    }

    .hmkt-actions,
    .hmkt-cta-inner{
        display:grid;
    }

    .hmkt-feature-grid,
    .hmkt-pricing-grid{
        grid-template-columns:1fr;
    }

    .hmkt-preview-grid{
        grid-template-columns:1fr;
    }

    .hmkt-section{
        padding:60px 0;
    }
}
