/* Reset & base */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; color:#111; background:#fff; line-height:1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color:#111; text-decoration: none; }
.container { width: min(1120px, 92%); margin: 0 auto; }

/* Navbar */
.navbar { position: sticky; top:0; z-index: 50; background: rgba(255,255,255,.9); backdrop-filter:saturate(180%) blur(6px); border-bottom:1px solid #eee; }
.nav-inner { display:flex; align-items:center; justify-content: space-between; padding: 10px 0; }
.brand img { height: 34px; width:auto; }
.nav-links { display:flex; gap: 18px; align-items:center; }
.nav-links a { padding:8px 6px; font-weight:600; }
.nav-links .btn { padding:10px 14px; border:1px solid #111; border-radius:999px; }
.hamburger { display:none; background:none; border:0; padding:8px; cursor:pointer; }
.hamburger span { display:block; width:24px; height:2px; background:#111; margin:5px 0; transition:.3s; }

/* Hero */
.hero { position: relative; min-height: 66vh; display:grid; place-items:center; }
.hero-bg { position:absolute; inset:0; background: url('/assets/img/hero.jpg') center/cover no-repeat; }
.hero::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,0.0), rgba(255,255,255,0.85) 70%); }
.hero-content { position: relative; z-index: 1; text-align:left; padding: 80px 0; }
.hero h1 { font-size: clamp(32px, 5vw, 54px); line-height:1.1; margin:0 0 12px; }
.hero h1 span { letter-spacing:.5px; }
.hero p { font-size: clamp(16px, 2.2vw, 20px); max-width: 720px; margin: 0 0 24px; color:#222; }
.btn { display:inline-block; padding: 12px 18px; border-radius: 999px; border:1px solid #111; background:#111; color:#fff; font-weight:700; }
.btn.primary { background:#111; color:#fff; border-color:#111; }
.btn:hover { opacity:.9; }

/* Sections */
.section { padding: 64px 0; }
.section.alt { background:#fafafa; }
.section h2 { font-size: clamp(26px, 3.2vw, 36px); margin: 0 0 14px; }
.grid-2 { display:grid; grid-template-columns: 1.1fr .9fr; gap: 28px; align-items:center; }
.media img { border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.06); }
.media.collage { display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
.bullets { padding-left: 18px; }
.bullets li { margin-bottom: 8px; }

.gallery { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:14px; }
.gallery img { border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.06); }

/* Testimonials */
.testimonials { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap:16px; }
blockquote { margin:0; padding:18px; border:1px solid #eee; border-radius:14px; background:#fff; }
blockquote p { margin:0 0 10px; }
cite { font-style: normal; color:#666; font-size: 14px; }

/* Form */
.form { max-width: 880px; }
.hidden { display:none; }
.grid-form { display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; }
label { display:flex; flex-direction:column; font-weight:600; font-size:14px; gap:6px; }
input, textarea { font: inherit; padding:12px 14px; border:1px solid #ddd; border-radius:12px; background:#fff; }
input:focus, textarea:focus { outline: 2px solid #111; outline-offset: 1px; }
.thanks { margin-top:12px; font-weight:700; color:#0a7a2a; }

/* Footer */
.footer { border-top:1px solid #eee; padding: 28px 0; background:#fff; }
.foot-grid { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.logo-foot { height: 28px; width:auto; opacity:.9; }
.foot-links { display:flex; gap:14px; flex-wrap:wrap; }
.foot-links a { color:#444; }

/* Lightbox */
.lightbox-backdrop { position: fixed; inset:0; background: rgba(0,0,0,.85); display:none; align-items:center; justify-content:center; z-index:1000; }
.lightbox-backdrop.show { display:flex; }
.lightbox-img { max-width: 92vw; max-height: 92vh; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.4); }
.lightbox-caption { color:#fff; margin-top:10px; text-align:center; font-size:14px; }

/* Responsive */
@media (max-width: 960px) {
  .grid-2 { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .hamburger { display:block; }
  .nav-links { position: fixed; top:60px; right:16px; left:16px; background:#fff; border:1px solid #eee; border-radius:14px; padding:12px; display:none; flex-direction:column; gap:10px; box-shadow: 0 10px 30px rgba(0,0,0,.08); }
  .nav-links.show { display:flex; }
}