/* Hufi Interior — shared site styles */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap');

:root{
  --brand-orange:#FF6600;
  --brand-charcoal:#1F2937;
  --soft-beige:#F9F8F6;
}

h1,h2,h3,h4{ font-family:'Playfair Display', serif; color:var(--brand-charcoal); }
body{ font-family:'Inter', sans-serif; color:#4B5563; }

.nav-link{ transition: color .3s ease; position:relative; }
.nav-link:hover{ color:var(--brand-orange); }
.nav-link.active{ color:var(--brand-charcoal); }
.nav-link.active::after{
  content:""; position:absolute; left:0; right:0; bottom:-22px; height:2px; background:var(--brand-orange);
}

.btn-primary{
  background-color:var(--brand-orange); color:#fff; padding:.75rem 1.5rem; border-radius:.5rem;
  font-weight:500; transition:background-color .3s ease, transform .2s ease; display:inline-block;
}
.btn-primary:hover{ background-color:#E65C00; transform:translateY(-1px); }

.btn-outline{
  border:1.5px solid var(--brand-charcoal); color:var(--brand-charcoal); padding:.7rem 1.4rem; border-radius:.5rem;
  font-weight:500; transition:all .3s ease; display:inline-block;
}
.btn-outline:hover{ background:var(--brand-charcoal); color:#fff; }

.card-shadow{ box-shadow:0 10px 30px -5px rgba(0,0,0,.05); }

.tag-pill{
  display:inline-block; font-size:.7rem; letter-spacing:.05em; text-transform:uppercase;
  font-weight:600; color:var(--brand-orange); background:rgba(255,102,0,.08);
  padding:.25rem .65rem; border-radius:999px;
}

.gallery-card{ position:relative; overflow:hidden; border-radius:1rem; background:#111; }
.gallery-card img{ transition:transform .6s ease; display:block; width:100%; height:100%; object-fit:cover; }
.gallery-card:hover img{ transform:scale(1.06); }
.gallery-overlay{
  position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.65) 100%);
  display:flex; align-items:flex-end; padding:1.25rem; opacity:0; transition:opacity .35s ease;
}
.gallery-card:hover .gallery-overlay{ opacity:1; }

.mobile-menu{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.mobile-menu.open{ max-height:400px; }

/* simple fade-up animation on scroll */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }