.elementor-11 .elementor-element.elementor-element-eb3e70b{--display:flex;--min-height:100vh;--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-11 .elementor-element.elementor-element-eb3e70b:not(.elementor-motion-effects-element-type-background), .elementor-11 .elementor-element.elementor-element-eb3e70b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://lucianize.me/wp-content/uploads/2026/07/lucianize.png");background-position:center center;background-size:cover;}/* Start custom CSS for html, class: .elementor-element-ececd51 */:root{

    --gold:#C9A14A;
    --gold-light:#E6C877;
    --white:#ffffff;
    --text:#B8B8B8;

}

.hero{

    position:relative;

    overflow:hidden;

    background:transparent;

    min-height:100vh;

    display:flex;

    align-items:center;

}

.container{

    width:90%;

    max-width:1320px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:60px;

}

.hero-left{

    width:46%;

    z-index:5;

}

.hero-right{

    width:54%;

    display:flex;

    justify-content:flex-end;

}

.hero-dashboard{

    width:110%;

    max-width:900px;

    animation:float 6s ease-in-out infinite;

    user-select:none;

    pointer-events:none;

}

.hero-badge{

    display:inline-flex;

    align-items:center;

    gap:12px;

    padding:12px 20px;

    border-radius:100px;

    border:1px solid rgba(201,161,74,.3);

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

    backdrop-filter:blur(20px);

    color:var(--gold);

    letter-spacing:2px;

    font-size:13px;

    margin-bottom:35px;

    animation:fadeUp .6s ease forwards;

}

.hero-badge span{

    width:8px;

    height:8px;

    border-radius:50%;

    background:var(--gold);

    box-shadow:0 0 15px var(--gold);

}

.hero h1{

    font-size:72px;

    line-height:1.05;

    font-weight:700;

    margin-bottom:25px;

    animation:fadeUp .8s ease forwards;
    color:#ffffff;

}

.hero h1 span{

    color:var(--gold);

}

.hero p{

    color:var(--text);

    font-size:18px;

    line-height:1.9;

    max-width:550px;

    margin-bottom:45px;

    animation:fadeUp 1s ease forwards;

}

.hero-buttons{

    display:flex;

    gap:20px;

    margin-bottom:60px;

    animation:fadeUp 1.2s ease forwards;

}

.btn-primary{

    background:linear-gradient(135deg,var(--gold-light),var(--gold));

    color:#000;

    text-decoration:none;

    padding:18px 38px;

    border-radius:60px;

    font-weight:600;

    transition:.35s;

}

.btn-primary:hover{

    transform:translateY(-5px);

    box-shadow:0 15px 35px rgba(201,161,74,.35);

}

.btn-outline{

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

    color:#fff;

    text-decoration:none;

    padding:18px 38px;

    border-radius:60px;

    transition:.35s;

}

.btn-outline:hover{

    border-color:var(--gold);

    color:var(--gold);

}

.hero-stats{

    display:flex;

    gap:45px;

    flex-wrap:wrap;

    animation:fadeUp 1.4s ease forwards;

}

.stat{

    display:flex;

    align-items:center;

    gap:18px;

}

.stat-icon{

    width:60px;

    height:60px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    border:1px solid rgba(201,161,74,.25);

    color:var(--gold);

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

    backdrop-filter:blur(20px);

    transition:.35s;

}

.stat:hover .stat-icon{

    transform:translateY(-5px);

    box-shadow:0 0 25px rgba(201,161,74,.4);

    border-color:var(--gold);

}

.stat i{

    font-size:22px;

}

.stat strong{

    display:block;

    font-size:34px;

    color:#fff;

}

.stat span{

    color:#999;

    font-size:14px;

}

@keyframes float{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-18px);

}

100%{

transform:translateY(0px);

}

}

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:translateY(0);

}

}

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

@media(max-width:1024px){

.hero{

padding:120px 0;

min-height:auto;

}

.container{

flex-direction:column;

}

.hero-left{

width:100%;

text-align:center;

}

.hero-right{

width:100%;

justify-content:center;

margin-top:50px;

}

.hero-dashboard{

width:90%;

}

.hero p{

margin:auto auto 45px;

}

.hero-buttons{

justify-content:center;

}

.hero-stats{

justify-content:center;

}

.hero h1{

font-size:58px;

}

}

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

@media(max-width:768px){

.hero{

padding:100px 0 60px;

}

.hero h1{

font-size:42px;

}

.hero p{

font-size:16px;

line-height:1.8;

}

.hero-buttons{

flex-direction:column;

}

.btn-primary,

.btn-outline{

width:100%;

text-align:center;

}

.hero-dashboard{

width:115%;

}

.hero-stats{

flex-direction:column;

align-items:flex-start;

gap:25px;

}

.hero-left{

text-align:left;

}

.hero p{

margin-left:0;

}

}/* End custom CSS */