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

.contacts-hero{

    position:relative;

    width:100%;

    margin-top:110px;

    min-height:760px;

    margin-bottom:90px;

    border-radius:0;

    overflow:hidden;

    background:
        linear-gradient(
            rgba(18,18,18,.55),
            rgba(18,18,18,.55)
        ),
        url("../images/contacts/hero.jpg");

    background-size:cover;

    background-position:center center;

}

.contacts-hero-overlay{

    width:100%;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:60px;

}

.contacts-hero-content{

    max-width:900px;

}

.contacts-label{

    display:block;

    margin-bottom:18px;

    letter-spacing:5px;

    text-transform:uppercase;

    font-size:14px;

    color:rgba(255,255,255,.75);

}

.contacts-hero h1{

    margin:0;

    font-size:86px;

    font-weight:300;

    color:#ffffff;

}

.contacts-hero p{

    max-width:820px;

    margin:35px auto 50px;

    font-size:24px;

    line-height:1.8;

    color:rgba(255,255,255,.88);

}

/* =======================================================
   ABOUT COMPANY
======================================================= */

.about-company{

    max-width:1450px;

    margin:50px auto;

    padding:0 40px;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

.about-company-image{

    border-radius:32px;

    overflow:hidden;

}

.about-company-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

}

.about-company-content{

    display:flex;

    flex-direction:column;

}

.section-tag{

    display:inline-block;

    margin-bottom:18px;

    letter-spacing:4px;

    text-transform:uppercase;

    font-size:14px;

    color:#b77d86;

}

.about-company h2{

    margin:0 0 30px;

    font-size:54px;

    font-weight:300;

    color:#2b2b2b;

    line-height:1.2;

}

.about-company p{

    margin:0 0 22px;

    font-size:18px;

    line-height:1.9;

    color:#666666;

}

.about-company-stats{

    display:flex;

    gap:40px;

    margin-top:35px;

}

.about-stat{

    display:flex;

    flex-direction:column;

}

.about-stat span{

    font-size:48px;

    font-weight:300;

    color:#b77d86;

}

.about-stat small{

    margin-top:10px;

    font-size:15px;

    color:#6d6d6d;

}

/* =======================================================
   WHY ENIGMA
======================================================= */

.about-advantages{

    max-width:1450px;

    margin:55px auto;

    padding:0 40px;

}

.advantages-header{

    text-align:center;

    margin-bottom:38px;

}

.advantages-header span{

    display:block;

    margin-bottom:16px;

    font-size:14px;

    letter-spacing:4px;

    text-transform:uppercase;

    color:#b77d86;

}

.advantages-header h2{

    margin:0;

    font-size:54px;

    font-weight:300;

    color:#2d2d2d;

}

.advantages-header p{

    max-width:760px;

    margin:28px auto 0;

    line-height:1.9;

    font-size:18px;

    color:#6d6d6d;

}

.advantages-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:28px;

}

.advantage-card{

    background:#ffffff;

    border-radius:30px;

    padding:40px 34px;

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

    transition:.35s;

}

.advantage-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.advantage-card span{

    display:block;

    margin-bottom:22px;

    font-size:42px;

    color:#b77d86;

    font-weight:300;

}

.advantage-card h3{

    margin:0 0 18px;

    font-size:23px;

    font-weight:500;

    color:#2f2f2f;

}

.advantage-card p{

    margin:0;

    line-height:1.8;

    color:#6c6c6c;

}

/* =======================================================
   CONTACTS
======================================================= */

.contacts-info{

    max-width:1450px;

    margin:55px auto;

    padding:0 40px;

}

.contacts-header{

    text-align:center;

    margin-bottom:38px;

}

.contacts-header span{

    display:block;

    margin-bottom:16px;

    letter-spacing:4px;

    text-transform:uppercase;

    color:#b77d86;

}

.contacts-header h2{

    margin:0;

    font-size:54px;

    font-weight:300;

}

.contacts-header p{

    max-width:760px;

    margin:28px auto 0;

    line-height:1.9;

    color:#6d6d6d;

}

.contacts-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.contact-card{

    background:#ffffff;

    border-radius:30px;

    padding:42px;

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

    transition:.35s;

}

.contact-card:hover{

    transform:translateY(-6px);

}

.contact-card h3{

    margin:0 0 24px;

    font-size:26px;

    font-weight:500;

    color:#2f2f2f;

}

.contact-card p{

    margin:12px 0;

    font-size:18px;

    line-height:1.8;

    color:#666666;

}

/* =======================================================
   DETAILS
======================================================= */

.company-details{

    max-width:1450px;

    margin:55px auto 70px;

    padding:0 40px;

}

.company-details-header{

    text-align:center;

    margin-bottom:38px;

}

.company-details-header span{

    display:block;

    margin-bottom:16px;

    letter-spacing:4px;

    text-transform:uppercase;

    color:#b77d86;

}

.company-details-header h2{

    margin:0;

    font-size:54px;

    font-weight:300;

}

.company-details-header p{

    max-width:760px;

    margin:28px auto 0;

    line-height:1.9;

    color:#6d6d6d;

}

.company-details-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}

.details-card{

    background:#ffffff;

    border-radius:30px;

    padding:42px;

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

    transition:.35s;

}

.details-card:hover{

    transform:translateY(-6px);

}

.details-card h3{

    margin:0 0 26px;

    font-size:24px;

    font-weight:500;

    color:#2f2f2f;

}

.detail-row{

    display:flex;

    justify-content:space-between;

    padding:16px 0;

    border-bottom:1px solid #ececec;

}

.detail-row:last-child{

    border-bottom:none;

}

.details-card p{

    margin:12px 0;

    line-height:1.8;

    color:#666666;

}

.details-card strong{

    color:#b77d86;

    font-size:20px;

}

/* =======================================================
   CTA
======================================================= */

.contacts-cta{

    position:relative;

    max-width:1450px;

    height:560px;

    margin:55px auto 40px;

    border-radius:36px;

    overflow:hidden;

    background:
        linear-gradient(
            rgba(22,22,22,.60),
            rgba(22,22,22,.60)
        ),
        url("../images/contacts/contacts-cta.jpg");

    background-size:cover;

    background-position:center;

}

.contacts-cta-overlay{

    width:100%;

    height:100%;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:80px;

}

.contacts-cta-label{

    margin-bottom:18px;

    font-size:14px;

    letter-spacing:5px;

    text-transform:uppercase;

    color:rgba(255,255,255,.75);

}

.contacts-cta h2{

    max-width:900px;

    margin:0;

    font-size:60px;

    font-weight:300;

    line-height:1.2;

    color:#ffffff;

}

.contacts-cta p{

    max-width:760px;

    margin:34px 0 48px;

    font-size:20px;

    line-height:1.9;

    color:rgba(255,255,255,.88);

}
/* =======================================================
   BUTTONS
======================================================= */

.services-btn{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    min-width:260px;

    height:62px;

    padding:0 38px;

    border:none;

    border-radius:100px;

    background:#ffffff;

    color:#222;

    font-size:17px;

    font-weight:500;

    cursor:pointer;

    transition:
        transform .35s,
        background .35s,
        box-shadow .35s;

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

}

.services-btn:hover{

    transform:translateY(-5px);

    background:#f5f5f5;

    box-shadow:
        0 24px 50px rgba(0,0,0,.25);

}

.services-btn:active{

    transform:translateY(-2px);

}

.contacts-hero .services-btn,
.contacts-cta .services-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:280px;

    height:64px;

    border:none;

    border-radius:999px;

    background:#ffffff;

    color:#222222;

    font-size:17px;

    font-weight:500;

    text-decoration:none;

    cursor:pointer;

    box-shadow:0 18px 45px rgba(0,0,0,.18);

    transition:all .35s ease;

}

.contacts-hero .services-btn:hover,
.contacts-cta .services-btn:hover{

    background:#f6f6f6;

    transform:translateY(-4px);

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

}
