/* ==========================================================
   HOSTING MAGAZINE
   PRIVACY POLICY V1
   ========================================================== */


/* ==========================================================
   ROOT
   ========================================================== */

.hm-privacy{
    background:#fff;
    color:var(--hm-text-700);
}

.hm-privacy-section-eyebrow{
    margin:0 0 9px;

    color:var(--hm-blue-600);

    font-size:10px;
    line-height:1.2;
    font-weight:900;

    letter-spacing:.11em;
    text-transform:uppercase;
}


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

.hm-privacy-hero{
    position:relative;

    overflow:hidden;

    padding:112px 0 96px;

    background:
        radial-gradient(
            circle at 82% 12%,
            rgba(37,99,235,.30),
            transparent 31%
        ),
        radial-gradient(
            circle at 65% 115%,
            rgba(16,185,129,.08),
            transparent 29%
        ),
        linear-gradient(
            135deg,
            #061426 0%,
            #0b1b31 58%,
            #17346e 100%
        );

    color:#cbd5e1;
}

.hm-privacy-hero::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    opacity:.08;

    background-image:
        linear-gradient(
            rgba(255,255,255,.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.06) 1px,
            transparent 1px
        );

    background-size:58px 58px;
}

.hm-privacy-hero__inner{
    position:relative;
    z-index:2;

    width:100%;
    max-width:900px;

    margin-inline:auto;
}

.hm-privacy-hero__eyebrow{
    margin:0 0 13px;

    color:#93c5fd;

    font-size:10px;
    font-weight:900;

    letter-spacing:.12em;
    text-transform:uppercase;
}

.hm-privacy-hero__title{
    margin:0 0 20px!important;

    color:#fff!important;

    font-size:54px!important;
    line-height:1.04!important;
    font-weight:850!important;

    letter-spacing:-.04em!important;
    text-transform:none!important;

    -webkit-text-fill-color:#fff!important;
}

.hm-privacy-hero__intro{
    max-width:720px;

    margin:0!important;

    color:#cbd5e1!important;

    font-size:16px!important;
    line-height:1.72!important;
}

.hm-privacy-hero__meta{
    display:flex;
    flex-wrap:wrap;

    gap:8px;

    margin-top:27px;
}

.hm-privacy-hero__meta span{
    display:inline-flex;
    align-items:center;

    min-height:33px;

    padding:7px 11px;

    border:1px solid rgba(255,255,255,.15);
    border-radius:999px;

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

    color:#e2e8f0;

    font-size:10.5px;
    line-height:1;
    font-weight:800;
}


/* ==========================================================
   OVERVIEW
   ========================================================== */

.hm-privacy-overview{
    border-bottom:1px solid var(--hm-border-soft);

    background:#fff;
}

.hm-privacy-overview__grid{
    display:grid;

    grid-template-columns:repeat(4,minmax(0,1fr));
}

.hm-privacy-overview__grid > div{
    display:grid;

    grid-template-columns:36px minmax(0,1fr);

    gap:12px;

    align-items:center;

    padding:24px;

    border-right:1px solid var(--hm-border-soft);
}

.hm-privacy-overview__grid > div:first-child{
    padding-left:0;
}

.hm-privacy-overview__grid > div:last-child{
    padding-right:0;
    border-right:0;
}

.hm-privacy-overview__grid > div > span{
    display:flex;

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

    width:34px;
    height:34px;

    border-radius:999px;

    background:var(--hm-blue-050);
    color:var(--hm-blue-700);

    font-size:9.5px;
    font-weight:900;
}

.hm-privacy-overview strong{
    display:block;

    margin-bottom:4px;

    color:var(--hm-text-900);

    font-size:11.5px;
    line-height:1.25;
}

.hm-privacy-overview p{
    margin:0!important;

    color:var(--hm-text-500)!important;

    font-size:10.5px!important;
    line-height:1.45!important;
}


/* ==========================================================
   DOCUMENT
   ========================================================== */

.hm-privacy-document{
    padding:80px 0 90px;

    background:
        linear-gradient(
            180deg,
            #fff 0%,
            #f8fafc 100%
        );
}

.hm-privacy-layout{
    display:grid;

    grid-template-columns:
        minmax(220px,250px)
        minmax(0,790px);

    justify-content:center;

    gap:64px;

    align-items:start;
}


/* ==========================================================
   INDEX
   ========================================================== */

.hm-privacy-index{
    min-width:0;
}

.hm-privacy-index__sticky{
    position:sticky;

    top:102px;

    padding:22px 20px;

    border:1px solid var(--hm-border);
    border-radius:16px;

    background:#fff;

    box-shadow:
        0 15px 42px rgba(15,23,42,.05);
}

.hm-privacy-index__eyebrow{
    margin-bottom:12px;

    color:var(--hm-blue-600);

    font-size:9.5px;
    font-weight:900;

    letter-spacing:.10em;
    text-transform:uppercase;
}

.hm-privacy-index nav{
    display:grid;
}

.hm-privacy-index nav a{
    display:block;

    padding:9px 0;

    border-top:1px solid var(--hm-border-soft);

    color:var(--hm-text-600);

    font-size:10.5px;
    line-height:1.35;
    font-weight:700;

    text-decoration:none!important;

    transition:
        color .16s ease,
        transform .16s ease;
}

.hm-privacy-index nav a:hover{
    color:var(--hm-blue-700);

    transform:translateX(2px);
}


/* ==========================================================
   CONTENT CARD
   ========================================================== */

.hm-privacy-content{
    min-width:0;

    overflow:hidden;

    border:1px solid var(--hm-border);
    border-radius:20px;

    background:#fff;

    box-shadow:
        0 22px 60px rgba(15,23,42,.07);
}

.hm-privacy-content__head{
    padding:30px 32px 27px;

    border-bottom:1px solid var(--hm-border-soft);

    background:
        linear-gradient(
            135deg,
            #f8fbff 0%,
            #fff 100%
        );
}

.hm-privacy-content__head h2{
    margin:0!important;

    color:var(--hm-text-900)!important;

    font-size:29px!important;
    line-height:1.15!important;
    font-weight:850!important;

    letter-spacing:-.025em!important;
}

.hm-privacy-content__head p{
    max-width:650px;

    margin:11px 0 0!important;

    color:var(--hm-text-500)!important;

    font-size:12px!important;
    line-height:1.65!important;
}


/* ==========================================================
   POLICY COPY
   ========================================================== */

.hm-privacy-copy{
    padding:34px 34px 40px;
}

.hm-privacy-copy .hm-privacy-heading{
    scroll-margin-top:112px;

    margin:37px 0 13px!important;
    padding-top:31px;

    border-top:1px solid var(--hm-border-soft);

    color:var(--hm-text-900)!important;

    font-size:21px!important;
    line-height:1.25!important;
    font-weight:850!important;

    letter-spacing:-.015em!important;
    text-transform:none!important;
}

.hm-privacy-copy .hm-privacy-heading:first-child{
    margin-top:0!important;
    padding-top:0;

    border-top:0;
}

.hm-privacy-copy p{
    margin:0 0 17px!important;

    color:var(--hm-text-600)!important;

    font-size:13px!important;
    line-height:1.78!important;
}

.hm-privacy-copy p:last-child{
    margin-bottom:0!important;
}

.hm-privacy-copy strong{
    color:var(--hm-text-900);
}

.hm-privacy-copy a{
    color:var(--hm-blue-700)!important;

    text-decoration:underline;
    text-underline-offset:3px;
}

.hm-privacy-copy ul,
.hm-privacy-copy ol{
    margin:0 0 20px!important;
    padding-left:22px!important;
}

.hm-privacy-copy li{
    margin:7px 0!important;

    color:var(--hm-text-600);

    font-size:13px;
    line-height:1.7;
}


/* ==========================================================
   FINAL PANEL
   ========================================================== */

.hm-privacy-final{
    padding:0 0 90px;

    background:#f8fafc;
}

.hm-privacy-final__panel{
    display:flex;

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

    gap:52px;

    padding:38px 40px;

    border-radius:21px;

    background:
        linear-gradient(
            135deg,
            #07172a 0%,
            #0c2341 100%
        );

    box-shadow:
        0 26px 70px rgba(15,23,42,.12);
}

.hm-privacy-final__panel h2{
    margin:0!important;

    color:#fff!important;

    font-size:30px!important;
    line-height:1.15!important;
    font-weight:850!important;

    letter-spacing:-.025em!important;

    -webkit-text-fill-color:#fff!important;
}

.hm-privacy-final__panel p{
    max-width:720px;

    margin:13px 0 0!important;

    color:#9fb0c5!important;

    font-size:12px!important;
    line-height:1.65!important;
}

.hm-privacy-final__panel > a{
    display:inline-flex;

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

    gap:18px;

    min-width:170px;
    min-height:46px;

    padding:0 17px;

    border:1px solid rgba(255,255,255,.13);
    border-radius:10px;

    background:rgba(255,255,255,.06);
    color:#fff!important;

    white-space:nowrap;

    font-size:11px;
    font-weight:850;

    text-decoration:none!important;
}


/* ==========================================================
   DOCUMENT BOTTOM
   ========================================================== */

html{
    background:var(--hm-navy-950);
}

body.hm-privacy-active{
    margin-bottom:0!important;
    padding-bottom:0!important;

    background:var(--hm-navy-950)!important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:950px){

    .hm-privacy-hero{
        padding:84px 0 76px;
    }

    .hm-privacy-overview__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hm-privacy-overview__grid > div{
        border-bottom:1px solid var(--hm-border-soft);
    }

    .hm-privacy-overview__grid > div:nth-child(2n){
        border-right:0;
    }

    .hm-privacy-layout{
        grid-template-columns:1fr;

        gap:30px;
    }

    .hm-privacy-index__sticky{
        position:static;
    }

    .hm-privacy-index nav{
        grid-template-columns:repeat(3,minmax(0,1fr));

        column-gap:22px;
    }

}


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

@media(max-width:650px){

    .hm-privacy-hero{
        padding:62px 0 58px;
    }

    .hm-privacy-hero__title{
        font-size:38px!important;
    }

    .hm-privacy-overview__grid{
        grid-template-columns:1fr;
    }

    .hm-privacy-overview__grid > div,
    .hm-privacy-overview__grid > div:first-child,
    .hm-privacy-overview__grid > div:last-child{
        padding:18px 0;

        border-right:0;
        border-bottom:1px solid var(--hm-border-soft);
    }

    .hm-privacy-overview__grid > div:last-child{
        border-bottom:0;
    }

    .hm-privacy-document{
        padding:56px 0 64px;
    }

    .hm-privacy-index nav{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hm-privacy-content__head{
        padding:24px 20px 22px;
    }

    .hm-privacy-content__head h2{
        font-size:25px!important;
    }

    .hm-privacy-copy{
        padding:26px 20px 31px;
    }

    .hm-privacy-copy .hm-privacy-heading{
        font-size:19px!important;
    }

    .hm-privacy-final{
        padding-bottom:68px;
    }

    .hm-privacy-final__panel{
        align-items:flex-start;
        flex-direction:column;

        padding:27px 22px;
    }

    .hm-privacy-final__panel h2{
        font-size:26px!important;
    }

}


/* ==========================================================
   VERY SMALL
   ========================================================== */

@media(max-width:430px){

    .hm-privacy-hero__title{
        font-size:34px!important;
    }

    .hm-privacy-index nav{
        grid-template-columns:1fr;
    }

}
