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

.hero{
    min-height:980px;
    position:relative;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:
        radial-gradient(circle at 78% 42%, rgba(255,122,26,.12), transparent 36%),
        linear-gradient(180deg, #111315 0%, #0F1115 100%);
}

.hero-container{
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:43% 57%;
    align-items:center;
    min-height:980px;
    padding-top:var(--pz-navbar-height);
}

.hero-content{
    position:relative;
    z-index:5;
    max-width:590px;
}

.hero-title{
    margin-top:34px;
    color:var(--pz-white);
    font-size:clamp(72px,6vw,96px);
    line-height:.88;
    letter-spacing:-.07em;
    font-weight:900;
}

.hero-description{
    max-width:540px;
    margin-top:38px;
    color:#B7C0CF;
    font-size:20px;
    line-height:1.85;
}

.hero-description b{
    color:#fff;
    font-weight:800;
}

.hero-actions{
    margin-top:46px;
    display:flex;
    align-items:center;
}

.hero-actions .pz-btn{
    padding:20px 32px;
    box-shadow:
        0 18px 50px rgba(255,122,26,.28),
        inset 0 1px 0 rgba(255,255,255,.22);
}

.hero-actions .pz-btn span{
    font-size:21px;
    line-height:1;
}

.hero-proof{
    margin-top:38px;
    display:flex;
    align-items:center;
    gap:18px;
    max-width:520px;
}

.hero-stars{
    color:#FFD35A;
    font-size:18px;
    letter-spacing:3px;
    white-space:nowrap;
}

.hero-proof-text{
    position:relative;
    padding-left:18px;
    color:#A8B1C2;
    font-size:15px;
    line-height:1.55;
}

.hero-proof-text::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:1px;
    height:34px;
    transform:translateY(-50%);
    background:rgba(255,255,255,.14);
}

/* ==========================================================
   MEDIA
========================================================== */

.hero-media{
    position:absolute;
    right:-2vw;
    bottom:0;
    width:62%;
    height:960px;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    z-index:2;
}

.hero-photo-wrapper{
    position:relative;
    height:960px;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
}

.hero-photo-wrapper::before{
    content:"";
    position:absolute;
    right:8%;
    bottom:8%;
    width:620px;
    height:620px;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(255,122,26,.26),
            rgba(255,122,26,.09),
            transparent 72%
        );
    filter:blur(60px);
    z-index:1;
}

.hero-photo{
    position:relative;
    z-index:3;
    height:960px;
    width:auto;
    max-width:none;
    object-fit:contain;
    filter:drop-shadow(0 34px 90px rgba(0,0,0,.42));

    mask-image:
        linear-gradient(to left, black 74%, transparent 100%),
        linear-gradient(to bottom, black 84%, transparent 100%);

    -webkit-mask-image:
        linear-gradient(to left, black 74%, transparent 100%),
        linear-gradient(to bottom, black 84%, transparent 100%);
}

/* ==========================================================
   DECOR
========================================================== */

.hero-glow{
    position:absolute;
    right:-210px;
    bottom:20px;
    width:980px;
    height:980px;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(255,122,26,.22),
            rgba(255,122,26,.07),
            transparent 72%
        );
    filter:blur(45px);
    z-index:1;
    pointer-events:none;
}

.hero-bg-line{
    position:absolute;
    right:7%;
    top:20%;
    width:540px;
    height:320px;
    border:2px solid rgba(255,122,26,.07);
    border-left:none;
    border-bottom:none;
    border-radius:0 190px 0 0;
    transform:rotate(-4deg);
    z-index:1;
    pointer-events:none;
}