/* =========================================
   OPPORTUNITIES NAV DROPDOWN
   Shared across the Amani Foundation site
========================================= */
.nav-links .has-dropdown,
.nav-dropdown{
    position:relative;
}

.nav-links .has-dropdown > a,
.nav-dropdown .dropdown-trigger{
    display:flex;
    align-items:center;
    gap:7px;
}

.nav-links .has-dropdown > a i,
.nav-dropdown .dropdown-trigger i{
    font-size:10px;
    transition:transform .3s ease;
}

.nav-links .has-dropdown:hover > a i,
.nav-dropdown:hover .dropdown-trigger i{
    transform:rotate(180deg);
}

.nav-links .has-dropdown{position:relative;}

.nav-links .has-dropdown::before{content:"";position:absolute;left:-12px;right:-12px;top:100%;height:22px;}

.nav-links .dropdown-menu,
.nav-dropdown .dropdown-menu{
    position:absolute;
    top:calc(100% + 16px);
    left:50%;
    transform:translate(-50%, 10px);
    width:245px;
    padding:10px;
    margin:0;
    list-style:none;
    background:rgba(255,255,255,.98);
    border:1px solid rgba(70,64,125,.08);
    border-radius:16px;
    box-shadow:0 20px 50px rgba(28,28,46,.16);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
    z-index:1200;
}

.nav-links .has-dropdown:hover .dropdown-menu,
.nav-links .has-dropdown:focus-within .dropdown-menu,
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown:focus-within .dropdown-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate(-50%, 0);
}

.nav-links .dropdown-menu li,
.nav-dropdown .dropdown-menu a{
    margin:0;
}

.nav-links .dropdown-menu a,
.nav-dropdown .dropdown-menu a{
    display:flex;
    align-items:center;
    gap:13px;
    width:100%;
    padding:12px 13px;
    color:#29283b !important;
    text-decoration:none;
    font-size:14px;
    font-weight:600;
    border-radius:11px;
    transition:background .25s ease, color .25s ease, transform .25s ease;
}

.nav-links .dropdown-menu a::after,
.nav-dropdown .dropdown-menu a::after{
    display:none !important;
}

.nav-links .dropdown-menu a i,
.nav-dropdown .dropdown-menu a i{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    flex:0 0 30px;
    color:#46407D;
    background:rgba(70,64,125,.08);
    border-radius:9px;
    font-size:13px;
    transition:.25s ease;
}

.nav-links .dropdown-menu a:hover,
.nav-dropdown .dropdown-menu a:hover{
    background:linear-gradient(135deg,rgba(70,64,125,.08),rgba(34,199,213,.10));
    color:#46407D !important;
    transform:translateX(3px);
}

.nav-links .dropdown-menu a:hover i,
.nav-dropdown .dropdown-menu a:hover i{
    color:#fff;
    background:linear-gradient(135deg,#46407D,#22C7D5);
}

.navbar.scrolled .nav-links .dropdown-menu{
    top:calc(100% + 12px);
}

/* =========================================
   OPPORTUNITIES PAGES
========================================= */
.opportunity-page{
    --op-primary:#46407D;
    --op-secondary:#22C7D5;
    --op-accent:#63E67D;
    color:#272638;
    background:#fff;
}

.opportunity-hero{
    position:relative;
    min-height:480px;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:150px 8% 90px;
    background:
        radial-gradient(circle at 82% 22%,rgba(34,199,213,.24),transparent 30%),
        radial-gradient(circle at 15% 80%,rgba(99,230,125,.18),transparent 28%),
        linear-gradient(135deg,#2d285e 0%,#46407D 58%,#273b67 100%);
}

.opportunity-hero::after{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    right:-130px;
    bottom:-180px;
}

.opportunity-hero-content{
    position:relative;
    z-index:2;
    max-width:850px;
}

.opportunity-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    margin-bottom:20px;
    color:#fff;
    background:rgba(255,255,255,.11);
    border:1px solid rgba(255,255,255,.16);
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.opportunity-hero h1{
    margin:0 0 18px;
    color:#fff;
    font-size:clamp(2.5rem,5vw,4.6rem);
    line-height:1.08;
}

.opportunity-hero h1 span{color:#63E67D;}

.opportunity-hero p{
    max-width:720px;
    margin:0;
    color:rgba(255,255,255,.82);
    font-size:1.08rem;
}

.opportunity-content{
    max-width:1180px;
    margin:0 auto;
    padding:90px 7%;
}

.opportunity-intro{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:55px;
    align-items:center;
    margin-bottom:75px;
}

.opportunity-kicker{
    margin-bottom:10px;
    color:#22C7D5;
    font-size:13px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.opportunity-intro h2{
    margin-bottom:16px;
    color:#272638;
    font-size:clamp(2rem,3.4vw,3rem);
    line-height:1.15;
}

.opportunity-intro h2 span{color:#46407D;}

.opportunity-intro p{color:#68677a;}

.opportunity-highlight{
    padding:30px;
    border-radius:24px;
    background:linear-gradient(145deg,#f6f5ff,#f2fbfc);
    border:1px solid rgba(70,64,125,.08);
    box-shadow:0 18px 45px rgba(28,28,46,.07);
}

.opportunity-highlight .highlight-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin-bottom:20px;
    color:#fff;
    background:linear-gradient(135deg,#46407D,#22C7D5);
    border-radius:17px;
    font-size:22px;
}

.opportunity-highlight h3{margin-bottom:8px;}
.opportunity-highlight p{margin:0;color:#6d6b7c;font-size:.95rem;}

.opportunity-section-title{
    text-align:center;
    max-width:720px;
    margin:0 auto 40px;
}

.opportunity-section-title h2{font-size:2.2rem;margin-bottom:10px;}
.opportunity-section-title p{color:#747285;}

.opportunity-cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
    margin-bottom:75px;
}

.opportunity-card{
    padding:28px;
    background:#fff;
    border:1px solid #ecebf3;
    border-radius:20px;
    box-shadow:0 12px 35px rgba(28,28,46,.05);
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.opportunity-card:hover{
    transform:translateY(-7px);
    border-color:rgba(34,199,213,.25);
    box-shadow:0 22px 45px rgba(28,28,46,.10);
}

.opportunity-card i{
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    margin-bottom:18px;
    color:#46407D;
    background:rgba(70,64,125,.08);
    border-radius:13px;
}

.opportunity-card h3{font-size:1.15rem;margin-bottom:8px;}
.opportunity-card p{color:#747285;font-size:.93rem;margin:0;}

.opportunity-steps{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    margin-bottom:75px;
}

.opportunity-step{
    position:relative;
    padding:28px;
    background:#fafafd;
    border-radius:20px;
}

.opportunity-step span{
    display:inline-flex;
    width:34px;height:34px;
    align-items:center;justify-content:center;
    margin-bottom:15px;
    color:#fff;
    background:#46407D;
    border-radius:50%;
    font-size:13px;font-weight:800;
}

.opportunity-step h3{font-size:1.08rem;margin-bottom:7px;}
.opportunity-step p{margin:0;color:#747285;font-size:.9rem;}

.opportunity-cta{
    position:relative;
    overflow:hidden;
    padding:48px;
    text-align:center;
    color:#fff;
    background:linear-gradient(135deg,#46407D,#273b67);
    border-radius:28px;
}

.opportunity-cta::before{
    content:"";
    position:absolute;
    width:240px;height:240px;
    border-radius:50%;
    background:rgba(34,199,213,.18);
    right:-80px;top:-100px;
}

.opportunity-cta h2,.opportunity-cta p,.opportunity-cta a{position:relative;z-index:1;}
.opportunity-cta h2{margin-bottom:10px;color:#fff;}
.opportunity-cta p{max-width:650px;margin:0 auto 22px;color:rgba(255,255,255,.76);}

.opportunity-cta a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:13px 23px;
    color:#fff;
    background:linear-gradient(135deg,#63E67D,#22C7D5);
    border-radius:999px;
    text-decoration:none;
    font-weight:700;
}

@media(max-width:992px){
    .opportunity-intro,.opportunity-cards,.opportunity-steps{grid-template-columns:1fr 1fr;}
    .opportunity-intro{align-items:start;}
}

@media(max-width:768px){
    .nav-links .has-dropdown::before{display:none;}
    .nav-links .dropdown-menu,.nav-dropdown .dropdown-menu{display:none;}
    .opportunity-hero{min-height:430px;padding:135px 7% 75px;}
    .opportunity-content{padding:65px 7%;}
    .opportunity-intro,.opportunity-cards,.opportunity-steps{grid-template-columns:1fr;}
    .opportunity-intro{gap:28px;margin-bottom:55px;}
    .opportunity-cta{padding:35px 24px;}
}

.nav-dropdown.active-dropdown .dropdown-trigger{color:#63E67D !important;}