/*
Theme Name: REALSUCC Theme
Theme URI: https://example.com/realsucc-theme/
Author: Gemini
Author URI: https://example.com/
Description: A basic WordPress theme converted from the REALSUCC website HTML.
Version: 1.0
Requires at least: 5.0
Tested up to: 6.0
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: realsucc
Tags: custom-header, custom-menu, e-commerce, two-columns, full-width-template
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Koulen&display=swap');
body {
    font-family: 'Noto Sans SC', sans-serif;
    background-color: #f7f7f7;
    color: #333;
}
/* New class for the logo font */
.logo-font {
    font-family: 'Koulen', cursive;
}
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #000;
    color: #fff;
    z-index: 1000;
}
.container-full {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
/* UPDATED: Hero section styles for the new layout */
.main-hero {
    position: relative;
    background-color: #000;
    height: 60vh;
}
.menu-item:hover .menu-dropdown {
    display: block;
}
.menu-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #333;
    min-width: 200px;
    z-index: 50;
}
.menu-dropdown a {
    padding: 12px 16px;
    display: block;
    color: #fff;
    text-decoration: none;
}
.menu-dropdown a:hover {
    background-color: #555;
}
/* Adjusted colors for deeper red */
.red-bg {
    background-color: #8B0000; /* Deeper red for community section */
}
.deep-red-button {
    background-color: #8B0000; /* Deeper red for buttons */
}
.deep-red-button:hover {
    background-color: #6a0000; /* Darker red on hover */
}

.footer-bg {
    background-color: #000;
    color: #fff;
}
/* New fade-in animation for hero section text */
.fade-in-up {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 1s forwards;
}
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.hero-title {
    animation-delay: 0.3s;
}
.hero-subtitle {
    animation-delay: 0.6s;
}
.hero-button {
    animation-delay: 0.9s;
}
/* End of new hero section styles */

.back-to-top {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    z-index: 999;
    background-color: #8B0000; /* Deeper red */
    color: white;
    padding: 0.75rem;
    border-radius: 9999px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: background-color 0.3s ease-in-out;
    animation: fadeIn 0.5s forwards;
}
.back-to-top:hover {
    background-color: #6a0000; /* Darker red */
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* Styles for the new team card design */
.team-card {
    background-color: #ffffff;
    border-radius: 1.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.3s ease-in-out, transform 0.2s ease-in-out;
}
.team-card:hover {
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-8px);
}
/* New styles for the core services cards */
.service-card-high-end {
    position: relative;
    background-size: cover;
    background-position: center;
    height: 350px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 2rem;
    text-align: left;
    border-radius: 1rem;
    overflow: hidden;
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
/* Enhanced hover effect for service cards */
.service-card-high-end:hover {
    transform: scale(1.03);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.1);
}
.service-card-high-end::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.2));
    z-index: 1;
}
.service-card-high-end > * {
    position: relative;
    z-index: 2;
}
#research-card {
    background-image: url('https://realsucc.com/wp-content/themes/realsucc-theme/assets/images/bg-1-research.jpg');
}
#training-card {
    background-image: url('https://realsucc.com/wp-content/themes/realsucc-theme/assets/images/bg-2-training.jpg');
}
#systems-card {
    background-image: url('https://realsucc.com/wp-content/themes/realsucc-theme/assets/images/bg-3-systems.jpg');
}
#platform-card {
    background-image: url('https://realsucc.com/wp-content/themes/realsucc-theme/assets/images/bg-4-platform.jpg');
}

/* New styles for footer link underline on hover */
.footer-link-hover {
    position: relative;
    display: inline-block;
}

.footer-link-hover::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -2px;
    left: 0;
    background-color: #EF5350;
    transition: width 0.3s ease-in-out;
}

.footer-link-hover:hover::after {
    width: 100%;
}

/* UPDATED: Styles for the active menu item and dynamic effect */
.menu-item > a {
    transition: color 0.3s ease-in-out;
}
.active-menu-item {
    color: #D32F2F !important; /* Updated to match the logo red */
    font-weight: bold; /* Make it bold for emphasis */
}

/* NEW: Styles for the static red line under footer headings */
.footer-heading {
    position: relative;
    display: inline-block;
    margin-bottom: 1rem;
}
.footer-heading::after {
    content: '';
    position: absolute;
    bottom: -0.5rem;
    left: 0;
    width: 80%; /* 80% of the heading's width */
    height: 2px;
    background-color: #EF5350; /* A vibrant red */
    border-radius: 9999px; /* For rounded ends */
}