/* --------------- Font Family ---------------  - START */
@font-face {
    font-family: 'AvenirLTStd-Black';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Black.otf') format('opentype');
    /* font-weight: 900; */
    /* font-style: normal; */
}

@font-face {
    font-family: 'AvenirLTStd-BlackOblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-BlackOblique.otf') format('opentype');
    /* font-weight: 900; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Book';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Book.otf') format('opentype');
    /* font-weight: 400; */
    /* font-style: normal; */
}

@font-face {
    font-family: 'AvenirLTStd-BookOblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-BookOblique.otf') format('opentype');
    /* font-weight: 400; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Heavy';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Heavy.otf') format('opentype');
    /* font-weight: 800; */
    /* font-style: normal; */
}

@font-face {
    font-family: 'AvenirLTStd-HeavyOblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-HeavyOblique.otf') format('opentype');
    /* font-weight: 800; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Light';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Light.otf') format('opentype');
    /* font-weight: 300; */
    /* font-style: normal; */
}

@font-face {
    font-family: 'AvenirLTStd-LightOblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-LightOblique.otf') format('opentype');
    /* font-weight: 300; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Medium';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Medium.otf') format('opentype');
    /* font-weight: 500; */
    /* font-style: normal; */
}

@font-face {
    font-family: 'AvenirLTStd-MediumOblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-MediumOblique.otf') format('opentype');
    /* font-weight: 500; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Oblique';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Oblique.otf') format('opentype');
    /* font-weight: 600; */
    /* font-style: oblique; */
}

@font-face {
    font-family: 'AvenirLTStd-Roman';
    src: url('../Assets/Font/Avenir-font/AvenirLTStd-Roman.otf') format('opentype');
    /* font-weight: 600; */
    /* font-style: normal; */
}

/* --------------- Font Family ---------------  - END */

.hover-banner {
    cursor: pointer;
}
.accordion-item {
    border: none !important;
    font-family: 'AvenirLTStd-Book';
}

.carousel-indicators [data-bs-target] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    /* Makes them circular */
    background-color: #6c757d;
    /* Optional: custom color */
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.carousel-indicators .active {
    opacity: 1;
    background-color: #ffffff;
    /* Optional: highlight active dot */
}

:root {
    --calcite-ui-background: #ffffff;
    /* white */
    --shadow-color: rgba(0, 0, 0, 0.2);
    /* subtle shadow */
}

.image-box {
    position: relative;
    height: 160px;
    overflow: hidden;
}

/* .image-box img {
    transition: all 0.4s ease;
  } */

.image-box:hover {
    transform: scale(0.98);
    /* Slight inward zoom */
    transition: all 0.4s ease;
    box-shadow:
        inset 0 0 0 2px var(--calcite-ui-background),
        inset 0 0 0 10px var(--shadow-color);
}


/* esri logo */
#Layer_1 {
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 0.5s ease;
}

#Layer_1:hover {
    opacity: 1;
}

.hover-contrast-social {
    /* opacity: 0.5; */
    cursor: pointer;
    transition: opacity 0.5s ease;
}

.list-unstyled ul {
    list-style-type: none;
  
    
}

.list-unstyled ul a {
    text-decoration: none;
    color: #595959;
}

.list-unstyled ul a:hover {
    color: #0079c1;
}

.list-unstyled h6 {
    color: #4c4c4c;
}

/* Mobile View Footer Accordian Heading */
.accordion-button{
    font-family: AvenirLTStd-Medium;
}

.mobile-list-unstyled {

    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.mobile-list-unstyled li {

    list-style-type: none;

}

.mobile-list-unstyled li a{
    text-decoration: none;
    color: #595959;
    list-style-type: none
}


/* --------------- Footer Styles ---------------  - START */

/* Footer quick links */
.footer-links ul li a {
    position: relative;
    display: inline-block;
    padding-right: 20px;
    color: #595959;
    text-decoration: none;
    transition: color 0.3s ease;
}

/* Footer quick links arrow display effect */
.footer-links ul li a::after {
    content: '→';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
    color: inherit;
}

/* On hover, reveal the arrow and optionally add a slight translation */
.footer-links ul li a:hover {
    color: #3d5a96;
}

.footer-links ul li a:hover::after {
    opacity: 1;
    transform: translateY(-50%) translateX(5px);
}


/* ----- Footer Styles -----  - Responsiveness - START */

.footer {
    background-color: white;
    padding: 2rem 1rem;
}

.footer-logo-social {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

@media (max-width: 718px) {
    .footer-logo-social {
        flex-direction: row;
        justify-content: space-between;
    }
}

.social-icons a {
    margin-left: 10px;
}

.accordion-button {
    background-color: #ffffff;
}

.accordion-header {
    font-family: AvenirLTStd-Book !important;

}



/* ----- Footer Styles -----  - Responsiveness - END */


/* --------------- Footer Styles ---------------  - END */


/* --------------- Navbar Styles ---------------  - START */

@media (max-width: 718px) {
    .footer-logo-social {
        flex-direction: row;
        justify-content: space-between;
    }
    .accordion-item {
        border: none !important;
    }

    /* #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book' !important;
        font-size: 12px;
        letter-spacing: 1.5px;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }

    .list-unstyled li {
        padding: 17px;
    }

    .accordion-button {
        background-color: inherit !important;
        color: inherit !important;
        box-shadow: none !important;
    }

    .list-unstyled li a {
        color: #595959 !important;
        font-size: 13px;
    }

    .accordion-body {
        padding-top: 0;
    } */
}



/* Above Footer Quote Section - START */


/* Above Footer Quote Section - END */


/* Above Footer Gradient Bar - START */
.animated-gradient-bar {
    background-image: linear-gradient(90deg, rgb(41, 191, 255), rgb(162, 49, 255), rgb(13, 236, 205), rgb(41, 191, 255));
    background-repeat: repeat-x;
    background-size: 133vw 4px;
    height: 4px;
    animation: gradientScroll 4s linear infinite;
    padding-bottom: 2rem;
}


/* Keyframes for scrolling effect */
@keyframes gradientScroll {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: -133vw 0;
    }
}

/* Above Footer Gradient Bar - END */


/* Footer Social Media Icons - START */
.facebook-icon {
    fill: gray;
    transition: fill 0.3s ease;
}

.esri-footer-social-link.-facebook:hover .facebook-icon {
    fill: #1877F2;
    /* Facebook blue */
}

.social-icon {
    fill: gray;
    transition: fill 0.3s ease;
}


.instagram-icon {
    fill: gray;
    transition: fill 0.3s ease;

}

/* Instagram hover - reddish gradient tone */
/* .esri-footer-social-link.-instagram:hover .instagram-icon {
    fill: #E1306C;
} */

/* LinkedIn hover */
.esri-footer-social-link.-linkedin:hover .linkedin-icon {
    fill: #0077B5;
    /* LinkedIn blue */
}

/* YouTube hover */
.esri-footer-social-link.-youtube:hover .youtube-icon {
    fill: #FF0000;
    /* YouTube red */
}

/* Footer Social Media Icons - END */

/* Carousel Banner Fonts - START  */

/* Responsiveness - START */
@media (min-width: 2560px) {
    /* .custom-padding-left {
        padding-left: 38rem !important;
    } */
}

@media (min-width: 1441px) and (max-width: 2559px) {
    /* .custom-padding-left {
        padding-left: 16rem !important;
    } */
}

/* @media (max-width: 1440px) {
    .custom-padding-left {
      padding-left: 0 !important;
    }
  } */

/* Responsiveness - END */


/* Carousel Banner Fonts - END  */

/* Style for the icon container */
.esri-footer-social-link.-instagram {
    background-color: gray;
    /* Background color gray */
    display: inline-block;
    width: 30px;
    /* Set a fixed square size */
    height: 30px;
    /* Set a fixed square size */
    padding: 1px 5px 5px 5px;
    /* Padding around the SVG */
    transition: background-color 0.3s ease;
    /* Smooth transition effect on hover */
}

/* Style for the SVG icon */
.esri-footer-social-link.-instagram svg {
    width: 100%;
    /* Make the SVG take full width */
    height: 100%;
    /* Make the SVG take full height */
}

.esri-footer-social-link.-instagram svg path {
    fill: white;
    /* Instagram logo in white */
}

/* Change the background color when hovering */
.esri-footer-social-link.-instagram:hover {
    background-color: #E1306C;
    /* Instagram red color on hover */
}


/* About Menu - START */

/* Blue dot while hover  - START */

/* --- Left Blue Dot and Background Logic --- */

/* Default state for each list item */


/* arrow transition for nav links - START */

.arrow-transition::after {
    content: '→';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
    color: inherit;
}

/* On hover, reveal the arrow and optionally add a slight translation */
.arrow-transition {
    position: relative;
    display: inline-block;
    width: auto;
    transition: color 0.3s ease;
}

.arrow-transition:hover {
    color: #3d5a96;
}

.arrow-transition:hover::after {
    opacity: 1;
    transform: translateY(-50%) translateX(5px);
}

/* arrow transition for nav links - END */


.nav-link:focus,
.nav-link:active,
.nav-link.show,
.nav-link.active {
    background-color: transparent !important;
    box-shadow: none !important;
    color: inherit;
    /* Optional: keeps original text color */
}



/* About Menu - END */


/* New youtube icon style - START */

.youtube-bg {
    fill: gray;
    transition: fill 0.3s;
  }
  
  .youtube-body {
    fill: #fff;
    transition: fill 0.3s;
  }
  
  .youtube-play {
    fill: gray;
    transition: fill 0.3s;
  }
  
  .esri-footer-social-link.-youtube:hover .youtube-bg,
  .esri-footer-social-link.-youtube:hover .youtube-play {
    fill: #FF0000; /* YouTube red */
  }
/* New youtube icon style - END */





/*---------------------------------- RESPONSIVENESS SECTION ----------------------------------*/

/* 4K Desktop Monitor - 3840x2160 */
@media (min-width: 2561px) {
    /* Styles for 4K+ screens */
}

/* Ultrawide Monitor - 2560x1080 */
@media (max-width: 2560px) {
    /* Styles for ultrawide monitors */
}

/* Dell Latitude 7490 / Samsung S24C350L Monitor - 1920x1080 */
@media (max-width: 1920px) {
    /* Styles for standard monitors */
}

/* MacBook Pro 16" (M3) – Scaled to ~1728x1117 */
@media (max-width: 1728px) {
    /* Styles for retina laptops (can fine-tune height too) */
}

/* Galaxy S24 Ultra - 430x960 (high density) */
@media (max-width: 1920px) {
    /* Additional styling for Galaxy S24 Ultra if needed */
}

/* HP EliteBook 820 G3 - 1366x768 */
@media (max-width: 1366px) {
    /* Styles for smaller laptops */
}

/* iPad 9th Gen (Landscape) - 1080x810 approx. */
@media (max-width: 1080px) {
    /* Styles for landscape tablets or large phones */
}

/* iPad 9th Gen (Portrait) - 768x1024 */
@media (max-width: 768px) {
    /* Styles for portrait tablets */
    #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book';
        font-size: 0.75rem;
        letter-spacing: 0.1rem;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }
}

/* iPhone 15 Plus / iPhone 15 Pro Max / Galaxy S23 - ~430x932 */
@media (max-width: 430px) {
    /* Styles for large phones */
    #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book';
        font-size: 0.75rem;
        letter-spacing: 0.1rem;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }
}

/* Motorola G73 / iPhone 15 Pro - 393x852 */
@media (max-width: 393px) {
    /* Styles for Motorola G73 / iPhone 15 Pro */
    #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book';
        font-size: 0.75rem;
        letter-spacing: 0.1rem;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }
}

/* Motorola 662 - 360x800 */
@media (max-width: 360px) {
    /* Styles for Motorola 662 or similar */
    #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book';
        font-size: 0.75rem;
        letter-spacing: 0.1rem;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }
}

/* iPhone 5 / SE (1st Gen) - 320x568 */
@media (max-width: 320px) {
    /* Styles for very small screens */

     #footerAccordion * {
        color: #323233;
        font-family: 'AvenirLTStd-Book';
        font-size: 0.75rem;
        letter-spacing: 0.1rem;
        text-decoration: none;

    }

    .accordion-item {
        border: none !important;
    }

}