/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Saira:wght@500;600;700&display=swap');

/* Icon Fonts */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css');
@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css');

/* Libraries */
@import url('../lib/animate/animate.min.css');
@import url('../lib/owlcarousel/assets/owl.carousel.min.css');

/* Bootstrap */
@import url('./bootstrap.min.css');

/* Template base styles */
@import url('./style.css');

/* Page-specific overrides moved from index.html */
/* Portrait: square, Landscape: 16:9 (1920x1080), center-cropped */
.carousel-square {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: 100%; /* default 1:1 */
}
@media (orientation: landscape) {
    .carousel-square {
        padding-top: 56.25%; /* 16:9 */
    }
}
.carousel-square > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
/* New: Navbar brand colors */
:root {
    --primary: #2c4752;
    --secondary: #50998e;
}
/* Passive links = primary, active/hover/focus = secondary */
.navbar.navbar-dark .navbar-nav .nav-link {
    color: var(--primary) !important;
}
.navbar.navbar-dark .navbar-nav .nav-link.active,
.navbar.navbar-dark .navbar-nav .nav-link:hover,
.navbar.navbar-dark .navbar-nav .nav-link:focus {
    color: var(--secondary) !important;
}
/* Optional: dropdown items */
.navbar .dropdown-menu .dropdown-item { color: var(--primary); }
.navbar .dropdown-menu .dropdown-item:hover,
.navbar .dropdown-menu .dropdown-item:focus,
.navbar .dropdown-menu .dropdown-item.active {
    color: #fff;
    background-color: var(--secondary);
}


.key-takeaways {
    font-size: 0.95rem;      /* smaller font */
    text-align: right;       /* right-align text */
    margin-top: 2rem;        /* more space below the image */
}
.key-takeaways h3 {
    font-size: 1.15rem;      /* slightly smaller heading */
    margin-bottom: 0.75rem;
}
.key-takeaways ul {
    margin-bottom: 0;
}