*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root { --orange: #e07b39; --orange-dark: #c4622a; --charcoal: #1c1c1e; --charcoal2: #2a2a2c; --charcoal3: #323234; --light: #fafaf8; --warm: #b8a898; --white: #ffffff; }
html { scroll-behavior: smooth; }
body { font-family: 'Source Sans 3', sans-serif; background: var(--charcoal); color: var(--white); font-size: 16px; line-height: 1.6; overflow-x: hidden; }
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; height: 68px; display: flex; align-items: stretch; background: var(--charcoal); border-bottom: 3px solid var(--orange); }
.nav-brand { background: white; padding: 0 28px; display: flex; align-items: center; flex-shrink: 0; border-right: 4px solid var(--orange); }
.nav-brand img { height: 56px; display: block; }
.nav-menu-wrap { flex: 1; display: flex; align-items: center; justify-content: space-between; padding: 0 32px; }
.nav-links { display: flex; list-style: none; gap: 0; align-items: stretch; height: 100%; }
.nav-links li { display: flex; align-items: center; }
.nav-links a { color: var(--warm); text-decoration: none; font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; padding: 0 16px; height: 100%; display: flex; align-items: center; border-bottom: 3px solid transparent; margin-bottom: -3px; transition: all 0.2s; }
.nav-links a:hover { color: var(--white); border-bottom-color: var(--orange); }
.nav-links .dropdown { position: relative; display: flex; align-items: center; }
.nav-links .dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: var(--charcoal2); border-top: 3px solid var(--orange); min-width: 220px; list-style: none; padding: 8px 0; }
.nav-links .dropdown:hover .dropdown-menu { display: block; }
.nav-links .dropdown-menu a { height: auto; padding: 10px 20px; border-bottom: none; margin-bottom: 0; font-size: 13px; }
.nav-phone { font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 600; color: var(--orange); letter-spacing: 1px; text-decoration: none; white-space: nowrap; }
.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; align-self: center; }
.hamburger span { display: block; width: 24px; height: 2px; background: var(--warm); }
.page-hero { margin-top: 68px; height: 420px; position: relative; display: flex; align-items: flex-end; overflow: hidden; }
.page-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.page-hero-overlay { position: absolute; inset: 0; background: linear-gradient(105deg, rgba(28,28,30,0.88) 0%, rgba(28,28,30,0.5) 60%, rgba(28,28,30,0.2) 100%); }
.page-hero-content { position: relative; z-index: 2; padding: 0 0 56px 80px; }
.page-hero-tag { font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: 4px; color: var(--orange); text-transform: uppercase; display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.page-hero-tag::before { content: ''; width: 32px; height: 2px; background: var(--orange); }
.page-hero h1 { font-family: 'Oswald', sans-serif; font-size: clamp(42px, 6vw, 80px); font-weight: 700; text-transform: uppercase; letter-spacing: -1px; line-height: 0.95; }
.page-hero h1 span { color: var(--orange); }
.gallery-section { background: var(--charcoal2); padding: 80px 0; }
.gallery-inner { max-width: 1280px; margin: 0 auto; padding: 0 60px; }
.gallery-mosaic { columns: 4 200px; gap: 8px; }
.gm-item { break-inside: avoid; margin-bottom: 8px; overflow: hidden; cursor: pointer; position: relative; display: block; }
.gm-item img { width: 100%; display: block; transition: transform 0.5s ease, filter 0.3s; filter: brightness(0.85); }
.gm-item:hover img { transform: scale(1.06); filter: brightness(1); }
.gm-item::after { content: '↗'; position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; background: var(--orange); color: var(--white); display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; opacity: 0; transition: opacity 0.3s; }
.gm-item:hover::after { opacity: 1; }
.cta-band { background: var(--orange); padding: 60px; text-align: center; }
.cta-band h2 { font-family: 'Oswald', sans-serif; font-size: clamp(28px, 4vw, 48px); font-weight: 700; text-transform: uppercase; letter-spacing: -1px; color: var(--white); margin-bottom: 12px; }
.cta-band p { color: rgba(255,255,255,0.8); font-size: 16px; margin-bottom: 28px; }
.btn-cta { display: inline-flex; align-items: center; gap: 10px; background: var(--white); color: var(--orange); text-decoration: none; font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding: 16px 40px; transition: background 0.2s, transform 0.2s; }
.btn-cta:hover { background: var(--charcoal); color: var(--white); transform: translateX(4px); }
footer { background: #111; border-top: 3px solid var(--orange); padding: 32px 60px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.footer-logo img { height: 44px; filter: drop-shadow(0 0 6px rgba(255,255,255,0.75)) drop-shadow(0 0 16px rgba(224,123,57,0.3)); }
footer p { font-size: 13px; color: var(--warm); letter-spacing: 0.5px; }
#lightbox { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.96); display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.2s; }
#lightbox.active { opacity: 1; pointer-events: all; }
#lightbox img { max-width: 90vw; max-height: 88vh; object-fit: contain; }
.lb-x { position: absolute; top: 20px; right: 28px; color: rgba(255,255,255,0.6); font-size: 40px; cursor: pointer; line-height: 1; font-family: 'Oswald', sans-serif; transition: color 0.2s; }
.lb-x:hover { color: var(--orange); }
.lb-arrow { position: absolute; top: 50%; transform: translateY(-50%); font-family: 'Oswald', sans-serif; font-size: 52px; font-weight: 700; color: rgba(255,255,255,0.5); cursor: pointer; padding: 20px; transition: color 0.2s; user-select: none; }
.lb-arrow:hover { color: var(--orange); }
#lb-prev { left: 8px; } #lb-next { right: 8px; }
#cookie-banner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 9998; background: var(--charcoal2); border-top: 3px solid var(--orange); padding: 18px 40px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.cb-text { font-size: 14px; color: var(--warm); flex: 1; min-width: 220px; line-height: 1.5; }
.cb-text a { color: var(--orange); text-decoration: none; }
.cb-buttons { display: flex; gap: 10px; flex-shrink: 0; }
.cb-accept { background: var(--orange); color: #fff; border: none; padding: 10px 24px; font-family: 'Oswald', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; cursor: pointer; transition: background 0.2s; }
.cb-accept:hover { background: var(--orange-dark); }
.cb-reject { background: transparent; color: var(--warm); border: 1px solid var(--charcoal3); padding: 10px 20px; font-family: 'Oswald', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: all 0.2s; }
.cb-reject:hover { border-color: var(--warm); color: var(--white); }
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.65s ease, transform 0.65s ease; }
.reveal.visible { opacity: 1; transform: none; }
@media (max-width: 1100px) { .gallery-mosaic { columns: 3; } }
@media (max-width: 768px) {
  nav { height: 58px; } .nav-brand { padding: 0 16px; } .nav-brand img { height: 34px; }
  .nav-links { display: none; flex-direction: column; position: absolute; top: 58px; left: 0; right: 0; background: var(--charcoal); border-top: 2px solid var(--orange); padding: 12px 0; height: auto; gap: 0; }
  .nav-links.open { display: flex; }
  .nav-links a { height: auto; padding: 12px 24px; border-bottom: none; margin-bottom: 0; }
  .nav-links .dropdown-menu { position: static; border-top: none; padding-left: 20px; }
  .nav-phone { display: none; } .hamburger { display: flex; }
  .page-hero { height: 280px; } .page-hero-content { padding: 0 0 36px 24px; }
  .gallery-inner { padding: 0 16px; } .gallery-mosaic { columns: 2; }
  .cta-band { padding: 48px 24px; }
  footer { flex-direction: column; text-align: center; padding: 28px 24px; }
}
@media (max-width: 600px) { .cb-buttons { width: 100%; } .cb-accept, .cb-reject { flex: 1; text-align: center; } }