

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Montserrat',sans-serif;
background:#fff;
color:#333;
}

.container{
width:90%;
max-width:1400px;
margin:auto;
}

/* HERO */

.catalog-hero{

height:500px;

position:relative;

display:flex;
align-items:center;
justify-content:center;

text-align:center;

background:
linear-gradient(
    rgba(0,0,0,.65),
    rgba(0,0,0,.65)
),
url('../images/hero-desserts.jpg');

background-size:cover;
background-position:center;


}

.catalog-content{


position:relative;
z-index:2;

color:white;

max-width:900px;


}

.catalog-content h1{


font-size:72px;

margin-bottom:20px;


}

.catalog-content p{

font-size:22px;

line-height:1.8;


}

/* NAVIGATION */

.catalog-nav{


position:sticky;
top:0;

z-index:100;

background:#111;

display:flex;

justify-content:center;

flex-wrap:wrap;

padding:15px;


}

.catalog-nav a{


color:white;

text-decoration:none;

margin:10px 20px;

font-weight:600;

transition:.3s;


}

.catalog-nav a:hover{


color:#c89b3c;


}

/* SECTIONS */

.catalog-section{


padding:90px 0;


}

.gray{


background:#f7f7f7;


}

.catalog-section h2{


text-align:center;

font-size:48px;

margin-bottom:50px;

color:#222;


}

.catalog-section h2::after{


content:"";

display:block;

width:80px;

height:4px;

background:#c89b3c;

margin:20px auto 0;


}

/* PRODUCTS */

.products-grid{


display:grid;

grid-template-columns:
repeat(auto-fit,minmax(320px,1fr));

gap:30px;


}

.product-card{


background:white;

border-radius:18px;

overflow:hidden;

box-shadow:
0 10px 30px rgba(0,0,0,.08);

transition:.3s;


}

.product-card:hover{


transform:translateY(-8px);


}

.product-card img{

    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;
}

@media(max-width:768px){

.product-card img{

    aspect-ratio:auto;
    height:auto;
}
}

.product-info{

padding:25px;


}

.product-info h3{


font-size:24px;

margin-bottom:10px;


}

.product-info p{


color:#666;

line-height:1.7;


}

/* CONTACT */

.catalog-contact{


background:#111;

color:white;

text-align:center;

padding:100px 20px;


}

.catalog-contact h2{


font-size:48px;

margin-bottom:20px;


}

.catalog-contact p{


font-size:20px;

margin-bottom:40px;


}

.catalog-btn{


display:inline-block;

background:#c89b3c;

color:white;

text-decoration:none;

padding:18px 40px;

border-radius:50px;

font-weight:700;


}

