:root{
  --bg-nude:#f7f0e9;
  --text-mocha:#4a3e37;
  --text-light:#8a7b72;
  --white:#ffffff;
  --serif:'Cormorant Garamond',serif;
  --sans:'Montserrat',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  background-color:var(--bg-nude);
  color:var(--text-mocha);
  font-family:var(--sans);
  font-weight:200;
  line-height:1.8;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
.container{max-width:1100px;margin:0 auto;padding:0 30px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300}
.main-nav{
  position:absolute;top:0;left:0;width:100%;z-index:10;padding:35px 0;
  background:rgba(247,240,233,.74);
  backdrop-filter:blur(4px);
  border-bottom:1px solid rgba(74,62,55,.12);
}
.flex-nav{display:flex;justify-content:space-between;align-items:center}
.logo{
  font-family:var(--serif);font-size:2rem;color:var(--text-mocha);
  border:1px solid rgba(74,62,55,.35);
  width:52px;height:52px;display:flex;justify-content:center;align-items:center;
}
.nav-links{list-style:none;display:flex;gap:28px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{
  text-decoration:none;color:var(--text-mocha);font-size:.75rem;
  letter-spacing:.2em;text-transform:uppercase;transition:opacity .3s ease;
}
.nav-links a:hover{opacity:.6}
.lang-switch{border:1px solid rgba(74,62,55,.35);padding:5px 12px}
.hero{
  position:relative;height:100vh;
  background:url('../media/serum-drop.jpg') center/cover no-repeat;
  display:flex;justify-content:center;align-items:center;text-align:center;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(247,240,233,.45) 0%,rgba(247,240,233,.65) 100%);
}
.hero-content{position:relative;z-index:2}
.brand-name{font-size:5rem;letter-spacing:.4em;color:var(--text-mocha);margin-bottom:0}
.brand-sub{font-family:var(--sans);font-size:.85rem;letter-spacing:.6em;color:var(--text-mocha);margin-bottom:20px}
.divider-heart{font-size:.8rem;color:var(--text-light);margin:15px 0}
.slogan{font-size:2rem;font-weight:300;text-transform:none;color:var(--text-mocha);margin-bottom:50px;line-height:1.4}
.slogan em{font-style:italic}
.btn-primary{
  display:inline-block;padding:16px 45px;
  border:1px solid var(--text-mocha);text-decoration:none;color:var(--text-mocha);
  text-transform:uppercase;font-size:.75rem;letter-spacing:.25em;transition:all .4s ease;
  background:rgba(247,240,233,.3);backdrop-filter:blur(4px);
}
.btn-primary:hover{background-color:var(--text-mocha);color:var(--bg-nude)}
.philosophy{padding:100px 0;text-align:center}
.philosophy h3{font-size:2rem;margin:15px 0 25px;letter-spacing:.05em}
.philosophy p{max-width:600px;margin:0 auto;color:var(--text-light);font-size:.95rem}
.accent-script{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--text-light);display:block;margin-bottom:10px}
.services-preview{padding:80px 0 120px;text-align:center}
.section-title{font-size:2rem;margin:10px 0 60px;letter-spacing:.05em}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;text-align:left}
.service-card{
  background:var(--white);border-radius:12px;overflow:hidden;
  box-shadow:0 15px 40px rgba(74,62,55,.07);transition:transform .4s ease,box-shadow .4s ease;
}
.service-card:hover{transform:translateY(-6px);box-shadow:0 25px 50px rgba(74,62,55,.12)}
.card-img{height:320px;background-size:cover;background-position:center}
.card-body{padding:40px}
.card-body h4{font-size:1.6rem;margin-bottom:12px;letter-spacing:.05em}
.card-body p{color:var(--text-light);font-size:.9rem;margin-bottom:20px}
.card-link{
  color:var(--text-mocha);text-decoration:none;font-size:.8rem;
  letter-spacing:.15em;text-transform:uppercase;
  border-bottom:1px solid var(--text-mocha);padding-bottom:2px;transition:opacity .3s ease;
}
.card-link:hover{opacity:.5}
.cta-band{background-color:var(--text-mocha);padding:80px 0;text-align:center}
.cta-band .accent-script{color:rgba(247,240,233,.7);font-size:1.5rem;margin-bottom:30px}
.btn-light{
  display:inline-block;padding:16px 50px;
  border:1px solid var(--bg-nude);text-decoration:none;color:var(--bg-nude);
  text-transform:uppercase;font-size:.75rem;letter-spacing:.25em;transition:all .4s ease;
}
.btn-light:hover{background-color:var(--bg-nude);color:var(--text-mocha)}
footer{padding:60px 0;text-align:center;background-color:var(--bg-nude)}
.footer-logo{
  font-family:var(--serif);font-size:1.8rem;border:1px solid var(--text-mocha);
  width:45px;height:45px;display:flex;justify-content:center;align-items:center;margin:0 auto 20px;
}
footer p{font-size:.8rem;color:var(--text-light);letter-spacing:.1em;margin-bottom:10px}
.footer-insta{font-size:.8rem;color:var(--text-light);text-decoration:none;letter-spacing:.1em;transition:opacity .3s ease}
.footer-insta:hover{opacity:.5}
.footer-content{display:flex;flex-direction:column;align-items:center;gap:5px}
@media(max-width:768px){
  .brand-name{font-size:3rem}
  .slogan{font-size:1.4rem}
  .service-grid{grid-template-columns:1fr}
  .main-nav{padding:25px 0}
  .nav-links{gap:14px}
  .nav-links a{font-size:.68rem;letter-spacing:.14em}
  .hero{height:100svh}
}