@import "tailwindcss";

body {
    font-family: 'Poppins', 'Inter', sans-serif;
    scroll-behavior: smooth;
    background-color: #111827; 
    color: #E5E7EB; 
}
.brand-primary { color: #F02D65; } 
.brand-secondary { color: #667EEA; }

.hero-gradient {
    background: linear-gradient(145deg, #1F2937 0%, #374151 30%, #4B5563 70%, #111827 100%);
}
.cta-button-primary {
    background-color: #E0275E;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0 4px 15px rgba(224, 39, 94, 0.3);
    font-weight: 600;
    color: #fff;
}

.cta-button-primary:hover {
    background-color: #C31F52;
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 8px 25px rgba(224, 39, 94, 0.4);
}

.cta-button-secondary {
    background-color: transparent;
    border: 2px solid #ffffff;
    color: #ffffff;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.cta-button-secondary:hover {
    background-color: #F02D65;
    color: white;
    transform: translateY(-3px);
    box-shadow: 0 4px 10px rgba(240, 45, 101, 0.2);
}

.package-card {
    background: rgba(31, 41, 55, 0.7); 
    backdrop-filter: blur(10px); 
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(75, 85, 99, 0.6);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    border-radius: 1rem; 
    display: flex;
    flex-direction: column; 
}
.package-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
    border-color: #F02D65; 
}
.package-card .cta-button-package {
    background-color: #F02D65;
    color: white;
    font-weight: 600;
    transition: all 0.3s ease;
    margin-top: auto; 
}
.package-card .cta-button-package:hover {
    background-color: #D81B50;
    transform: scale(1.05);
}
.package-card.featured {
    border: 2px solid #F02D65;
    transform: scale(1.03); 
    box-shadow: 0 15px 35px rgba(240, 45, 101, 0.2);
}
 .package-card.featured:hover {
    transform: translateY(-10px) scale(1.05); 
}

.feature-icon-bg { background-color: rgba(240, 45, 101, 0.15); }
.section-title-underline {
    position: relative; display: inline-block; padding-bottom: 12px;
}
.section-title-underline::after {
    content: ''; position: absolute; left: 50%; transform: translateX(-50%);
    bottom: 0px; width: 70px; height: 5px;
    background-color: #F02D65; border-radius: 3px;
}
.reveal-on-scroll {
    opacity: 0; transform: translateY(40px);
    transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.reveal-on-scroll.is-visible { opacity: 1; transform: translateY(0); }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #1F2937; }
::-webkit-scrollbar-thumb { background: #F02D65; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #D81B50; }

.nav-sticky { transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out; }
.nav-scrolled {
    background-color: rgba(17, 24, 39, 0.9) !important; 
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}
.hero-text-animation span {
    display: inline-block; opacity: 0; transform: translateY(20px);
    animation: fadeInUp 0.5s forwards;
}
@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }

.process-step { position: relative; padding-left: 40px; }
.process-step:not(:last-child)::before { 
    content: ''; position: absolute; left: 12px; top: 36px;
    bottom: -16px; width: 2px; background-color: #4B5563; 
}
.process-step-icon {
    position: absolute; left: 0; top: 0; background-color: #F02D65; color: white;
    width: 28px; height: 28px; border-radius: 50%; display: flex;
    align-items: center; justify-content: center; font-weight: 600; font-size: 0.9rem;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23E5E7EB%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: .8em;
    padding-right: 2.5rem; 
}
.testimonial-card {
    background: rgba(31, 41, 55, 0.5);
    border: 1px solid rgba(75, 85, 99, 0.5);
}
.portfolio-item-description {
    background-color: rgba(17, 24, 39, 0.8); 
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}