* {
  box-sizing: border-box;
}


body {

  margin:0;
  padding:0;

  background:#f4f0e8;

  color:#101827;

  font-family:Georgia,"Times New Roman",serif;

}



/* =================================
   HEADER
================================= */


.site-header {

  width:100%;

  padding:28px 5vw;

  display:flex;

  align-items:center;

  justify-content:space-between;

  border-bottom:1px solid rgba(154,122,61,.25);

}



.brand {

  font-size:15px;

  letter-spacing:.16em;

}



.main-nav {

  display:flex;

  align-items:center;

  gap:26px;

}



.main-nav a {

  text-decoration:none;

  color:#101827;

  font-size:13px;

  letter-spacing:.08em;

  transition:color .25s ease;

}



.main-nav a:hover {

  color:#9a7a3d;

}



.nav-divider {

  width:1px;

  height:16px;

  background:rgba(154,122,61,.5);

}



/* =================================
   INTRO
================================= */


.collection-intro {

  text-align:center;

  padding:90px 20px 55px;

}



.collection-intro h1 {

  font-size:52px;

  font-weight:500;

  letter-spacing:.12em;

  margin:0;

}



.collection-intro p {

  margin-top:25px;

  color:#9a7a3d;

  font-size:20px;

}



/* =================================
   LUXURY COLLECTION GRID
================================= */


.collection-sections {

  width:1250px;

  max-width:92%;

  margin:80px auto 120px;


  display:grid;

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

  gap:35px;

}



/* =================================
   COLLECTION CARD
================================= */


.collection-item {

  position:relative;

  text-align:center;

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

  border:1px solid rgba(176,138,69,.35);

  padding:12px 12px 18px;

  text-decoration:none;

  color:inherit;

  transition:

  transform .35s ease,

  border-color .35s ease;

}



.collection-item:hover {

  transform:translateY(-6px);

  border-color:#b08a45;

}



/* corner details */


.collection-item::before,
.collection-item::after {

  content:"";

  position:absolute;

  width:35px;

  height:35px;

  border-color:#b08a45;

}



.collection-item::before {

  top:-1px;

  left:-1px;

  border-top:1px solid;

  border-left:1px solid;

}



.collection-item::after {

  bottom:-1px;

  right:-1px;

  border-bottom:1px solid;

  border-right:1px solid;

}



/* IMAGE */


.collection-item img {

  width:100%;

  aspect-ratio:16 / 9;

  object-fit:cover;

  display:block;

}



/* TITLE */


.collection-item h2 {

  margin:22px 0 12px;

  font-family:Georgia,"Times New Roman",serif;

  font-size:22px;

  font-weight:400;

  letter-spacing:2px;

  color:#162033;

}



/* GOLD LINE */


.gold-line {

  width:45px;

  height:1px;

  background:#b08a45;

  margin:0 auto 10px;

}



/* COUNT */


.collection-item p {

  margin:0;

  font-family:Georgia,serif;

  font-size:13px;

  letter-spacing:2px;

  color:#444;

}



/* ALL DOMAINS CENTER */


.collection-item:last-child {

  grid-column:2;

}



/* =================================
   MOBILE
================================= */


@media(max-width:900px){


.collection-sections {

  grid-template-columns:1fr;

}



.collection-item:last-child {

  grid-column:auto;

}


}



@media(max-width:700px){


.site-header {

  flex-direction:column;

  gap:18px;

}



.main-nav {

  flex-wrap:wrap;

  justify-content:center;

}



.collection-intro h1 {

  font-size:36px;

}



.collection-sections {

  margin-top:50px;

}



.collection-item h2 {

  font-size:19px;

}


}
