/* Söhne Font Faces (Test Fonts) */
@font-face {
  font-family: 'Sohne';
  src: url('fonts/sohne-regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sohne';
  src: url('fonts/sohne-medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sohne';
  src: url('fonts/sohne-bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

body {
  background-color: #FAFAF8; 
  color: #0E1116; 
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  letter-spacing: -0.025em;
}

.container-wide {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 768px) {
  .container-wide {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.reveal-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: all 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.reveal-on-scroll.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Lenis smooth scroll */
html.lenis { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
.lenis.lenis-scrolling iframe { pointer-events: none; }
.char { display: inline-block; }

/* Keep original typography and colors; allow constrained layouts to shrink. */
.grid > *, #oi-section .flex > *, #beyond-tabs-nav { min-width: 0; }
#beyond-tabs-nav { gap: 1rem; }
#hero-massive-text, #oi-title, #contact-section h2 { overflow-wrap: anywhere; }
#oi-images-container img { object-fit: contain; }
.oi-view-details > ul { margin-top: 1.5rem; }
.oi-view-details { height: auto; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #E8923A; outline-offset: 3px;
}
@media (max-width: 1023px) {
  #oi-section .oi-view-image { display: block; }
  #oi-section .oi-view-details { display: none; }
  #nav-breadcrumb { gap: 1rem; }
}
@media (max-height: 749px) {
  #hero-section { height: auto; min-height: max(100dvh, 36rem); }
  #motion-text-container { min-height: 36rem; }
}
@media (max-width: 359px) {
  footer .grid { column-gap: 1rem; }
  #contact-section form > * { min-width: 0; }
}

/* Custom Scrollbar - Dark Grey */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #3A4049; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #0E1116; }