/* SMACSS Architecture */

/* Base Styles */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    background-color: #ffffff;
    color: #333333;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
}

h1 {
    font-size: 2.5rem;
}

h2 {
    font-size: 2rem;
}

h3 {
    font-size: 1.75rem;
}

h4 {
    font-size: 1.5rem;
}

h5 {
    font-size: 1.25rem;
}

p {
    margin-bottom: 1rem;
}

a {
    color: #333333;
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover, a:focus {
    color: #00d869;
}

ul, ol {
    list-style-position: inside;
    margin-bottom: 1rem;
}

img {
    display: block;
    height: auto;
    max-width: 100%;
}

button, input, textarea {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
}

/* Layout Styles */
.ai_container {
    margin: 0 auto;
    max-width: 1200px;
    padding: 0 1.5rem;
    width: 100%;
}

.ai_mainContent {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Header & Navigation */
.ai_header {
    background-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: 1rem 0;
    position: sticky;
    top: 0;
    transition: padding 0.3s ease;
    z-index: 100;
}

.ai_headerContent {
    align-items: center;
    display: flex;
    justify-content: space-between;
    position: relative;
}

.ai_logoContainer {
    text-align: center;
}

.ai_logoText {
    background: linear-gradient(135deg, #00d869, #ffd700);
    background-clip: text;
    color: transparent;
    font-size: 1.75rem;
    font-weight: 700;
    -webkit-background-clip: text;
}

.ai_leftNav, .ai_rightNav {
    display: flex;
    flex: 1;
}

.ai_rightNav {
    justify-content: flex-end;
}

.ai_navList {
    align-items: center;
    display: flex;
    list-style: none;
    margin: 0;
}

.ai_navItem {
    margin: 0 1rem;
}

.ai_navLink {
    font-weight: 500;
    position: relative;
}

.ai_navLink::after {
    background: linear-gradient(135deg, #00d869, #ffd700);
    bottom: -5px;
    content: '';
    height: 2px;
    left: 0;
    opacity: 0;
    position: absolute;
    transform: translateY(5px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    width: 100%;
}

.ai_navLink:hover::after,
.ai_navLink:focus::after,
.ai_navLink.ai_active::after {
    opacity: 1;
    transform: translateY(0);
}

.ai_hamburger {
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    display: none;
    flex-direction: column;
    height: 24px;
    justify-content: space-between;
    padding: 0;
    width: 30px;
}

.ai_hamburgerLine {
    background-color: #333333;
    height: 2px;
    transition: all 0.3s ease;
    width: 100%;
}

.ai_hamburger.ai_active .ai_hamburgerLine:nth-child(1) {
    transform: translateY(11px) rotate(45deg);
}

.ai_hamburger.ai_active .ai_hamburgerLine:nth-child(2) {
    opacity: 0;
}

.ai_hamburger.ai_active .ai_hamburgerLine:nth-child(3) {
    transform: translateY(-11px) rotate(-45deg);
}

.ai_mobileMenu {
    background-color: #ffffff;
    height: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: 100%;
    transition: all 0.3s ease;
    visibility: hidden;
    width: 100%;
    z-index: 99;
}

.ai_mobileMenu.ai_active {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    height: auto;
    opacity: 1;
    padding: 1rem 0;
    visibility: visible;
}

.ai_mobileNavList {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
}

.ai_mobileNavItem {
    margin: 0.5rem 0;
    text-align: center;
}

.ai_mobileNavLink {
    display: block;
    font-weight: 500;
    padding: 0.5rem 0;
}

/* Module Styles */

/* Hero Section */
.ai_heroSection {
    background: linear-gradient(135deg, #f9f9f9, #f1f1f1);
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.ai_heroContent {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    padding: 4rem 0;
    position: relative;
    z-index: 2;
}

.ai_heroText {
    margin-bottom: 2rem;
    max-width: 700px;
    text-align: center;
}

.ai_heroTitle {
    font-size: 3rem;
    margin-bottom: 1.5rem;
}

.ai_heroDescription {
    font-size: 1.25rem;
    margin-bottom: 2rem;
}

.ai_heroButtons {
    display: flex;
    gap: 1rem;
    justify-content: center;
}

.ai_primaryButton, .ai_secondaryButton {
    border-radius: 8px;
    display: inline-block;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    text-align: center;
    transition: all 0.3s ease;
}

.ai_primaryButton {
    background: linear-gradient(135deg, #00d869, #ffd700);
    color: #ffffff;
}

.ai_primaryButton:hover, .ai_primaryButton:focus {
    box-shadow: 0 4px 12px rgba(221, 187, 39, 0.4);
    color: #ffffff;
    transform: translateY(-2px);
}

.ai_secondaryButton {
    background-color: transparent;
    border: 2px solid #00d869;
    color: #333333;
}

.ai_secondaryButton:hover, .ai_secondaryButton:focus {
    background-color: rgba(221, 187, 39, 0.1);
    transform: translateY(-2px);
}

.ai_heroImageContainer {
    margin-top: 2rem;
    max-width: 800px;
    width: 100%;
}

.ai_heroImage {
    border-radius: 8px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.ai_heroShapes {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

.ai_shape {
    background: linear-gradient(135deg, rgba(221, 187, 39, 0.1), rgba(255, 215, 0, 0.1));
    border-radius: 50%;
    position: absolute;
}

.ai_shape1 {
    height: 300px;
    left: -100px;
    top: -100px;
    width: 300px;
}

.ai_shape2 {
    bottom: 10%;
    height: 500px;
    right: -200px;
    width: 500px;
}

.ai_shape3 {
    bottom: -150px;
    height: 250px;
    left: 30%;
    width: 250px;
}

/* Section Styles */
.ai_sectionHeader {
    margin-bottom: 3rem;
    text-align: center;
}

.ai_sectionTitle {
    margin-bottom: 1rem;
}

.ai_sectionDescription {
    color: #666666;
    margin: 0 auto;
    max-width: 700px;
}

/* Features Section */
.ai_featuresSection {
    padding: 6rem 0;
}

.ai_featuresGrid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.ai_featureCard {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    padding: 2rem;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_featureCard:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.ai_featureIcon {
    font-size: 3rem;
    margin-bottom: 1.5rem;
}

.ai_featureTitle {
    margin-bottom: 1rem;
}

/* Comparison Section */
.ai_comparisonSection {
    background-color: #f9f9f9;
    padding: 6rem 0;
}

.ai_tableContainer {
    margin: 0 auto;
    max-width: 800px;
    overflow-x: auto;
}

.ai_comparisonTable {
    border-collapse: collapse;
    width: 100%;
}

.ai_comparisonHeader {
    background-color: #f1f1f1;
    font-size: 1.2rem;
    padding: 1.5rem;
    text-align: left;
}

.ai_comparisonHeader.ai_highlighted {
    background: linear-gradient(135deg, #00d869, #ffd700);
    color: #ffffff;
}

.ai_comparisonCell {
    border-bottom: 1px solid #eeeeee;
    padding: 1.5rem;
}

.ai_comparisonCell.ai_highlighted {
    background-color: rgba(221, 187, 39, 0.1);
    font-weight: 500;
}

/* Pricing Section */
.ai_pricingSection {
    padding: 6rem 0;
}

.ai_pricingGrid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.ai_pricingCard {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    padding: 2rem;
    position: relative;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_pricingCard:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.ai_popularPlan {
    border: 2px solid #00d869;
}

.ai_popularBadge {
    background: linear-gradient(135deg, #00d869, #ffd700);
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    left: 0;
    padding: 0.5rem 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.ai_pricingHeader {
    margin-bottom: 2rem;
    padding-top: 1rem;
}

.ai_popularPlan .ai_pricingHeader {
    padding-top: 2rem;
}

.ai_pricingTitle {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.ai_pricingAmount {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
}

.ai_currency, .ai_period {
    font-size: 1rem;
    font-weight: 500;
    vertical-align: middle;
}

.ai_pricingFeatures {
    list-style: none;
    margin-bottom: 2rem;
    padding: 0;
}

.ai_pricingFeature {
    margin-bottom: 0.75rem;
    padding-left: 1.5rem;
    position: relative;
}

.ai_pricingFeature::before {
    color: #00d869;
    content: "✓";
    left: 0;
    position: absolute;
}

.ai_pricingButton {
    background-color: #f1f1f1;
    border-radius: 8px;
    display: inline-block;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    text-align: center;
    transition: all 0.3s ease;
    width: 100%;
}

.ai_pricingButton:hover {
    background-color: #e5e5e5;
    transform: translateY(-2px);
}

.ai_pricingButton.ai_primaryButton {
    background: linear-gradient(135deg, #00d869, #ffd700);
    color: #ffffff;
}

.ai_pricingButton.ai_primaryButton:hover {
    box-shadow: 0 4px 12px rgba(221, 187, 39, 0.4);
}

/* Testimonials Section */
.ai_testimonialsSection {
    background-color: #f9f9f9;
    padding: 6rem 0;
}

.ai_testimonialsGrid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.ai_testimonialCard {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    padding: 2rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_testimonialCard:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.ai_testimonialContent {
    margin-bottom: 1.5rem;
}

.ai_testimonialText {
    font-style: italic;
}

.ai_testimonialAuthor {
    align-items: center;
    display: flex;
}

.ai_testimonialImage {
    border-radius: 50%;
    height: 60px;
    margin-right: 1rem;
    object-fit: cover;
    width: 60px;
}

.ai_testimonialName {
    font-size: 1.1rem;
    margin-bottom: 0.25rem;
}

.ai_testimonialPosition {
    color: #666666;
    font-size: 0.875rem;
    margin: 0;
}

/* FAQ Section */
.ai_faqSection {
    padding: 6rem 0;
}

.ai_faqContainer {
    margin: 0 auto;
    max-width: 800px;
}

.ai_faqItem {
    border-bottom: 1px solid #eeeeee;
    margin-bottom: 1rem;
}

.ai_faqQuestion {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    padding: 1.5rem 0;
}

.ai_faqQuestionText {
    font-size: 1.2rem;
    margin: 0;
}

.ai_faqToggle {
    background: none;
    border: none;
    cursor: pointer;
    height: 24px;
    padding: 0;
    position: relative;
    width: 24px;
}

.ai_faqIcon {
    background-color: #333333;
    height: 2px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
    width: 100%;
}

.ai_faqIcon::after {
    background-color: #333333;
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transform: rotate(90deg);
    transition: transform 0.3s ease;
    width: 100%;
}

.ai_faqItem.ai_active .ai_faqIcon::after {
    transform: rotate(0);
}

.ai_faqAnswer {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 0 0 1rem;
    transition: all 0.3s ease;
}

.ai_faqItem.ai_active .ai_faqAnswer {
    height: auto;
    opacity: 1;
    padding-bottom: 1.5rem;
}

/* Contact Section */
.ai_contactSection {
    padding: 6rem 0;
}

.ai_contactContent {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1fr 1fr;
}

.ai_formGroup {
    margin-bottom: 1.5rem;
}

.ai_formLabel {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.ai_formInput, .ai_formTextarea {
    background-color: #f9f9f9;
    border: 1px solid #eeeeee;
    border-radius: 8px;
    font-size: 1rem;
    outline: none;
    padding: 0.75rem 1rem;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    width: 100%;
}

.ai_formInput:focus, .ai_formTextarea:focus {
    border-color: #00d869;
    box-shadow: 0 0 0 2px rgba(221, 187, 39, 0.2);
}

.ai_submitButton {
    background: linear-gradient(135deg, #00d869, #ffd700);
    border: none;
    border-radius: 8px;
    color: #ffffff;
    cursor: pointer;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    transition: all 0.3s ease;
    width: 100%;
}

.ai_submitButton:hover, .ai_submitButton:focus {
    box-shadow: 0 4px 12px rgba(221, 187, 39, 0.4);
    transform: translateY(-2px);
}

.ai_contactItem {
    margin-bottom: 2rem;
}

.ai_contactTitle {
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
}

.ai_contactMap {
    border-radius: 8px;
    overflow: hidden;
}

.ai_contactMap iframe {
    height: 300px;
    width: 100%;
}

/* Footer */
.ai_footer {
    background-color: #f1f1f1;
    padding: 3rem 0;
}

.ai_footerContent {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.ai_footerLogo {
    margin-bottom: 2rem;
}

.ai_footerNavList {
    display: flex;
    justify-content: center;
    list-style: none;
    margin-bottom: 2rem;
}

.ai_footerNavItem {
    margin: 0 1rem;
}

.ai_footerNavLink {
    font-weight: 500;
}

.ai_copyrightText {
    margin-bottom: 0;
}

/* Cookie Banner */
.ai_cookieBanner {
    background-color: #333333;
    bottom: 0;
    color: #ffffff;
    display: flex;
    justify-content: space-between;
    left: 0;
    opacity: 0;
    padding: 1rem;
    position: fixed;
    transform: translateY(100%);
    transition: all 0.3s ease;
    visibility: hidden;
    width: 100%;
    z-index: 1000;
}

.ai_cookieBanner.ai_show {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.ai_cookieContent {
    flex: 1;
    padding-right: 1rem;
}

.ai_cookieText {
    margin-bottom: 0;
}

.ai_cookieLink {
    color: #ffffff;
    text-decoration: underline;
}

.ai_cookieButton {
    background-color: #ffffff;
    border: none;
    border-radius: 8px;
    color: #333333;
    cursor: pointer;
    font-weight: 600;
    padding: 0.5rem 1rem;
    transition: all 0.3s ease;
}

.ai_cookieButton:hover {
    background-color: #f1f1f1;
}

/* State Styles */

/* Focus state for accessibility */
a:focus, button:focus, input:focus, textarea:focus {
    outline: 2px solid #00d869;
    outline-offset: 2px;
}

/* Scroll Style */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #00d869, #ffd700);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #00d869;
}

/* Responsive Styles */
@media (max-width: 992px) {
    .ai_heroTitle {
        font-size: 2.5rem;
    }

    .ai_contactContent {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    html {
        font-size: 14px;
    }

    .ai_leftNav, .ai_rightNav {
        display: none;
    }

    .ai_hamburger {
        display: flex;
    }

    .ai_heroContent {
        padding: 3rem 0;
    }

    .ai_heroTitle {
        font-size: 2rem;
    }

    .ai_heroContent {
        padding-top: 2rem;
    }

    .ai_footerNavList {
        flex-wrap: wrap;
    }

    .ai_footerNavItem {
        margin: 0.5rem 1rem;
    }

    .ai_featuresSection,
    .ai_comparisonSection,
    .ai_pricingSection,
    .ai_testimonialsSection,
    .ai_faqSection,
    .ai_contactSection {
        padding: 4rem 0;
    }
}

@media (max-width: 576px) {
    .ai_heroTitle {
        font-size: 1.75rem;
    }

    .ai_heroDescription {
        font-size: 1rem;
    }

    .ai_heroButtons {
        flex-direction: column;
        gap: 0.75rem;
    }

    .ai_sectionHeader {
        margin-bottom: 2rem;
    }

    .ai_cookieBanner {
        flex-direction: column;
    }

    .ai_cookieContent {
        margin-bottom: 1rem;
        padding-right: 0;
    }
}

/* Theme Styles - Gradient Effects */
.ai_gradientBg {
    background: linear-gradient(135deg, #00d869, #ffd700);
}

.ai_gradientText {
    background: linear-gradient(135deg, #00d869, #ffd700);
    background-clip: text;
    color: transparent;
    -webkit-background-clip: text;
}

/* About Page Styles */

/* About Hero Section */
.ai_aboutHero {
    height: 50vh;
    min-height: 300px;
}

/* Story Section */
.ai_storySection {
    padding: 6rem 0;
}

.ai_storyContent {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.ai_storyText p {
    margin-bottom: 1.5rem;
}

.ai_roundedImage {
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_roundedImage:hover {
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
    transform: translateY(-5px);
}

/* Mission Section */
.ai_missionSection {
    background-color: #f9f9f9;
    padding: 6rem 0;
}

.ai_missionContent {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.ai_missionStatement {
    color: #333333;
    font-size: 1.5rem;
    font-style: italic;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 2rem;
    position: relative;
    padding-left: 1.5rem;
}

.ai_missionStatement::before {
    background: linear-gradient(135deg, #00d869, #ffd700);
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 4px;
}

.ai_missionList {
    list-style: none;
    margin-top: 1.5rem;
}

.ai_missionItem {
    margin-bottom: 1rem;
    padding-left: 2rem;
    position: relative;
}

.ai_missionItem::before {
    background: linear-gradient(135deg, #00d869, #ffd700);
    border-radius: 50%;
    content: '';
    height: 10px;
    left: 0;
    position: absolute;
    top: 0.5rem;
    width: 10px;
}

/* Team Section */
.ai_teamSection {
    padding: 6rem 0;
}

.ai_teamGrid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.ai_teamCard {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    padding: 1.5rem;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_teamCard:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.ai_teamImageContainer {
    border-radius: 50%;
    height: 150px;
    margin: 0 auto 1.5rem;
    overflow: hidden;
    width: 150px;
}

.ai_teamImage {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.ai_teamName {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}

.ai_teamPosition {
    color: #666666;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

.ai_teamBio {
    color: #555555;
    font-size: 0.95rem;
    line-height: 1.5;
}

/* Technology Section */
.ai_technologySection {
    background-color: #f9f9f9;
    padding: 6rem 0;
}

.ai_technologyContent {
    display: grid;
    gap: 3rem;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.ai_technologySubtitle {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}

.ai_technologyList {
    list-style: none;
    margin-top: 1.5rem;
}

.ai_technologyItem {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_technologyItem:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.ai_technologyItemTitle {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ai_technologyItemDesc {
    color: #555555;
    font-size: 0.95rem;
    margin-bottom: 0;
}

/* Values Section */
.ai_valuesSection {
    padding: 6rem 0;
}

.ai_valuesGrid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.ai_valueCard {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    padding: 2rem;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ai_valueCard:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.ai_valueIcon {
    font-size: 3rem;
    margin-bottom: 1.5rem;
}

.ai_valueTitle {
    margin-bottom: 1rem;
}

.ai_valueDescription {
    color: #555555;
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Thank You Page Styles */
.ai_thankYouSection {
    padding: 8rem 0;
    min-height: calc(100vh - 200px); /* Adjust based on header and footer height */
    display: flex;
    align-items: center;
}

.ai_thankYouContent {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    margin: 0 auto;
    max-width: 700px;
    padding: 3rem;
    text-align: center;
}

.ai_thankYouIcon {
    background: linear-gradient(135deg, #00d869, #ffd700);
    border-radius: 50%;
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    height: 80px;
    margin-bottom: 1.5rem;
    width: 80px;
}

.ai_thankYouTitle {
    color: #333333;
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

.ai_thankYouMessage {
    color: #555555;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.ai_thankYouDetails {
    background-color: #f9f9f9;
    border-radius: 8px;
    margin: 2rem 0;
    padding: 1.5rem;
    text-align: left;
}

.ai_thankYouSubtitle {
    font-size: 1.3rem;
    margin-bottom: 1rem;
}

.ai_thankYouList {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.ai_thankYouItem {
    margin-bottom: 0.75rem;
    padding-left: 1.5rem;
    position: relative;
}

.ai_thankYouItem::before {
    background: linear-gradient(135deg, #00d869, #ffd700);
    border-radius: 50%;
    content: '';
    height: 8px;
    left: 0;
    position: absolute;
    top: 0.5rem;
    width: 8px;
}

.ai_thankYouRedirect {
    margin-top: 2rem;
}

.ai_redirectMessage {
    color: #666666;
    font-style: italic;
    margin-bottom: 1.5rem;
}

#countdown {
    font-weight: 700;
}

@media (max-width: 768px) {
    .ai_thankYouSection {
        padding: 5rem 0;
    }

    .ai_thankYouContent {
        padding: 2rem;
    }

    .ai_thankYouTitle {
        font-size: 2rem;
    }
}

@media (max-width: 576px) {
    .ai_thankYouContent {
        padding: 1.5rem;
    }

    .ai_thankYouIcon {
        height: 60px;
        width: 60px;
        font-size: 1.5rem;
    }
}

/* Responsive Styles for About Page */
@media (max-width: 992px) {
    .ai_storyContent,
    .ai_missionContent,
    .ai_technologyContent {
        grid-template-columns: 1fr;
    }

    .ai_storyImage,
    .ai_missionImage,
    .ai_technologyImage {
        margin-bottom: 2rem;
        order: -1;
    }
}

@media (max-width: 768px) {
    .ai_aboutHero {
        height: 40vh;
    }

    .ai_teamGrid,
    .ai_valuesGrid {
        grid-template-columns: 1fr 1fr;
    }

    .ai_storySection,
    .ai_missionSection,
    .ai_teamSection,
    .ai_technologySection,
    .ai_valuesSection {
        padding: 4rem 0;
    }
}

@media (max-width: 576px) {
    .ai_aboutHero {
        height: 30vh;
    }

    .ai_teamGrid,
    .ai_valuesGrid {
        grid-template-columns: 1fr;
    }
}

/* Animation Keyframes */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Animations */
.ai_fadeIn {
    animation: fadeIn 0.5s ease forwards;
}

.ai_slideUp {
    animation: slideUp 0.5s ease forwards;
}