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

.hero{
    padding-top:65px;
    min-height:calc(100svh - 65px);

    display:flex;
    align-items:center;

    background:#fff7ef;
    overflow:hidden;
}

.hero-container{
    width:100%;

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

    gap:clamp(24px,4vw,70px);
}

.hero-left{
    flex:1;
    max-width:650px;
}

.hero-tag{
    display:inline-block;

    background:#fff;

    border:1px solid rgba(239,144,45,.18);

    box-shadow:0 10px 30px rgba(239,144,45,.08);

    padding:10px 22px;

    border-radius:30px;

    margin-bottom:clamp(18px,2vw,28px);

    font-weight:500;
}

.hero-left h1{

    font-size:clamp(2.6rem,5vw,4.2rem);

    line-height:1.1;

    margin-bottom:20px;
}

.hero-left h1 span{

    color:#ef902d;
}

.hero-left p{

    font-size:clamp(1rem,1.2vw,1.15rem);

    color:#555;

    line-height:1.8;

    margin-bottom:32px;

    max-width:560px;
}

.hero-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;
}

.hero-trust{

    display:flex;

    flex-wrap:wrap;

    gap:22px;

    margin-top:24px;
}

.trust-item{

    display:flex;

    align-items:center;

    gap:8px;
}

.trust-item i{

    color:#ef902d;

    font-size:18px;
}

.trust-item span{

    font-size:15px;

    font-weight:500;

    color:#444;
}

/* RIGHT */

.hero-right{

    position:relative;

    flex:1;

    display:flex;

    justify-content:center;

    align-items:flex-end;

    min-height:100%;

    overflow:visible;
}

.hero-right::before{

    content:"";

    position:absolute;

    width:clamp(340px,38vw,520px);

    aspect-ratio:1;

    border-radius:50%;

    background:radial-gradient(
        circle,
        rgba(239,144,45,.18) 0%,
        rgba(239,144,45,.08) 45%,
        transparent 75%
    );

    z-index:0;
}

.hero-image-wrapper{

    position:relative;

    display:flex;

    justify-content:center;

    align-items:center;
}

.hero-image-wrapper::before{

    content:"";

    position:absolute;

    width:clamp(280px,32vw,420px);

    aspect-ratio:1;

    border-radius:50%;

    background:rgba(239,144,45,.08);

    z-index:0;
}

.hero-image-wrapper::after{

    content:"";

    position:absolute;

    width:clamp(220px,24vw,320px);

    aspect-ratio:1;

    border-radius:50%;

    border:2px dashed rgba(239,144,45,.15);

    z-index:0;
}

.hero-right img{

    width:min(100%,580px);

    height:auto;

    position:relative;

    z-index:2;

    filter:drop-shadow(0 30px 40px rgba(0,0,0,.18));

    transition:.4s ease;
}

.hero-right img:hover{

    transform:translateY(-8px) scale(1.02);
}

/* FLOATING CARDS */

.floating-card{

    position:absolute;

    width:clamp(220px,18vw,260px);

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

    backdrop-filter:blur(18px);

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

    border-radius:20px;

    padding:18px;

    display:flex;

    align-items:center;

    gap:15px;

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

    box-shadow:0 20px 40px rgba(0,0,0,.10);

    z-index:5;
}

.floating-card i{

    width:52px;

    height:52px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#ef902d;

    color:#fff;

    font-size:20px;
}

.floating-card h3{

    font-size:18px;

    margin:0;
}

.floating-card p{

    margin:0;

    color:#666;

    font-size:14px;
}

.card1{

    top:8%;

    left:2%;
}

.card2{

    top:42%;

    right:-5%;
}

.card3{

    bottom:8%;

    left:-12%;
}

/* BUTTONS */

.btn-fill,
.btn-outline{

    transition:.35s ease;
}

.btn-fill:hover{

    transform:translateY(-4px);

    box-shadow:0 18px 35px rgba(239,144,45,.35);
}

.btn-outline:hover{

    transform:translateY(-4px);
}

/* MOBILE IMAGE */

.hero-mobile-image{

    display:none;
}

/* MOBILE BADGE */

.mobile-badge{

    position:absolute;

    bottom:20px;

    right:10px;

    display:flex;

    align-items:center;

    gap:10px;

    padding:12px 18px;

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

    border-radius:18px;

    box-shadow:0 12px 30px rgba(0,0,0,.12);

    z-index:5;
}

.mobile-badge i{

    width:45px;

    height:45px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#ef902d;

    color:#fff;
}

.mobile-badge h3{

    font-size:18px;
}

.mobile-badge p{

    margin:0;

    font-size:13px;
}
/* Floating card text safety — retain existing desktop layout */
.floating-card > div {
    min-width: 0;
    flex: 1 1 auto;
}

.floating-card h3,
.floating-card p {
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}

.floating-card p {
    line-height: 1.3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}