/* ==========================================================================
   Salvo İnşaat A.Ş. — Architectural Design System
   Distinctive, intentional visual design crafted for high-end coastal
   residential and structural engineering in Karşıyaka & Bostanlı, İzmir.
   ========================================================================== */

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

:root {
  /* Aegean Marine & Stone Palette */
  --salvo-obsidian: #09111E;
  --salvo-navy: #0E1828;
  --salvo-slate: #1A2638;
  --salvo-stone: #F4F6F8;
  --salvo-sand: #EAE6DF;
  --salvo-brass: #C8933A;
  --salvo-brass-light: #DFAB54;
  --salvo-brass-dark: #A67524;
  --salvo-border-subtle: rgba(255, 255, 255, 0.08);
  --salvo-border-light: #E2E8F0;
  --salvo-text-main: #0F172A;
  --salvo-text-muted: #64748B;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
}

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color: var(--salvo-text-main);
  background-color: #FAFAFA;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Typography Hierarchy */
.font-display {
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  letter-spacing: -0.025em;
}

/* Architectural Framing & Grid Lines */
.arch-grid-bg {
  background-image: linear-gradient(to right, rgba(14, 24, 40, 0.03) 1px, transparent 1px),
                    linear-gradient(to bottom, rgba(14, 24, 40, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
}

.arch-grid-dark {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
                    linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 56px 56px;
}

/* Custom Selection */
::selection {
  background-color: #C8933A;
  color: #09111E;
}

/* Scrollbar */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
::-webkit-scrollbar-track {
  background: #09111E;
}
::-webkit-scrollbar-thumb {
  background: #C8933A;
  border-radius: 3px;
}

/* Intentional Image Zoom on Interactive Cards */
.arch-image {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.group:hover .arch-image {
  transform: scale(1.04);
}

/* Clean Form Focus Accessibility */
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible {
  outline: 2px solid #C8933A;
  outline-offset: 2px;
}

/* Lightbox Base */
.lightbox-overlay {
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.lightbox-overlay.active {
  opacity: 1;
  visibility: visible;
}
.lightbox-overlay.inactive {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Mobile Safe Spacing */
@media (max-width: 768px) {
  body {
    padding-bottom: 72px;
  }
}
