<!DOCTYPE html>
<html lang="en">

<head>
    <?php include("include/meta.php");?>
    <?php include("include/css.php");?>
</head>
<style>
.team-details-info li {
    list-style: circle;
}

/* ====== Mission / Vision / Values Section ====== */
.team-single {
    background: linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);
    padding-top: 80px;
    padding-bottom: 80px;
    position: relative;
    overflow: hidden;
}

.team-single::before {
    content: "";
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: rgba(33, 150, 243, 0.08);
    border-radius: 50%;
    z-index: 0;
}

.team-single::after {
    content: "";
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 250px;
    height: 250px;
    background: rgba(255, 215, 0, 0.1);
    border-radius: 50%;
    z-index: 0;
}

/* Image styling */
.team-single-img img {
    width: 100%;
    border-radius: 15px;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1);
    transition: transform 0.4s ease;
}

.team-single-img img:hover {
    transform: scale(1.05);
}

/* Text content */
.team-details {
    position: relative;
    z-index: 1;
}

.team-details-info {
    margin-top: 20px;
    font-size: 17px;
    color: #444;
}

/* Auto add caret icon before list-like lines in dynamic content */
.ck-styled-content p,
.team-details-info p {
    position: relative;
    padding-left: 22px;
}

/* Responsive layout */
@media (max-width: 768px) {
    .team-single-img {
        margin-bottom: 20px;
    }

    .site-heading .site-title {
        font-size: 28px;
    }
}
</style>

<body>

    <!-- preloader -->
    <?php include("include/preloader.php");?>
    <!-- preloader end -->


    <!-- header area -->
    <?php include("include/header.php");?>
    <!-- header area end -->

    <main class="main">

        <!-- breadcrumb -->
        <?php
            $banner_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'slider' && recycle = '1' ORDER BY id DESC";
            $banner_run = mysqli_query($con, $banner_sql);
            if ($banner_row = mysqli_fetch_assoc($banner_run)) {
            ?>
        <div class="site-breadcrumb" style="background: url(./login/upload/<?php echo $banner_row['image_one']?>)">
            <div class="container">
                <h2 class="breadcrumb-title">About Us</h2>
                <ul class="breadcrumb-menu">
                    <li><a href="index.php">Home</a></li>
                    <li class="active">About Us</li>
                </ul>
            </div>
        </div>
        <?php }?>
        <!-- breadcrumb end -->


        <!-- about area -->
        <?php 
            $about_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'about' && recycle = '1' ";
            $about_run = mysqli_query($con, $about_sql);
            $c = 1;
            if ($about_row = mysqli_fetch_assoc($about_run)) {
        ?>
        <div class="about-area pt-120 pb-80">
            <div class="container">
                <div class="row g-4 align-items-center">
                    <div class="col-lg-6">
                        <div class="about-left wow fadeInLeft" data-wow-delay=".25s">
                            <div class="about-img">
                                <div class="row g-4">
                                    <div class="col-md-6 col-6">
                                        <img class="img-1" src="./login/upload/<?php echo $about_row['image_one']?>"
                                            alt="">
                                        <div class="about-experience mt-4">
                                            <div class="about-experience-icon">
                                                <img src="assets/img/icon/exchange-idea.svg" alt="">
                                            </div>
                                            <b class="text-start">Quality <br> 
                    Education    </b>
                                        </div>
                                    </div>
                                    <div class="col-md-6 col-6">
                                        <img class="img-2" src="assets/img/logo/macaw.png" alt="">
                                        <img class="img-3 mt-4"
                                            src="./login/upload/<?php echo $about_row['image_two']?>" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="about-right wow fadeInRight" data-wow-delay=".25s">
                            <div class="site-heading mb-3">
                                <span class="site-title-tagline"><i class="far fa-book-open-reader"></i> About Us</span>
                                <h2 class="site-title">
                                    <?= $about_row["title"];?>
                                </h2>
                            </div>
                            <p class="about-text">
                                <?= $about_row["short_des"];?>
                            </p>
                            <div class="about-content">
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="about-quote">
                                            <p><?= $about_row["title_two"];?></p>
                                            <i class="far fa-quote-right"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 mt-2">
                        <div class="ck-styled-content" align="justify">
                            <?= $about_row["long_des"];?>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php }?>
        <!-- about area end -->

        <!-- Who Are We area -->
        <?php
            $waw_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'waw' && recycle = '1' ORDER BY id DESC";
            $waw_run = mysqli_query($con, $waw_sql);
            if($waw_row = mysqli_fetch_assoc($waw_run)){
        ?>
        <div class="team-single pt-80 pb-80">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-9 mx-auto">
                        <div class="site-heading text-center">
                            <span class="site-title-tagline"><i class="far fa-book-open-reader"></i>
                                MACAW</span>
                            <h2 class="site-title">Who Are <span>We?</span></h2>
                        </div>
                    </div>
                    <?php if(!empty($waw_row['image_one'])){?>
                    <div class="col-md-4 text-center">
                        <div class="team-single-img">
                            <img src="./login/upload/<?= $waw_row['image_one']?>" alt="">
                        </div>
                    </div>
                    <?php }?>
                    <div class="col-md-<?php if(!empty($waw_row['image_one'])){ echo '8'; } else { echo '12'; }?>">
                        <div class="team-details">
                            <p class="mt-3">
                                <?= $waw_row['short_des']?>
                            </p>
                            <div class="team-details-info">
                                <?= $waw_row["long_des"]; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php } ?>
        <!-- Who Are We area end -->
        <!-- Mission area -->
        <?php
            $mission_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'mission' && recycle = '1' ORDER BY id DESC";
            $mission_run = mysqli_query($con, $mission_sql);
            if($mission_row = mysqli_fetch_assoc($mission_run)){
        ?>
        <div class="team-single pt-80 pb-80">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-9 mx-auto">
                        <div class="site-heading text-center">
                            <span class="site-title-tagline"><i class="far fa-book-open-reader"></i>
                                MACAW</span>
                            <h2 class="site-title">Our <span>Mission</span></h2>
                        </div>
                    </div>
                    <?php if(!empty($waw_row['image_one'])){?>
                    <div class="col-md-4 text-center">
                        <div class="team-single-img">
                            <img src="./login/upload/<?= $mission_row['image_one']?>" alt="">
                        </div>
                    </div>
                    <?php }?>
                    <div class="col-md-<?php if(!empty($mission_row['image_one'])){ echo '8'; } else { echo '12'; }?>">
                        <div class="team-details">
                            <p class="mt-3">
                                <?= $mission_row['short_des']?>
                            </p>
                            <div class="team-details-info">
                                <?= $mission_row["long_des"]; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php } ?>
        <!-- Mission area end -->
        <!-- Vision area -->
        <?php
            $vision_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'vision' && recycle = '1' ORDER BY id DESC";
            $vision_run = mysqli_query($con, $vision_sql);
            if($vision_row = mysqli_fetch_assoc($vision_run)){
        ?>
        <div class="team-single pt-80 pb-80">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-9 mx-auto">
                        <div class="site-heading text-center">
                            <span class="site-title-tagline"><i class="far fa-book-open-reader"></i>
                                MACAW</span>
                            <h2 class="site-title">Our <span>Vision</span></h2>
                        </div>
                    </div>
                    <?php if(!empty($waw_row['image_one'])){?>
                    <div class="col-md-4 text-center">
                        <div class="team-single-img">
                            <img src="./login/upload/<?= $vision_row['image_one']?>" alt="">
                        </div>
                    </div>
                    <?php }?>
                    <div class="col-md-<?php if(!empty($vision_row['image_one'])){ echo '8'; } else { echo '12'; }?>">
                        <div class="team-details">
                            <p class="mt-3">
                                <?= $vision_row['short_des']?>
                            </p>
                            <div class="team-details-info">
                                <?= $vision_row["long_des"]; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php } ?>
        <!-- Who Vision end -->
        <!-- Our Values area -->
        <?php
            $value_sql = "SELECT * FROM data_table WHERE up_by = $x && page_type = 'value' && recycle = '1' ORDER BY id DESC";
            $value_run = mysqli_query($con, $value_sql);
            if($value_row = mysqli_fetch_assoc($value_run)){
        ?>
        <div class="team-single pt-80 pb-80">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-9 mx-auto">
                        <div class="site-heading text-center">
                            <span class="site-title-tagline"><i class="far fa-book-open-reader"></i>
                                MACAW</span>
                            <h2 class="site-title">Our <span>Core Values</span></h2>
                        </div>
                    </div>
                    <?php if(!empty($waw_row['image_one'])){?>
                    <div class="col-md-4 text-center">
                        <div class="team-single-img">
                            <img src="./login/upload/<?= $value_row['image_one']?>" alt="">
                        </div>
                    </div>
                    <?php }?>
                    <div class="col-md-<?php if(!empty($value_row['image_one'])){ echo '8'; } else { echo '12'; }?>">
                        <div class="team-details">
                            <p class="mt-3">
                                <?= $value_row['short_des']?>
                            </p>
                            <div class="team-details-info">
                                <?= $value_row["long_des"]; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php } ?>
        <!-- Our Values area end -->

    </main>



    <!-- footer area -->
    <?php include("include/footer.php");?>
    <!-- footer area end -->


    <!-- js -->
    <?php include("include/js.php");?>

</body>

</html>