/* INDEX LANDING (1:1) — doar pentru index. NU atinge site.css */

.lxHero{ position: relative; padding: 0; }
.lxHeroMedia{
    position: relative;
    width: 100%;
    height: clamp(420px, 62vh, 640px);
    overflow: hidden;
    background: #0e0c0a;
}
/* HERO slideshow compatibil cu JS-ul tău (heroSlide + heroSlideImg--a/b) */
.heroSlide{
    position:absolute;
    inset:0;
    overflow:hidden;
    background:#0e0c0a;
}

.heroSlideImg{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    transform: scale(1.03);
    opacity: 0;
    transition: opacity .8s ease, transform 3.5s ease;
}

.heroSlideImg.is-on{
    opacity: 1;
    transform: scale(1);
}


.lxHeroStage{ position:absolute; inset:0; }
.lxHeroImg, .lxHeroVideo{
    position:absolute; inset:0;
    width:100%; height:100%;
    background-size: cover;
    background-position: center;
    transform: scale(1.03);
    opacity: 0;
    transition: opacity .8s ease, transform 3.5s ease;
}
.lxHeroImg.is-on{ opacity:1; transform: scale(1); }
.lxHeroVideo{
    opacity:1;
    object-fit: cover;
}

.lxHeroOverlay{
    position:absolute; inset:0;
    background:
            radial-gradient(900px 500px at 50% 25%, rgba(0,0,0,.10), rgba(0,0,0,.60)),
            linear-gradient(to bottom, rgba(0,0,0,.25), rgba(0,0,0,.55));
}

.lxHeroCenter{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding: 0 18px;
    color: #f7f2ea;
    z-index:2;
}

.lxHeroKicker{
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: clamp(26px, 3.2vw, 44px);
    text-shadow: 0 10px 28px rgba(0,0,0,.55);
}
.lxHeroSub{
    margin-top: 6px;
    opacity:.92;
    font-size: clamp(14px, 1.3vw, 18px);
    text-shadow: 0 10px 28px rgba(0,0,0,.55);
}
.lxHeroBtn{
    margin-top: 16px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: 12px 22px;
    border-radius: 12px;
    font-weight: 900;
    letter-spacing: .02em;
    border: 1px solid rgba(0,0,0,.18);
    background: linear-gradient(135deg, rgba(201,138,58,.98), rgba(240,195,90,.95));
    box-shadow: 0 18px 45px rgba(0,0,0,.35);
}
.lxHeroBtn:hover{ transform: translateY(-1px); }
.lxHeroNote{
    margin-top: 10px;
    opacity:.9;
    font-weight: 700;
}

/* overlap bar */
.lxOverWrap{ position: relative; z-index: 5; }
.lxOverBar{
    margin-top: -42px;
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(0,0,0,.10);
    box-shadow: 0 22px 55px rgba(0,0,0,.16);
    backdrop-filter: blur(10px);
}
.lxOverItem{ display:flex; gap:12px; align-items:center; padding: 8px 10px; }
.lxOverIco{
    width: 44px; height: 44px;
    border-radius: 999px;
    display:grid; place-items:center;
    background: linear-gradient(135deg, rgba(201,138,58,.35), rgba(240,195,90,.18));
    border: 1px solid rgba(0,0,0,.10);
    font-weight: 900;
}
.lxOverTitle{ font-weight: 900; }
.lxOverText{ opacity:.75; font-size: 13px; }

/* paper sections */
.lxSection{ padding: 56px 0; }
.lxPaper{
    background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35));
    border-top: 1px solid rgba(0,0,0,.06);
    border-bottom: 1px solid rgba(0,0,0,.06);
}
.lxTitle{
    text-align:center;
    font-weight: 900;
    letter-spacing: -.02em;
    font-size: clamp(22px, 2.2vw, 34px);
}
.lxLead{
    text-align:center;
    margin-top: 6px;
    opacity:.75;
}

.lxCards{
    margin-top: 18px;
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
}
.lxCard{
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.10);
    box-shadow: 0 18px 40px rgba(0,0,0,.14);
    background: #fff;
}
.lxCardImg{
    height: 230px;
    background-size: cover;
    background-position: center;
    filter: saturate(1.02);
}
.lxCardLabel{
    position:absolute;
    left:0; right:0; bottom:0;
    padding: 12px 14px;
    color: #fff;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: linear-gradient(180deg, transparent, rgba(0,0,0,.65));
}

.lxCenter{ display:flex; justify-content:center; margin-top: 16px; }
.lxDarkBtn{
    display:inline-flex;
    padding: 12px 22px;
    border-radius: 12px;
    background: rgba(20,18,16,.92);
    color:#fff;
    border: 1px solid rgba(255,255,255,.10);
    font-weight: 900;
    letter-spacing:.02em;
    box-shadow: 0 18px 40px rgba(0,0,0,.18);
}

/* dark band */
.lxBand{
    padding: 52px 0;
    background:
            radial-gradient(900px 380px at 50% 0%, rgba(201,138,58,.20), transparent 60%),
            linear-gradient(180deg, #3a2f23, #2a221a);
    color: rgba(255,255,255,.92);
}
.lxBandHead{
    display:flex; align-items:center; gap:14px;
    justify-content:center;
    margin-bottom: 18px;
}
.lxBandTitle{ font-weight: 900; font-size: 22px; letter-spacing:.02em; }
.lxBandLine{ height:1px; width: 120px; background: rgba(240,195,90,.55); }

.lxBandGrid{
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
    margin-top: 8px;
}
.lxBandItem{
    text-align:center;
    padding: 16px;
    border-radius: 16px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
}
.lxBandIco{ font-size: 26px; margin-bottom: 6px; }
.lxBandH{ font-weight: 900; margin-top: 4px; }
.lxBandP{ opacity:.85; font-size: 13px; margin-top: 6px; }

/* contact */
.lxContact{ padding: 56px 0 66px; }
.lxContactGrid{
    display:grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 16px;
    align-items: stretch;
}
.lxFormCard{
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 18px;
    box-shadow: 0 18px 44px rgba(0,0,0,.10);
    padding: 18px;
}
.lxTitle2{ font-weight: 900; font-size: 26px; }
.lxLead2{ opacity:.75; margin-top: 4px; }

.lxForm{ margin-top: 12px; }
.lxRow2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lxForm input, .lxForm textarea{
    width: 100%;
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,.14);
    background: rgba(255,255,255,.86);
    padding: 12px 12px;
    outline: none;
    font: inherit;
}
.lxForm textarea{ margin-top: 12px; resize: vertical; }
.lxSubmit{
    margin-top: 12px;
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.20);
    background: rgba(58,47,35,.92);
    color:#fff;
    font-weight: 900;
    letter-spacing:.02em;
}

.lxContactMedia{
    position:relative;
    border-radius: 18px;
    overflow:hidden;
    border: 1px solid rgba(0,0,0,.10);
    box-shadow: 0 18px 44px rgba(0,0,0,.10);
    background: rgba(255,255,255,.60);
}
.lxContactImg{
    height: 100%;
    min-height: 360px;
    background-size: cover;
    background-position: center;
    filter: saturate(1.02);
}
.lxContactInfo{
    position:absolute;
    left: 16px; bottom: 16px;
    right: 16px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(0,0,0,.10);
    backdrop-filter: blur(10px);
}
.lxInfoRow{ display:flex; align-items:center; gap:10px; padding: 6px 0; }
.lxDot{ width:10px;height:10px;border-radius:999px;background: rgba(201,138,58,.95); box-shadow: 0 0 0 4px rgba(201,138,58,.18); }

@media (max-width: 980px){
    .lxOverBar{ grid-template-columns: 1fr; margin-top: -34px; }
    .lxCards{ grid-template-columns: 1fr; }
    .lxBandGrid{ grid-template-columns: 1fr; }
    .lxContactGrid{ grid-template-columns: 1fr; }
    .lxRow2{ grid-template-columns: 1fr; }
    .lxContactImg{ min-height: 300px; }
}
.lxContactImg{
    width: 100%;
    height: 280px;              /* ajustezi cum vrei */
    border-radius: 18px;
    background: url("/poze/contact.png") center/cover no-repeat;
    position: relative;
    overflow: hidden;
}

/* un overlay ușor, ca să se citească bine info */
.lxContactImg::after{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(to bottom, rgba(0,0,0,.10), rgba(0,0,0,.35));
}


/* PARTENERI - loop infinit (premium) */
.lxPartners{
    background: linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,.28));
    border-top: 1px solid rgba(0,0,0,.06);
    border-bottom: 1px solid rgba(0,0,0,.06);
}

.pMarquee{
    position: relative;
    margin-top: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 18px 44px rgba(0,0,0,.10);
    overflow: hidden;
    padding: 14px 0;
}

/* fade edges */
.pMarquee::before,
.pMarquee::after{
    content:"";
    position:absolute;
    top:0; bottom:0;
    width: 90px;
    z-index: 2;
    pointer-events: none;
}
.pMarquee::before{
    left:0;
    background: linear-gradient(to right, rgba(255,255,255,.95), rgba(255,255,255,0));
}
.pMarquee::after{
    right:0;
    background: linear-gradient(to left, rgba(255,255,255,.95), rgba(255,255,255,0));
}

.pTrack{
    display:flex;
    align-items:center;
    gap: 14px;
    will-change: transform;
    transform: translate3d(0,0,0);
}

.pItem{
    height: 72px;
    min-width: 160px;
    padding: 10px 14px;
    border-radius: 14px;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(0,0,0,.07);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: 0 10px 26px rgba(0,0,0,.06);
}

.pItem img{
    max-height: 42px;
    max-width: 100%;
    object-fit: contain;
    opacity: .92;
    transition: opacity .2s ease, transform .2s ease;
}
.pItem:hover img{
    opacity: 1;
    transform: translateY(-1px);
}

/* pauză pe hover */
.pMarquee:hover .pTrack{ animation-play-state: paused; }

@media (max-width: 980px){
    .pMarquee::before, .pMarquee::after{ width: 50px; }
    .pItem{ min-width: 140px; height: 66px; }
    .pItem img{ max-height: 38px; }
}
