/* Fonts settings */
body, p, .navbar, .brand, a, .td-name, td, button, input, select, textarea {
    font-family: "Roboto", "Helvetica", Arial, sans-serif;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,
.title, .card-title, .info-title, .footer-brand, .footer-big h5, .footer-big h4, .media .media-heading {
    font-family: "Dosis", "Helvetica", Arial, sans-serif;
    font-weight: 600;
}

/* Common Styles */
.title {
    color: #111111;
}

.bg-gradient {
    background: linear-gradient(270deg, #4db6ac 0%, #00796b 100%);
}


.bg-gradient-light {
    /*background: linear-gradient(207deg, #f9f9f9 0%, #dadada 100%);*/
    background-color: #F5FAFD;
}

/* Header Section */
.aa-header {
    /*background-image: url("../images/home-image.jpg");*/
    background: linear-gradient(0deg, #4db6ac 0%, #009688 50%, #00796b 100%);

    position: relative;
    background-size: cover;
    min-height: 500px;
}

.aa-header .navbar .navbar-brand {
    font-size: 24px;
    font-family: "Dosis", "Helvetica", Arial, sans-serif;
    font-weight: 600;
    box-shadow: none;
    letter-spacing: 1px;
    opacity: 1;
}

.aa-header .aa-header-content {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.aa-header .aa-header-content h1 {
    letter-spacing: 1px;
}

.aa-header .aa-logo-img {
    padding-left: 10px;
    width: 8% !important;
}

@media (max-width: 992px) {

    .aa-header h1 {
        font-size: 38px;
    }

    .aa-header .aa-header-content img {
        padding-top: 40px;
    }

    .aa-header .aa-header-content li {
        font-size: 12px;
    }

    .aa-header .aa-logo-img {
        padding-left: 10px;
        width: 12% !important;
    }
}

@media (max-width: 768px) {
    .aa-header .aa-header-content img {
        margin-top: 2px !important;
        padding-top: none !important;
        padding-bottom: 20px;
    }
    .aa-header .aa-logo-img {
        padding-left: 10px;
        width: 10% !important;
    }

}



@media (max-width: 576px) {
    .aa-header {
        text-align: center;
    }
    .aa-header .aa-logo-img {
        display: none;
        padding-left: 10px;
        width: 12% !important;
    }
    #_name1 {
        margin-top: -25px;
    }

    .aa-header .navbar-brand {
        padding-right: 20px !important;
    }

    .aa-header .aa-header-content li {
        font-size: 10px;
    }
}

/* Body Section */
.aa-product-details .description {
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.aa-product-details .description .h4 {
    color: #111111;
    padding-bottom: 1.5rem;
}

.aa-product-details .icon {
    float: left;
    margin-top: 35px;
    margin-right: 60px;
    font-size: 3rem;
}

.aa-screenshots {
    background-color: #F5FAFD;
}

@media (max-width: 992px) {
    .aa-screenshots .carousel-inner .carousel-item img {
        height: 300px;
    }
}

@media (max-width: 768px) {
    .aa-screenshots .carousel-inner .carousel-item img {
        height: 200px;
    }
}

@media (max-width: 400px) {
    .aa-screenshots .carousel-inner .carousel-item img {
        height: 150px;
    }
}

.aa-price-package .card {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px -1px;
}

.aa-price-package .aa-price {
    padding-bottom: 1.5rem;
    background-color: #F5FAFD;
}

.aa-price-package .aa-price .btn {
    width: 8rem;
}

.aa-price-package .aa-price .aa-price-section {
    padding: 25px 5px;
    background-color: white;
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    font-size: 28px;
    font-family: "Dosis", "Helvetica", Arial, sans-serif;
    font-weight: 600;
}

.aa-price-package .aa-price .aa-price-section span {
    font-family: "Dosis", "Helvetica", Arial, sans-serif;
    font-weight: 600;
    font-size: 38px;
}

.aa-price-package .aa-price ul li {
    line-height: 3;
    border-bottom: 1px dashed #eee;
}

.aa-price-package .aa-price-active {
    background-color: white;
}

.aa-price-package .aa-price-active .btn {
    border: none;
    padding-top: .65rem;
    padding-bottom: .65rem;
}

.aa-price-package .text-small {
    font-size: 90%;
    line-height: 3;
    opacity: 0.75;
}

.aa-price-package .text-small:hover {
    opacity: 1;
}

.aa-testimonials-section .aa-testimonials {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.aa-testimonials-section .aa-testimonials img {
    border-radius: 100%;
    width: 96px;
    height: auto;
}

.aa-testimonials-section .aa-testimonials .aa-testimonials-body {
    background-color: #F5FAFD;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
    border-radius: 12px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 6px 10px -4px;
}

.aa-testimonials-section .aa-testimonials .h5 {
    color: #111111;
}

@media (max-width: 992px) {
    .aa-testimonials-section .aa-testimonials .aa-testimonials-body {
        padding-left: 1rem;
        padding-right: 1rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .aa-testimonials-section .aa-testimonials .aa-testimonials-body p {
        font-size: 12px;
    }
}

@media (max-width: 768px) {
    .aa-testimonials-section .aa-testimonials .aa-testimonials-body {
        text-align: center;
    }

    .aa-testimonials-section .aa-testimonials .aa-testimonials-body {
        padding-left: 3rem;
        padding-right: 3rem;
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

.aa-download-section i {
    color: #888;
}

.aa-download-section .aa-apple:hover i {
    color: #B4B0B0;
}

.aa-download-section .aa-android:hover i {
    color: #a4c639;
}

.aa-download-section .aa-windows:hover i {
    color: #0078d7;
}

.aa-download-section .aa-download-icon {
    padding-left: 40px;
}

@media (max-width: 992px) {
    .aa-download-section p {
        font-size: 10px;
    }
}

@media (max-width: 992px) {
    .aa-download-section p {
        font-size: 12px;
    }

    .aa-download-section .aa-download-icon {
        padding-left: 0px;
        text-align: center;
    }

    .aa-download-section .aa-download-icon-detail {
        text-align: center;
    }
}

@media (max-width: 576px) {
    .aa-download-section p {
        font-size: 14px;
    }
}

/* Footer sectiom */
.footer-black {
    background-color: #252422;
    color: #DDDDDD;
}

.aa-footer a.credit {
    color: inherit;
    border-bottom: 1px dashed;
}


.download-button {
    text-transform: none !important;
    font-size: 1.2rem;
    margin-left: 20px;
}

.video-elegant {
    border: 2px solid #ccc; /* Adjust the border thickness and color as desired */
    border-radius: 10px; /* Adjust the corner radius for a rounded effect */
    overflow: hidden; /* Ensure the rounded corners apply to any video content */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Optional shadow for an elevated look */
}


.team-card {
    border: 1px solid #e0e0e0; /* Light border for separation */
    border-radius: 10px; /* Rounded corners for a modern look */
    overflow: hidden; /* Ensures that the card content fits within the rounded corners */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    padding-left: 30px;
}

.team-card:hover {
    transform: translateY(-5px); /* Slight lift on hover for interactivity */
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1); /* Elevated shadow on hover */
}

.card-title a {
    color: inherit;
    text-decoration: none;
}

.card-title a:hover {
    text-decoration: underline;
}


.theme-color-text {
    color: #009688;
}

.nav-text-large {
    font-size: larger !important;
    font-weight: bolder;
}
.list-font-size{
    font-size: 16px;
}

#youtube-player {
    border: none!important;
    width: 440px;
    height: 782px;
}


@media (max-width: 768px) {
    #youtube-player {
        width: 400px; /* Approximately 9% smaller than 440px */
        height: 710px; /* Adjusted height to maintain aspect ratio */
    }
}

.aa-product-details {
    padding: 30px;
}

/*---------------------------------------------------------------------------*/
/* 1) Reduce spacing under the “Discover” heading (#features is your ID)      */
/*---------------------------------------------------------------------------*/
#features .text-center {
    margin-bottom: 1rem !important;    /* shrink the gap under the H2 wrapper */
}
#features .title {
    margin-bottom: 0.5rem !important;  /* shrink the gap under the H2 itself */
}

/*---------------------------------------------------------------------------*/
/* 2) Tighter feature cards: icons, titles & body copy                        */
/*---------------------------------------------------------------------------*/
.aa-product-details .description {
    margin-bottom: 0rem !important;    /* reduce space under each card */
}
.aa-product-details .icon {
    float: left;
    /*margin-top: 0.1rem !important;     !* less top‑padding on icon *!*/
    margin-right: 2rem !important;     /* less gap to text */
    font-size: 2rem !important;        /* scale icons down from 3rem */
    line-height: 1;                    /* tighten vertical rhythm */
}
.aa-product-details .description .h4 {
    padding-bottom: 0.5rem !important; /* shrink gap under each feature title */
    font-size: 1.4rem;                 /* slightly smaller */
}
.aa-product-details .description p {
    margin-bottom: 0.5rem !important;  /* shrink gap under body text */
}

/*---------------------------------------------------------------------------*/
/* 3) Even tighter on phones (<576px)                                         */
/*---------------------------------------------------------------------------*/
@media (max-width: 576px) {
    /* Heading */
    #features .text-center {
        margin-bottom: 0.75rem !important;
    }

    /* Icons */
    .aa-product-details .icon {
        font-size: 1.5rem !important;
        margin-top: 2rem !important;
        margin-right: 1rem !important;
    }

    /* Feature titles & text */
    .aa-product-details .description .h4 {
        /*padding-bottom: 0.25rem !important;*/
        font-size: 1.4rem;
    }
    .aa-product-details .description p {
        margin-bottom: 0rem !important;
        font-size: 0.9rem;
    }

    /* Optional: collapse column gutters even more */
    #features {
        --bs-gutter-x: 0.5rem;
        --bs-gutter-y: 0.5rem;
    }


    /* Font‑Awesome icons in the list */
    .aa-header .aa-header-content ul.list-unstyled li i.fa {
        /* default around 1em (~16px), so scale up */
        font-size: 0.8rem;
        /* adjust vertical alignment if needed */
        line-height: 1;
    }

    .aa-header .aa-header-content ul {
        padding-left: 50px;
    }
    .download_buttons {
        padding-left: 25px;
    }
}

/* Increase header text, list text & icon sizes on large devices only */
@media (min-width: 992px) {
    /* “Your best mobile…” paragraph */
    .aa-header .aa-header-content p.lead {
        /* fs-5 is about 1.25rem by default; feel free to tweak */
        font-size: 1.75rem;
        line-height: 1.3;
    }

    /* List item text */
    .aa-header .aa-header-content ul.list-unstyled li .list-font-size {
        /* default was 16px; bump up to 18–20px as you like */
        font-size: 1.25rem;
    }

    /* Font‑Awesome icons in the list */
    .aa-header .aa-header-content ul.list-unstyled li i.fa {
        /* default around 1em (~16px), so scale up */
        font-size: 1.75rem;
        /* adjust vertical alignment if needed */
        line-height: 1;
    }
}


html, body {
    overflow-x: hidden;
}

/* Video Optimization Styles */
.lazy-video {
    background-color: #f0f0f0;
    transition: opacity 0.3s ease-in-out;
}

.lazy-video[data-src] {
    opacity: 0.7;
}

.lazy-video:not([data-src]) {
    opacity: 1;
}

/* Video loading state */
.lazy-video::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        90deg,
        rgba(240, 240, 240, 0.2) 25%,
        rgba(240, 240, 240, 0.4) 50%,
        rgba(240, 240, 240, 0.2) 75%
    );
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    pointer-events: none;
}

.lazy-video:not([data-src])::before {
    display: none;
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

/* Video performance optimizations */
video {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    /* Enable hardware acceleration */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    /* Smooth rendering */
    image-rendering: optimizeQuality;
    -webkit-image-rendering: optimizeQuality;
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    .lazy-video {
        animation: none;
    }
    
    @keyframes shimmer {
        0%, 100% {
            background-position: 0 0;
        }
    }
}

/* Video container optimization */
.ratio {
    position: relative;
    overflow: hidden;
}

/* Connection-based optimizations */
@media (max-width: 768px) {
    /* On mobile, further reduce video quality if needed */
    video {
        filter: contrast(0.95) brightness(1.05);
    }
}

/* For users on slow connections */
@media (max-width: 576px), (max-height: 667px) {
    .lazy-video {
        /* Could add additional optimizations for very small screens */
        filter: contrast(0.9) brightness(1.1);
    }
}
