/* ======================================================
   CEZEL 2.0
   OFFER.CSS
   WERSJA PRODUKCYJNA
====================================================== */


/* ======================================================
   SEKCJA OFERTA
====================================================== */

.offer{

    background:#f8f6f3;

    padding:120px 0;

}


/* ======================================================
   KONTENER
====================================================== */

.offer-container{

    width:min(1200px,90%);

    margin:0 auto;

}


/* ======================================================
   NAGŁÓWEK
====================================================== */

.offer-header{

    max-width:760px;

    margin: 60px auto 80px;

    text-align:center;

}

.offer-header h2{

    font-family:var(--font-heading);

    font-size:52px;

    font-weight:700;

    color:var(--color-dark);

    margin-bottom:24px;

}

.offer-header p{

    font-size:20px;

    line-height:1.8;

    color:#666;

}


/* ======================================================
   SIATKA KART
====================================================== */

.offer-grid{

    display:grid;

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

    gap:30px;

}


/* ======================================================
   KARTA OFERTY
====================================================== */

.offer-card{

    background:#ffffff;

    border:1px solid #4A3428;

    border-radius:20px;

    overflow:hidden;

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

    transition:.35s;

}

.offer-card:hover{

    transform:translateY(-8px);

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

}


/* ======================================================
   PROJEKT / SZKIC
====================================================== */

.offer-project{

    width:100%;

    height:220px;

    overflow:hidden;

}

.offer-project img{

    width:100%;

    height:100%;

    object-fit:contain;

    display:block;
}


/* ======================================================
   REALIZACJA
====================================================== */

.offer-realization{

    width:100%;

    height:150px;

    overflow:hidden;

}

.offer-realization img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}


/* ======================================================
   TYTUŁ KARTY
====================================================== */

.offer-card h3{

    padding:20px;

    margin:0;

    text-align:center;

    font-size:22px;

    color:#222;

}


/* ======================================================
   DOLNA CZĘŚĆ
====================================================== */

.offer-bottom{

    text-align:center;

    margin-top:80px;

}

.offer-bottom p{

    font-size:20px;

    color:#555;

    margin-bottom:40px;

}

.offer-project,
.offer-realization {
    display:block;
    text-decoration:none;
    color:inherit;
}