/* Full stylesheet for White Sand Carpentry */
:root{
  --bg:#f8f7f2;
  --text:#0d1b1e;
  --muted:#6b7b7e;
  --brand:#c2a26b;
  --brand-dark:#a4874f;
  --card:#ffffff;
  --line:#e7e4db;
  --focus:#1b6c9c;
}

* { box-sizing: border-box }
img { max-width:100%; display:block }
a:focus, button:focus, input:focus, textarea:focus {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 8px;
}

.btn:hover { transform: translateY(-1px) }
.btn:active { transform: translateY(0) }

/* Drawer nav for mobile */
#drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: 84%;
  max-width: 320px;
  transform: translateX(100%);
  transition: transform .3s ease;
  background: var(--card);
  border-left: 1px solid var(--line);
  padding: 1rem;
  z-index: 60;
}
#drawer.is-open { transform:none }
#drawer a { display:block; padding:.8rem 0; text-decoration:none; color:var(--text); border-bottom:1px dashed var(--line) }
#drawer .close { display:inline-block; margin-bottom: .6rem }

/* Utility */
.center { text-align:center }
.max { width:min(980px, 92%); margin-inline:auto }
.shadow { box-shadow: 0 6px 18px rgba(0,0,0,.06) }

/* Animations */
@media (prefers-reduced-motion: no-preference){
  .fade-up { transition: opacity .6s ease, transform .6s ease }
}
