/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 28 2026 | 19:24:48 */
/* ==================================================
   BLKFOG HERO — DOCUMENTARY REVEAL
================================================== */

/* Initial State */

.fog-intro img {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 1.1s ease,
    transform 1.1s ease;
}

.fog-intro h1 {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.9s ease,
    transform 0.9s ease;
}

.fog-intro .fog-subtext,
.fog-intro .fog-cta {
  opacity: 0;
  transition: opacity 0.8s ease;
}
.fog-intro .bf-hero-label {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.8s ease,
    transform 0.8s ease;
}
/* When Ready */

.fog-intro.fog-ready img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

.fog-intro.fog-ready h1 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.25s;
}

.fog-intro.fog-ready .fog-subtext {
  opacity: 1;
  transition-delay: 0.4s;
}

.fog-intro.fog-ready .fog-cta {
  opacity: 1;
  transition-delay: 0.55s;
}
.fog-intro.fog-ready .bf-hero-label {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}

/* ==================================================
   BLKFOG HERO — QUIET RESOLVE
================================================== */

/* Base hidden state */

.fog-intro img,
.fog-intro .bf-hero-label,
.fog-intro .blkfog-scroll-cue {
  opacity: 0;
  transition: opacity 0.75s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Subtle lift only on cutout */
.fog-intro img {
  transform: translateY(6px);
  transition:
    opacity 0.75s cubic-bezier(0.25, 0.8, 0.25, 1),
    transform 0.75s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* When ready */

.fog-intro.fog-ready img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.05s;
}

.fog-intro.fog-ready .bf-hero-label {
  opacity: 1;
  transition-delay: 0.2s;
}

.fog-intro.fog-ready .blkfog-scroll-cue {
  opacity: 1;
  transition-delay: 0.38s;
}
/* ======================================
   INTENT SECTION — DOCUMENTARY ANIMATION
====================================== */

/* Initial */

.intent-section img {
  opacity: 0;
  transform: translateY(30px);
  will-change: transform, opacity;
  transition:
    transform 1s ease,
    opacity 1s ease;
}

.intent-section .intent-content {
  opacity: 0;
  transform: translateY(25px);
  transition:
    transform 0.8s ease,
    opacity 0.8s ease;
}

/* Active */

.intent-section.animate-in img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

.intent-section.animate-in .intent-content {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}

/* =========================================
   WORKWEAR SCROLL ANIMATION — DOCUMENTARY
========================================= */

/* Initial state */

.workwear-animate .workwear-image,
.workwear-animate .workwear-content {
  opacity: 0;
  will-change: transform, opacity;
}

/* Image initial */

.workwear-animate .workwear-image {
  transform: translateY(30px);
  transition:
    transform 1s ease,
    opacity 1s ease;
}

/* Content initial */

.workwear-animate .workwear-content {
  transform: translateY(25px);
  transition:
    transform 0.8s ease,
    opacity 0.8s ease;
}

/* When section enters view */

.workwear-animate.animate-in .workwear-image {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

.workwear-animate.animate-in .workwear-content {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}

/* ======================================
   OFF SHIFT ANIMATION — DOCUMENTARY STYLE
====================================== */

.offshift-section .offshift-image img,
.offshift-section .offshift-content {
  opacity: 0;
  will-change: transform, opacity;
}

/* Image initial */

.offshift-section .offshift-image img {
  transform: translateY(30px);
  transition:
    transform 1s ease,
    opacity 1s ease;
}

/* Content initial */

.offshift-section .offshift-content {
  transform: translateY(25px);
  transition:
    transform 0.8s ease,
    opacity 0.8s ease;
}

/* Active */

.offshift-section.animate-in .offshift-image img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

.offshift-section.animate-in .offshift-content {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}
