@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root {
  --forest: #123f31;
  --forest-deep: #092b22;
  --leaf: #5f8f62;
  --sage: #dce8d7;
  --cream: #f7f4ea;
  --sun: #e8b95d;
  --ink: #16251f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: "DM Sans", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
h1, h2, h3, .serif { font-family: "Playfair Display", serif; }
a, button { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(255,255,255,.11);
  background: rgba(9,43,34,.96);
  backdrop-filter: blur(14px);
}
.nav-link {
  position: relative;
  color: rgba(255,255,255,.78);
  transition: color .25s ease;
}
.nav-link:hover, .nav-link.active { color: #fff; }
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -7px;
  height: 2px;
  background: var(--sun);
  transition: right .25s ease;
}
.nav-link:hover::after, .nav-link.active::after { right: 0; }

.hero {
  position: relative;
  min-height: 76vh;
  display: grid;
  align-items: center;
  overflow: hidden;
  background: var(--forest-deep);
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(5,28,22,.94) 0%, rgba(5,28,22,.75) 47%, rgba(5,28,22,.18) 100%);
}
.hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-grid {
  position: absolute;
  inset: 0;
  opacity: .13;
  background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px);
  background-size: 72px 72px;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  color: var(--sun);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.display-title { font-size: clamp(2.8rem, 7vw, 6.7rem); line-height: .96; letter-spacing: -.045em; }
.page-title { font-size: clamp(2.6rem, 6vw, 5.4rem); line-height: 1; letter-spacing: -.035em; }
.section-title { font-size: clamp(2.05rem, 4vw, 3.75rem); line-height: 1.08; letter-spacing: -.025em; }

.btn-primary, .btn-secondary {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  border-radius: 999px;
  padding: .8rem 1.35rem;
  font-size: .87rem;
  font-weight: 700;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn-primary { color: var(--forest-deep); background: var(--sun); box-shadow: 0 12px 30px rgba(232,185,93,.2); }
.btn-secondary { color: #fff; border: 1px solid rgba(255,255,255,.38); background: rgba(255,255,255,.06); }
.btn-primary:hover, .btn-secondary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(0,0,0,.2); }

.service-card {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  border-radius: 1.5rem;
  background: var(--forest);
  isolation: isolate;
}
.service-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.service-card::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(5,32,24,.95), rgba(5,32,24,.05) 72%); }
.service-card:hover img { transform: scale(1.06); }
.service-card-content { position: absolute; inset: auto 0 0; z-index: 2; padding: 1.65rem; color: #fff; }
.service-card .arrow { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: var(--forest-deep); background: var(--sun); transition: transform .25s ease; }
.service-card:hover .arrow { transform: translate(3px,-3px); }

.soft-card { border: 1px solid rgba(18,63,49,.12); border-radius: 1.5rem; background: rgba(255,255,255,.7); box-shadow: 0 18px 60px rgba(18,63,49,.07); }
.number { color: var(--leaf); font-family: "Playfair Display", serif; font-size: 3.3rem; font-weight: 700; line-height: 1; }
.image-frame { overflow: hidden; border-radius: 1.75rem; box-shadow: 0 24px 70px rgba(9,43,34,.18); }
.image-frame img { width: 100%; height: 100%; object-fit: cover; }

.page-hero {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: var(--forest-deep);
}
.page-hero::before {
  content: "";
  position: absolute;
  right: -6%;
  bottom: -100%;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 50%;
  box-shadow: 0 0 0 80px rgba(255,255,255,.025), 0 0 0 160px rgba(255,255,255,.02);
}
.quote-card { background: var(--forest); color: #fff; }
.quote-mark { color: var(--sun); font-family: Georgia, serif; font-size: 5rem; line-height: .6; }

.field {
  width: 100%;
  min-height: 54px;
  border: 1px solid rgba(18,63,49,.18);
  border-radius: .9rem;
  padding: .9rem 1rem;
  outline: 0;
  background: rgba(255,255,255,.8);
  transition: border .2s ease, box-shadow .2s ease;
}
.field:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,143,98,.13); }
textarea.field { min-height: 150px; resize: vertical; }
.map-frame { min-height: 430px; border: 0; filter: saturate(.75) contrast(1.05); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }
.toast {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 80;
  max-width: 360px;
  border-radius: 1rem;
  padding: 1rem 1.2rem;
  color: #fff;
  background: var(--forest-deep);
  box-shadow: 0 18px 55px rgba(0,0,0,.25);
  transform: translateY(140%);
  transition: transform .35s ease;
}
.toast.show { transform: none; }

@media (max-width: 767px) {
  .mobile-menu {
    position: fixed;
    inset: 73px 0 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 2rem 1.5rem;
    background: var(--forest-deep);
    transform: translateX(100%);
    transition: transform .3s ease;
  }
  .mobile-menu.open { transform: none; }
  .mobile-menu .nav-link { padding: .55rem 0; font-family: "Playfair Display", serif; font-size: 1.75rem; }
  .hero { min-height: 680px; }
  .hero::after { background: linear-gradient(0deg, rgba(5,28,22,.96), rgba(5,28,22,.45)); }
  .service-card { min-height: 360px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
