@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');



:root {

  --dark: #1a1a1a;

  --mid: #2e2e2e;

  --light-bg: #f7f6f3;

  --white: #ffffff;

  --accent: #9a9a9a;

  --accent-light: #c4a97d;

  --text-body: #3a3a3a;

  --text-muted: #888;

  --border: #e0ddd8;

}



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

html { scroll-behavior: smooth; }

body {

  font-family: 'Poppins', sans-serif;

  color: var(--text-body);

  background: var(--white);

  overflow-x: hidden;

}



/* ── NAVBAR ── */

nav {

  position: fixed;

  top: 0; left: 0; right: 0;

  z-index: 1000;

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0 5%;

  height: 80px;

  background: rgba(255,255,255,0.96);

  backdrop-filter: blur(8px);

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

  box-shadow: 0 2px 20px rgba(0,0,0,.05);

}

.nav-logo {

  text-decoration: none;

  display: flex;

  align-items: center;

}

.nav-logo-img {

  height: 68px;

  width: auto;

  display: block;

	  max-width: 220px;

}

.nav-links {

  display: flex;

  gap: 2.2rem;

  list-style: none;

}

.nav-links a {

  font-size: 1rem;

  font-weight: 500;

  /*letter-spacing: .16em;*/

  color: var(--text-body);

  text-decoration: none;

  position: relative;

  padding-bottom: 3px;

  transition: color .2s;

}

.nav-links a::after {

  content: '';

  position: absolute;

  bottom: 0; left: 0;

  width: 0; height: 1px;

  background: var(--accent);

  transition: width .3s;

}

.nav-links a:hover,

.nav-links a.active { color: var(--accent); }

.nav-links a:hover::after,

.nav-links a.active::after { width: 100%; }



/* hamburger */

.hamburger {

  display: none;

  flex-direction: column;

  gap: 5px;

  cursor: pointer;

  background: none; border: none; padding: 4px;

}

.hamburger span {

  display: block; width: 24px; height: 2px;

  background: var(--dark); transition: all .3s;

}

.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }

.hamburger.open span:nth-child(2) { opacity: 0; }

.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }



.mobile-menu {

  display: none;

  position: fixed;

  top: 72px; left: 0; right: 0;

  background: var(--white);

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

  padding: 1.5rem 5%;

  z-index: 999;

  flex-direction: column;

  gap: 0;

}

.mobile-menu.open { display: flex; }

.mobile-menu a {

  font-size: .75rem;

  font-weight: 500;

  letter-spacing: .14em;

  text-transform: uppercase;

  color: var(--text-body);

  text-decoration: none;

  padding: .85rem 0;

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

  transition: color .2s;

}

.mobile-menu a:hover { color: var(--accent); }



/* ── PAGE WRAPPER ── */

.page-content {

  margin-top: 72px;

  min-height: calc(100vh - 72px - 220px);

}



/* ── PAGE HEADER (for inner pages) ── */

.page-header {

  background: var(--light-bg);

  padding: 4rem 5% 3rem;

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

}

.page-header .label {

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .25em;

  text-transform: uppercase;

  color: var(--accent);

  display: block;

  margin-bottom: .6rem;

}

.page-header h1 {

  font-family: 'Poppins', sans-serif;

  font-size: clamp(2.2rem, 5vw, 3.5rem);

  font-weight: 400;

  text-align:center;

  color: var(--dark);

}

.page-header .subtitle {

  font-size: .98rem;

  /*letter-spacing: .22em;*/

text-align:center;

  text-transform: uppercase;

  color: #9a9a9a;

  /*margin-top: .6rem;*/

  display: block;

}



/* ── BTN ── */

.btn {

  display: inline-block;

  padding: .9rem 2.4rem;

  background: var(--dark);

  color: var(--white);

  font-size: .72rem;

  font-weight: 500;

  letter-spacing: .18em;

  text-transform: uppercase;

  text-decoration: none;

  border: 1px solid var(--dark);

  transition: all .3s;

  cursor: pointer;

}

.btn:hover { background: transparent; color: var(--dark); }

.btn-outline {

  background: transparent;

  color: var(--dark);

}

.btn-outline:hover { background: var(--dark); color: var(--white); }



/* ── REVEAL ── */

.reveal {

  opacity: 0; transform: translateY(24px);

  transition: opacity .7s ease, transform .7s ease;

}

.reveal.visible { opacity: 1; transform: translateY(0); }



/* ── FOOTER ── */

footer {

  background: var(--mid);

  color: rgba(255,255,255,.7);

  padding: 3rem 5%;

  font-size: .78rem;

  line-height: 1.9;

}

.footer-inner {

  max-width: 1200px;

  margin: 0 auto;

}

.footer-cookie {

  font-size: .7rem;

  color: rgba(255,255,255,.4);

  border-bottom: 1px solid rgba(255,255,255,.1);

  padding-bottom: 1.2rem;

  margin-bottom: 1.8rem;

}

.footer-cols {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  gap: 2.5rem;

}

footer strong {

  color: var(--white);

  font-weight: 600;

  display: block;

  margin-bottom: .3rem;

}

footer a { color: var(--accent-light); text-decoration: none; }

footer a:hover { text-decoration: underline; }

.footer-bottom {

  margin-top: 1.8rem;

  padding-top: 1.2rem;

  border-top: 1px solid rgba(255,255,255,.1);

  font-size: .7rem;

  color: rgba(255,255,255,.35);

}

.footer-bottom a { color: rgba(255,255,255,.5); }



@media (min-width: 641px) {

  .nav-logo-img {

    height: 68px;

    max-width: none;

  }

}



@media (max-width: 900px) {

  .footer-cols { grid-template-columns: 1fr 1fr; }

}

@media (max-width: 640px) {

  nav { padding: 0 4%; }

  .nav-links { display: none; }

  .hamburger { display: flex; }

  .footer-cols { grid-template-columns: 1fr; gap: 1.5rem; }

}