*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:#F4F0EA}
::-webkit-scrollbar-thumb{background:#940C34;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#7a0a2b}
::selection{background:#EAA643;color:#1a1a1a}
img{user-select:none;-webkit-user-drag:none}
a{text-decoration:none;color:inherit}

:focus-visible{outline:2px solid #EAA643;outline-offset:2px;border-radius:4px}
button:focus-visible,.nav-link:focus-visible,a:focus-visible{outline:2px solid #EAA643;outline-offset:2px;border-radius:4px}

.skip-link{position:fixed;top:-100%;left:1rem;z-index:10000;padding:.75rem 1.5rem;background:#940C34;color:#fff;font-family:'Inter',sans-serif;font-size:.875rem;font-weight:600;border-radius:0 0 8px 8px;text-decoration:none;transition:top .2s ease}
.skip-link:focus{top:0;outline:2px solid #EAA643;outline-offset:2px}

#progressBar{position:fixed;top:0;left:0;width:0;height:3px;background:#940C34;z-index:60;transition:width .15s ease-out;pointer-events:none}

#siteNav{transition:all .5s ease}
#siteNav.scrolled{background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 20px rgba(0,0,0,.08)}
#siteNav.scrolled .nav-link{color:rgba(26,26,26,.7)}
#siteNav.scrolled .nav-link:hover{color:#940C34}
#siteNav.scrolled .brand-name{color:#1a1a1a}
#siteNav.scrolled .brand-sub{color:rgba(26,26,26,.5)}
#siteNav.nav-hidden{transform:translateY(-100%)}
#siteNav .nav-cta-btn{transition:all .3s ease}

#mobileMenu.active{opacity:1;pointer-events:auto}
#mobileMenu .mobile-link{transition:color .3s ease}

.hero-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.hero-particles .mote{position:absolute;top:0;width:3px;height:3px;background:rgba(234,166,67,0.5);border-radius:50%;box-shadow:0 0 6px rgba(234,166,67,0.6);animation:mote-drift linear infinite}
@keyframes mote-drift{
  0%{transform:translateY(100vh) rotate(0deg);opacity:0}
  10%{opacity:1}
  90%{opacity:1}
  100%{transform:translateY(-10vh) rotate(720deg);opacity:0}
}

.floating{will-change:transform;backface-visibility:hidden;perspective:1000px;animation:float 6s cubic-bezier(0.45,0,0.55,1) infinite}
@keyframes float{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-14px,0)}
}

.project-card+.project-card{margin-top:3rem}
.project-card .hero-overlay img{transition:transform .7s ease}
.project-card .hero-overlay:hover img{transform:scale(1.05)}

.collage-reveal .collage-item{opacity:0;transform:translateY(120px);will-change:transform,opacity}
.stat-number{transition:all .3s ease}

.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}
.reveal.revealed{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.4s}
.reveal-delay-5{transition-delay:.5s}

@keyframes marquee{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.marquee-track{display:inline-flex;animation:marquee 30s linear infinite}
.marquee-track:hover{animation-play-state:paused}

.gallery-item{cursor:pointer;overflow:hidden}

#lightbox.active{opacity:1;pointer-events:auto;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#lightbox.active #lightboxImg{transform:scale(1)}
#lightbox #lightboxImg{transform:scale(.95);transition:transform .3s ease}

.process-step{transition:all .5s ease;cursor:default}
.process-step:hover{transform:translateY(-8px)}

.mission-card{transition:all .5s ease;cursor:default}
.mission-card:hover{transform:translateY(-4px)}

.value-card{transition:all .5s ease;cursor:default}
.value-card:hover{transform:translateY(-2px)}

.service-card{transition:all .5s ease;cursor:default}
.service-card:hover{transform:translateY(-3px)}

.feature-card{transition:all .5s ease;cursor:default}
.feature-card:hover{transform:translateY(-3px)}

.client-card{cursor:pointer}

.mud-cloth-bg {
  background-color: #ffffff;
  background-image: 
    /* large diamond / lozenge grid */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M100 10l30 50-30 50h-8L62 60l30-50z' fill='none' stroke='%231a1a1a' stroke-width='1.2' opacity='0.05'/%3E%3Cpath d='M100 30l20 34-20 34h-4L76 64l20-34z' fill='none' stroke='%231a1a1a' stroke-width='0.6' opacity='0.05'/%3E%3C/svg%3E"),
    /* zigzag chevron bands */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cpath d='M0 30l22.5 18 22.5-18 22.5 18 22.5-18 22.5 18 22.5-18 22.5 18' fill='none' stroke='%231a1a1a' stroke-width='1' opacity='0.05'/%3E%3Cpath d='M0 90l22.5 18 22.5-18 22.5 18 22.5-18 22.5 18 22.5-18 22.5 18' fill='none' stroke='%231a1a1a' stroke-width='0.8' opacity='0.05'/%3E%3Cpath d='M0 150l22.5 18 22.5-18 22.5 18 22.5-18 22.5 18 22.5-18 22.5 18' fill='none' stroke='%231a1a1a' stroke-width='0.6' opacity='0.05'/%3E%3C/svg%3E"),
    /* X / cross motifs */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M15 15l18 18M33 15l-18 18' stroke='%231a1a1a' stroke-width='1.2' opacity='0.05'/%3E%3Ccircle cx='24' cy='24' r='2' fill='%231a1a1a' opacity='0.05'/%3E%3Cpath d='M75 75l18 18M93 75l-18 18' stroke='%231a1a1a' stroke-width='1.2' opacity='0.05'/%3E%3Ccircle cx='84' cy='84' r='2' fill='%231a1a1a' opacity='0.05'/%3E%3C/svg%3E");
  background-size: 200px 200px, 180px 180px, 120px 120px;
  background-position: 0 0, 0 0, 40px 20px;
  position: relative;
}
.mud-cloth-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: 
    /* small triangle / chevron dots */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M12 20l6-10 6 10zM48 20l6-10 6 10z' fill='%231a1a1a' opacity='0.05'/%3E%3Cpath d='M30 50l4-7 4 7zM66 50l4-7 4 7z' fill='%231a1a1a' opacity='0.05'/%3E%3C/svg%3E"),
    /* horizontal dash lines */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath d='M10 18h14M50 18h14M10 48h20M60 48h14M10 78h14M50 78h14' stroke='%231a1a1a' stroke-width='1.5' opacity='0.05'/%3E%3C/svg%3E"),
    /* small circle dots */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ccircle cx='30' cy='30' r='1.5' fill='%231a1a1a' opacity='0.05'/%3E%3C/svg%3E");
  background-size: 80px 80px, 100px 100px, 60px 60px;
  background-position: 0 0, 20px 0, 10px 10px;
  pointer-events: none;
  z-index: 0;
}
.mud-cloth-bg > * { position: relative; z-index: 1; }

#sideNav .side-dot.active span:last-child {
  transform: scale(1.2);
}
#sideNav .side-dot span:first-child {
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
  white-space: nowrap;
}

.nav-toggle-btn{transition:all .3s ease}
.nav-toggle-btn:hover{background:rgba(148,12,52,.08)}

html.lenis,html.lenis body{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-smooth iframe{pointer-events:none}

#contact {
  background-color: #940C34;
}
#contact::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../images/final.webp') repeat center center;
  filter: grayscale(1);
  pointer-events: none;
  z-index: 0;
}

/* ─── Loading Screen ─── */
#loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
#loader.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.loader-content {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}
.loader-mark {
  width: 72px;
  height: 72px;
  animation: loader-pulse 1.6s ease-in-out infinite;
}
.loader-diamond {
  width: 100%;
  height: 100%;
  animation: loader-spin 3s linear infinite;
}
@keyframes loader-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes loader-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.7; }
}
.loader-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.loader-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a1a1a;
  letter-spacing: -0.02em;
  line-height: 1.2;
}
.loader-sub {
  font-family: 'Inter', sans-serif;
  font-size: 0.65rem;
  color: rgba(26,26,26,0.4);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  line-height: 1.2;
}
.loader-bar {
  width: 160px;
  height: 2px;
  background: rgba(0,0,0,0.06);
  border-radius: 1px;
  overflow: hidden;
  margin-top: 0.5rem;
}
.loader-bar-fill {
  width: 0%;
  height: 100%;
  background: #EAA643;
  border-radius: 1px;
  animation: loader-fill 1.8s ease-in-out forwards;
}
@keyframes loader-fill {
  0% { width: 0%; }
  50% { width: 55%; }
  100% { width: 100%; }
}