/* ===============================
   LUXURY BOUTIQUE BASE
=============================== */

:root {
  --bg-main: #F6F3EE;
  --bg-soft: #FBF9F6;
  --text-dark: #2C2A28;
  --text-light: #6B6661;
  --accent: #B46A4D;
  --accent-dark: #8F5039;
  --border-soft: #E8E2DA;
}

/* Reset */

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html, body{
  height:100%;
}

body{
  background:var(--bg-main);
  color:var(--text-dark);
  font-family:'Cormorant Garamond', serif;
  letter-spacing:0.4px;

  display:flex;
  flex-direction:column;
  overflow:hidden;
}

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

header{

  position:fixed;
  top:0;
  left:0;

  width:100%;
  height:95px;

  z-index:1000;

  background:rgba(246,243,238,0.97);
  backdrop-filter:blur(10px);

  padding:0 8%;

  display:flex;
  justify-content:space-between;
  align-items:center;

  border-bottom:1px solid var(--border-soft);
}

/* Logo */

.logo-area{
  display:flex;
  align-items:center;
}

.logo{
  height:70px;
  width:auto;
  object-fit:contain;

  padding:0;
  background:transparent;
  border-radius:0;
  box-shadow:none;

  transition:0.3s;
}

.logo:hover{
  transform:scale(1.05);
}

/* Navigation */

nav a{

  margin-left:35px;

  text-decoration:none;

  color:var(--text-dark);

  font-size:16px;

  font-weight:500;

  position:relative;

}

nav a::after{

  content:"";

  position:absolute;

  bottom:-6px;
  left:0;

  width:0;
  height:1px;

  background:var(--accent);

  transition:0.3s ease;

}

nav a:hover::after{

  width:100%;

}

/* ===============================
   MAIN
=============================== */

main{

  flex:1;

  margin-top:95px;
  margin-bottom:70px;

  overflow-y:auto;

}

/* ===============================
   FOOTER
=============================== */

footer{

  position:fixed;

  bottom:0;
  left:0;

  width:100%;
  height:70px;

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  background:rgba(246,243,238,0.98);

  border-top:1px solid var(--border-soft);

  font-size:14px;

  color:var(--text-light);

}

.footer-signature span{

  font-weight:500;

  color:var(--accent);

}

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

@media (max-width:768px){

header{

  height:80px;
  padding:0 5%;

}

.logo{

  height:55px;

}

main{

  margin-top:80px;

}

nav a{

  margin-left:18px;
  font-size:14px;

}

}