.elementor-1872 .elementor-element.elementor-element-c7e4faf{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1872 .elementor-element.elementor-element-feea06b{--display:flex;}/* Start custom CSS for html, class: .elementor-element-7e5b13e */@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Inter:wght@300;400;500;600&display=swap');

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

body{
    font-family:'Inter',sans-serif;
    background:#071019;
    color:#fff;
}

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

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px;
    overflow:hidden;

    background:
    url("https://antonycooper.co.uk/wp-content/uploads/2026/06/pexels-guvo59-30453695-scaled.jpg")
    center center / cover no-repeat;
}

/* Purple overlay */

.hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;

    background:
        linear-gradient(
            135deg,
            rgba(18,8,45,.82) 0%,
            rgba(72,32,125,.58) 45%,
            rgba(10,10,25,.86) 100%
        );
}

/* Soft glow */

.hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;

    background:
        radial-gradient(circle at 18% 22%,rgba(168,85,247,.35),transparent 42%),
        radial-gradient(circle at 80% 70%,rgba(124,58,237,.28),transparent 42%),
        radial-gradient(circle at 50% 50%,rgba(255,255,255,.05),transparent 65%);

    animation:ambientGlow 12s ease-in-out infinite alternate;
}

.hero-content{

    position:relative;
    z-index:5;

    max-width:900px;

    padding:70px;

    text-align:center;

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

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

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

    border-radius:30px;

    box-shadow:
    0 25px 60px rgba(0,0,0,.35);

}

.eyebrow{

    letter-spacing:4px;

    text-transform:uppercase;

    color:#D6C7FF;

    font-size:.9rem;

    margin-bottom:25px;

}

.hero h1{

    font-family:'Cormorant Garamond',serif;

    font-size:clamp(3.5rem,8vw,6.5rem);

    line-height:.95;

    font-weight:600;

    color:#fff;

    margin-bottom:35px;

}

.lead{

    font-size:1.15rem;

    line-height:1.9;

    color:#E8E8F5;

    max-width:700px;

    margin:auto;

    margin-bottom:45px;

}

.hero-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

    margin-bottom:60px;

}

.btn-primary{

    background:linear-gradient(135deg,#8B5CF6,#5B21B6);

    color:#fff;

    text-decoration:none;

    padding:18px 40px;

    border-radius:60px;

    font-weight:600;

    transition:.35s;

}

.btn-primary:hover{

    transform:translateY(-5px);

    box-shadow:0 15px 40px rgba(139,92,246,.45);

}

.btn-secondary{

    color:#fff;

    text-decoration:none;

    padding:18px 40px;

    border-radius:60px;

    border:1px solid rgba(255,255,255,.3);

    transition:.35s;

}

.btn-secondary:hover{

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

}

.hero-icons{

    display:flex;

    justify-content:center;

    gap:70px;

    flex-wrap:wrap;

}

.hero-icons div{

    display:flex;

    flex-direction:column;

}

.hero-icons strong{

    font-size:2rem;

    color:#fff;

    margin-bottom:8px;

}

.hero-icons span{

    font-size:.95rem;

    color:#D3D3DF;

}

/* ==========================
   FLOATING PARTICLES
========================== */

.particles{

    position:absolute;

    inset:0;

    z-index:2;

    overflow:hidden;

}

.particles span{

    position:absolute;

    display:block;

    width:4px;

    height:4px;

    border-radius:50%;

    background:#fff;

    opacity:.25;

    animation:particles 22s linear infinite;

}

.particles span:nth-child(1){left:8%;animation-delay:1s;}
.particles span:nth-child(2){left:16%;animation-delay:4s;}
.particles span:nth-child(3){left:22%;animation-delay:9s;}
.particles span:nth-child(4){left:31%;animation-delay:13s;}
.particles span:nth-child(5){left:40%;animation-delay:18s;}
.particles span:nth-child(6){left:47%;animation-delay:6s;}
.particles span:nth-child(7){left:55%;animation-delay:10s;}
.particles span:nth-child(8){left:63%;animation-delay:16s;}
.particles span:nth-child(9){left:71%;animation-delay:20s;}
.particles span:nth-child(10){left:80%;animation-delay:8s;}
.particles span:nth-child(11){left:88%;animation-delay:15s;}
.particles span:nth-child(12){left:95%;animation-delay:5s;}
.particles span:nth-child(13){left:12%;animation-delay:11s;}
.particles span:nth-child(14){left:58%;animation-delay:3s;}
.particles span:nth-child(15){left:77%;animation-delay:14s;}

/* ==========================
   ANIMATIONS
========================== */

@keyframes particles{

    0%{

        transform:translateY(110vh);

        opacity:0;

    }

    15%{

        opacity:.25;

    }

    85%{

        opacity:.25;

    }

    100%{

        transform:translateY(-20vh);

        opacity:0;

    }

}

@keyframes ambientGlow{

    from{

        transform:scale(1);

        opacity:.85;

    }

    to{

        transform:scale(1.08);

        opacity:1;

    }

}

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

@media(max-width:768px){

.hero{

    padding:20px;

}

.hero-content{

    padding:40px 25px;

}

.hero h1{

    font-size:3.5rem;

}

.hero-icons{

    gap:30px;

}

.hero-icons div{

    width:100%;

}

}/* End custom CSS */