/* Common CSS for Ravindra Pathak Website */

body {
    font-family: "Poppins", sans-serif;
    background-color: #FFFBF5;
}

h1, h2, h3, h4, .font-beau-rivage {
    font-family: "Birthstone", cursive;
    font-weight: 500 !important;
}
h1, h2 {
    color: #5A1D00 !important;
}
.orange {
    color: #FF4200;
}

.lightorange_bg {
    background-color: #ffe5c28f;
}
.orange-md-bg {
    background-color: #f9cba160;
}

.bg-gradient-hero {
    background: linear-gradient(180deg, #FFE5C2 0%, #FFFBF5 100%);
}

.bg-gradient-section {
    background: linear-gradient(180deg, #FFE5C2 0%, #FFFBF5 100%);
}

.logo-circle {
    background: linear-gradient(135deg, #F97316 0%, #EA580C 100%);
}

.text-devanagari {
    font-family: 'Noto Sans Devanagari', 'Inter', sans-serif;
}

.marathi-text {
    font-family: 'Noto Sans Devanagari', sans-serif;
    line-height: 1.8;
}

/* Scroll Animation Classes */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}

.fade-in-up.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.fade-in-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-right.visible {
    opacity: 1;
    transform: translateX(0);
}

.fade-in-scale {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-scale.visible {
    opacity: 1;
    transform: scale(1);
}

/* Staggered animations for multiple elements */
.fade-in-up.delay-100 {
    transition-delay: 0.1s;
}

.fade-in-up.delay-200 {
    transition-delay: 0.2s;
}

.fade-in-up.delay-300 {
    transition-delay: 0.3s;
}

.fade-in-up.delay-400 {
    transition-delay: 0.4s;
}

.fade-in-up.delay-500 {
    transition-delay: 0.5s;
}

/* Reverse animations for scroll up */
.fade-in.reverse {
    opacity: 0;
    transform: translateY(-30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in.reverse.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-up.reverse {
    opacity: 0;
    transform: translateY(-50px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}

.fade-in-up.reverse.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-left.reverse {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-left.reverse.visible {
    opacity: 1;
    transform: translateX(0);
}

.fade-in-right.reverse {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-right.reverse.visible {
    opacity: 1;
    transform: translateX(0);
}

.fade-in-scale.reverse {
    opacity: 0;
    transform: scale(1.1);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-scale.reverse.visible {
    opacity: 1;
    transform: scale(1);
}

/* Subtle Parallax effects - limited to 10-15px movement */
.parallax-slow {
    transform: translateZ(0);
    will-change: transform;
}

.parallax-medium {
    transform: translateZ(0);
    will-change: transform;
}

.parallax-fast {
    transform: translateZ(0);
    will-change: transform;
}

/* Smooth transitions for all animated elements */
.fade-in, .fade-in-up, .fade-in-left, .fade-in-right, .fade-in-scale,
.fade-in.reverse, .fade-in-up.reverse, .fade-in-left.reverse, 
.fade-in-right.reverse, .fade-in-scale.reverse {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}