@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Jost:wght@300;400;500&display=swap');

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

:root {
  --bone:   #FAFAF8;
  --ink:    #0D0D0B;
  --terra:  #C4593A;
  --fog:    #F2EDE6;
  --mist:   #DDD6CC;
  --ash:    #8A8480;
  --font-d: 'Cormorant Garamond', serif;
  --font-b: 'Jost', sans-serif;
  --ease:   cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --expo:   cubic-bezier(0.16, 1, 0.3, 1);
  --hh:     72px;
  --pad:    clamp(24px, 5vw, 80px);
}

html { scroll-behavior: smooth; }
body {
  background: var(--bone);
  color: var(--ink);
  font-family: var(--font-b);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; width: 100%; height: 100%; object-fit: cover; }
a   { text-decoration: none; color: inherit; }

/* ── HEADER ── */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  height: var(--hh);
  display: flex;
  align-items: center;
  padding: 0 var(--pad);
  transition: background .4s var(--ease), backdrop-filter .4s var(--ease);
}
.site-header.scrolled {
  background: rgba(250,250,248,.93);
  backdrop-filter: blur(14px);
}
.site-header__inner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* logo */
.logo { display: flex; flex-direction: column; line-height: 1; }
.logo__mono {
  font-family: var(--font-d);
  font-size: 1.85rem;
  font-weight: 300;
  letter-spacing: .28em;
  color: var(--ink);
}
.logo__name {
  font-family: var(--font-b);
  font-size: .46rem;
  font-weight: 400;
  letter-spacing: .58em;
  text-transform: uppercase;
  color: var(--ash);
  margin-top: 3px;
}
.logo--light .logo__mono { color: var(--bone); }
.logo--light .logo__name { color: rgba(250,250,248,.4); }

/* nav */
.site-nav {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 52px);
}
.site-nav a {
  font-family: var(--font-b);
  font-size: .64rem;
  font-weight: 400;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ash);
  position: relative;
  transition: color .3s var(--ease);
}
.site-nav a::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 1px;
  background: var(--terra);
  transition: width .3s var(--ease);
}
.site-nav a:hover,
.site-nav a.active { color: var(--ink); }
.site-nav a:hover::after,
.site-nav a.active::after { width: 100%; }

.nav-cta {
  color: var(--bone) !important;
  background: var(--ink);
  padding: 10px 22px;
  transition: background .3s var(--ease) !important;
}
.nav-cta::after { display: none !important; }
.nav-cta:hover { background: var(--terra) !important; }

/* ── FOOTER ── */
.site-footer {
  background: var(--ink);
  color: var(--bone);
  padding: 80px var(--pad) 40px;
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 56px;
  margin-bottom: 64px;
}
.footer-brand p {
  margin-top: 20px;
  font-size: .83rem;
  line-height: 1.85;
  color: rgba(250,250,248,.45);
  max-width: 280px;
}
.footer-col h4 {
  font-family: var(--font-b);
  font-size: .52rem;
  font-weight: 400;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: var(--terra);
  margin-bottom: 22px;
}
.footer-col a {
  display: block;
  font-size: .83rem;
  color: rgba(250,250,248,.5);
  margin-bottom: 11px;
  transition: color .3s;
}
.footer-col a:hover { color: var(--bone); }
.footer-bottom {
  border-top: 1px solid rgba(250,250,248,.07);
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-bottom p {
  font-size: .68rem;
  letter-spacing: .13em;
  color: rgba(250,250,248,.22);
}

/* ── REVEAL ── */
[data-r] {
  opacity: 0;
  transform: translateY(38px);
  transition: opacity 1s var(--expo), transform 1s var(--expo);
}
[data-r="l"] { transform: translateX(-38px); }
[data-r="r"] { transform: translateX(38px); }
[data-r="s"] { transform: scale(.95); opacity: 0; }
[data-r].on  { opacity: 1; transform: none; }

[data-d="1"] { transition-delay: .1s; }
[data-d="2"] { transition-delay: .22s; }
[data-d="3"] { transition-delay: .38s; }
[data-d="4"] { transition-delay: .55s; }

/* ── UTILITIES ── */
.section-label {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: var(--font-b);
  font-size: .52rem;
  font-weight: 400;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: var(--terra);
  margin-bottom: 28px;
}
.section-label::before {
  content: '';
  width: 28px; height: 1px;
  background: var(--terra);
  flex-shrink: 0;
}

.btn-dark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-b);
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--bone);
  background: var(--ink);
  padding: 15px 32px;
  transition: background .3s var(--ease);
}
.btn-dark:hover { background: var(--terra); }

.btn-light {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-b);
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--bone);
  padding: 15px 32px;
  transition: background .3s var(--ease), color .3s var(--ease);
}
.btn-light:hover { background: var(--terra); color: var(--bone); }

.btn-ghost {
  font-family: var(--font-b);
  font-size: .6rem;
  font-weight: 400;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ash);
  position: relative;
  transition: color .3s;
}
.btn-ghost::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 100%; height: 1px;
  background: var(--mist);
  transition: background .3s;
}
.btn-ghost:hover { color: var(--ink); }
.btn-ghost:hover::after { background: var(--ink); }

/* ── SHARED SCROLL JS ── */
/* (included inline in each page) */

@media (max-width: 768px) {
  .site-footer__grid { grid-template-columns: 1fr; gap: 40px; }
  .site-nav { gap: 16px; }
  .site-nav a { font-size: .56rem; }
}
