:root{
    --navy:#102C63;
    --blue:#1769AA;
    --or:#F59E0B;
    --bg:#F5F8FC;
    --tx:#17243A;
    --bd:#d5e0ee;
    --mut:#4a5b75;
    --lb:#E3EEFA;
    --lo:#FEF3D8;
    box-sizing:border-box;
    padding-top:env(safe-area-inset-top,0px)
}
 @media(prefers-color-scheme:dark){
    :root:not([data-theme="light"]){
        --bg:#F5F8FC
    }
}
 :root[data-theme="dark"]{
    --bg:#F5F8FC
}
 *,*::before,*::after{
    box-sizing:inherit
}
html{
    scroll-behavior:smooth;
    scroll-padding-top:90px
}
 body{
    margin:0;
    font:400 16px/1.65 Poppins,system-ui,sans-serif;
    color:var(--tx);
    background:#fff
}
 h1,h2,h3{
    color:var(--navy);
    line-height:1.2;
    margin:0 0 .5em;
    font-weight:800
}
h1{
    font-size:clamp(2rem,5vw,3.6rem)
}
h2{
    font-size:clamp(1.5rem,3vw,2.2rem)
}
h3{
    font-size:1.1rem
}
 p{
    margin:0 0 1em;
    max-width:62ch
}
a{
    color:inherit
}
.w{
    max-width:1200px;
    margin:auto;
    padding:0 10px
}
 :focus-visible{
    outline:3px solid var(--or);
    outline-offset:2px
}
.ic svg{
    width:28px;
    height:28px;
    stroke:currentColor;
    fill:none;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round
}
 .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:0 24px;
    border-radius:999px;
    background:var(--or);
    color:var(--navy);
    font:700 .95rem Poppins,sans-serif;
    text-decoration:none;
    border:2px solid var(--or);
    cursor:pointer;
    transition:transform .15s
}
.btn:hover{
    transform:translateY(-2px)
}
 .btn.o{
    background:transparent;
    border-color:var(--navy);
    color:var(--navy)
}
.btn.wh{
    background:transparent;
    border-color:#fff;
    color:#fff
}
.btn.s{
    min-height:40px;
    padding:0 16px;
    font-size:.85rem
}
 .top{
    background:var(--navy);
    color:#dbe6f7;
    font-size:.82rem
}
.top .w{
    display:flex;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    padding-top:6px;
    padding-bottom:6px
}
.top a{
    text-decoration:none;
    font-weight:600
}
 header{
    position:sticky;
    top:0;
    z-index:50;
    background:#fff;
    box-shadow:0 2px 12px rgba(16,44,99,.08)
}
.nav{
    display:flex;
    align-items:center;
    gap:18px;
    min-height:76px
}
.nav img{
    height:80px;
    width:auto;
    display:block
}
 .menu{
    display:flex;
    gap:6px;
    margin-left:auto;
    align-items:center
}
.menu a{
    text-decoration:none;
    font-weight:600;
    color:var(--navy);
    padding:8px 11px;
    border-radius:999px;
    font-size:.92rem
}
.menu a:hover{
    background:var(--lb)
}
.menu a[aria-current=page]{
    background:var(--navy);
    color:#fff
}
.menu .btn{
    color:var(--navy);
    background:var(--or)
}
 .dd{
    position:relative
}
.sub{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#fff;
    border-radius:14px;
    padding:8px;
    min-width:230px;
    box-shadow:0 12px 30px rgba(16,44,99,.18)
}
.sub a{
    display:block
}
.dd:hover .sub,.dd:focus-within .sub{
    display:block
}
 #tg{
    display:none;
    margin-left:auto;
    background:var(--navy);
    color:#fff;
    border:0;
    border-radius:10px;
    font-size:1.3rem;
    padding:6px 14px;
    cursor:pointer
}
 .hero{
    background:var(--navy);
    color:#fff;
    position:relative;
    overflow:hidden
}
.hero::after{
    content:"";
    position:absolute;
    left:-90px;
    bottom:-110px;
    width:320px;
    height:320px;
    border-radius:50%;
    background:var(--or);
    opacity:.9
}
 .hero .w{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:30px;
    align-items:center;
    padding-top:56px;
    padding-bottom:64px;
    position:relative;
    z-index:1
}
.hero h1{
    color:#fff
}
.hero .sub2{
    font-size:1.15rem;
    font-weight:600;
    color:#ffd58a;
    max-width:46ch
}
.hero p{
    color:#dbe6f7
}
.hero .hi{
    color:#fff;
    font-weight:600;
    border-left:4px solid var(--or);
    padding-left:12px
}
 .art{
    width:100%;
    height:auto;
    max-width:480px;
    justify-self:center
}
.cta{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:8px
}
 .goals{
    margin-top:34px;
    position:relative;
    z-index:2
}
.gg{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:14px
}
 .g{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:20px 18px;
    border-radius:20px;
    text-decoration:none;
    font-weight:800;
    color:#fff;
    min-height:170px;
    box-shadow:0 10px 26px rgba(16,44,99,.18);
    transition:transform .15s
}
.g:hover{
    transform:translateY(-4px)
}
.g small{
    font-weight:600;
    opacity:.9;
    margin-top:auto
}
.g .ic{
    width:48px;
    height:48px;
    border-radius:14px;
    background:rgba(255,255,255,.2);
    display:grid;
    place-items:center
}
 .t0{
    background:var(--navy)
}
.t1{
    background:var(--blue)
}
.t2{
    background:var(--or);
    color:var(--navy)
}
.t3{
    background:#0b4a8a
}
.t4{
    background:#c97b00
}
.t2 .ic{
    background:rgba(16,44,99,.15)
}
 section.s{
    padding:64px 0
}
.s h2::after{
    content:"";
    display:block;
    width:56px;
    height:5px;
    background:var(--or);
    border-radius:3px;
    margin-top:10px
}
.lb{
    background:var(--lb)
}
 .chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px
}
.chips a{
    text-decoration:none;
    background:#fff;
    border:2px solid var(--navy);
    color:var(--navy);
    font-weight:700;
    padding:8px 18px;
    border-radius:999px
}
.chips a:hover{
    background:var(--navy);
    color:#fff
}
 .cards{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
    gap:18px
}
.cc{
    background:#fff;
    border-radius:20px;
    padding:24px;
    box-shadow:0 6px 20px rgba(16,44,99,.1);
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:2px
}
.cc .ic{
    width:54px;
    height:54px;
    border-radius:16px;
    background:var(--or);
    color:var(--navy);
    display:grid;
    place-items:center;
    margin-bottom:10px
}
.cc p{
    margin:0 0 8px
}
 .cc:nth-child(3n+2) .ic{
    background:var(--navy);
    color:#fff
}
.cc:nth-child(3n) .ic{
    background:var(--blue);
    color:#fff
}
 .sup{
    background:var(--or);
    color:var(--navy)
}
.sup h2,.sup p{
    color:var(--navy)
}
.sup h2::after{
    background:var(--navy)
}
.sup .btn{
    background:var(--navy);
    border-color:var(--navy);
    color:#fff
}
.sup .btn.o{
    background:transparent;
    color:var(--navy)
}
 .st{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:26px
}
.st div{
    position:relative
}
.st b{
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:50%;
    background:var(--navy);
    color:#fff;
    font-size:1.2rem;
    margin-bottom:10px
}
.st div:not(:last-child)::after{
    content:"";
    position:absolute;
    top:26px;
    left:66px;
    right:-14px;
    border-top:3px dashed var(--or)
}
 .big{
    background:var(--navy);
    color:#fff;
    text-align:center;
    padding:56px 0
}
.big h2{
    color:#fff
}
.big .ph{
    display:block;
    font-size:clamp(2rem,6vw,3.6rem);
    font-weight:800;
    color:var(--or);
    text-decoration:none;
    margin:6px 0 18px
}
.big .cta{
    justify-content:center
}
 .pb{
    background:var(--navy);
    color:#fff;
    padding:44px 0
}
.pb h1{
    color:#fff;
    margin:6px 0 10px
}
.pb p{
    color:#dbe6f7;
    margin:0
}
.pb .cr{
    font-size:.88rem
}
.pb .cr a{
    color:#ffd58a
}
.pb .lead{
    font-size:1.15rem;
    font-weight:600;
    color:#ffd58a
}
 .tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:8px 0 12px;
    padding:0;
    list-style:none
}
.tags li{
    background:var(--lb);
    border-radius:999px;
    padding:4px 14px;
    font-size:.88rem;
    font-weight:600;
    color:var(--navy)
}
 .note{
    border-left:5px solid var(--or);
    padding:12px 16px;
    background:var(--lo);
    border-radius:0 12px 12px 0;
    font-size:.92rem;
    margin-top:14px;
    max-width:none
}
 .rows{
    border-radius:16px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 6px 20px rgba(16,44,99,.1);
    margin-top:14px
}
.rows div{
    display:flex;
    gap:12px;
    align-items:center;
    padding:12px 18px;
    border-top:1px solid var(--bd);
    flex-wrap:wrap
}
.rows div:first-child{
    border-top:0
}
.rows b{
    flex:1 1 180px;
    color:var(--navy)
}
.rows span{
    flex:1 1 120px;
    color:var(--mut);
    font-size:.92rem
}
 .two{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:36px
}
input,select,textarea{
    width:100%;
    font:inherit;
    font-size:16px;
    padding:12px;
    border:1.5px solid #9fb0c8;
    border-radius:10px;
    background:#fff;
    color:var(--tx)
}
 form{
    background:#fff;
    border-radius:20px;
    padding:24px;
    display:grid;
    gap:14px;
    box-shadow:0 6px 24px rgba(16,44,99,.14)
}
label{
    font-weight:700;
    font-size:.9rem;
    color:var(--navy);
    display:block;
    margin-bottom:4px
}
.err{
    color:#b42318;
    font-size:.85rem;
    min-height:1.1em
}
.fs{
    font-size:.85rem;
    color:var(--mut);
    margin:0
}
#res{
    font-weight:600;
    color:var(--navy)
}
 footer{
    background:var(--navy);
    color:#cfdcf2;
    padding:40px 0;
    font-size:.9rem
}
footer .w{
    display:grid;
    gap:8px
}
footer a{
    text-decoration:none;
    font-weight:600
}
footer a:hover{
    color:var(--or)
}
 .mb{
    display:none
}
[hidden]{
    display:none!important
}
 @media(max-width:1000px){
    #tg{
        display:block
    }
    .menu{
        display:none;
        position:absolute;
        left:0;
        right:0;
        top:100%;
        background:#fff;
        flex-direction:column;
        align-items:stretch;
        padding:12px 20px 20px;
        box-shadow:0 12px 24px rgba(16,44,99,.15);
        max-height:calc(100vh - 90px);
        overflow:auto
    }
    .menu.open{
        display:flex
    }
    .sub{
        display:block;
        position:static;
        box-shadow:none;
        padding:0 0 0 14px
    }
    .menu .btn{
        margin-top:6px
    }
    .gg{
        grid-template-columns:repeat(3,1fr)
    }
}
 @media(max-width:860px){
    .hero .w{
        grid-template-columns:1fr;
        padding-top:36px
    }
    .art{
        max-width:340px
    }
    .two{
        grid-template-columns:1fr
    }
    .st{
        grid-template-columns:1fr
    }
    .st div:not(:last-child)::after{
        display:none
    }
    section.s{
        padding:48px 0
    }
    .gg{
        grid-template-columns:repeat(2,1fr)
    }
}
 @media(max-width:700px){
    .top{
        display:none
    }
    .mb{
        display:grid;
        grid-template-columns:1fr 1fr 1.2fr;
        gap:8px;
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        z-index:60;
        background:#fff;
        box-shadow:0 -4px 16px rgba(16,44,99,.15);
        padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))
    }
    .mb a{
        display:flex;
        align-items:center;
        justify-content:center;
        min-height:46px;
        border-radius:12px;
        font-weight:700;
        text-decoration:none;
        color:#fff
    }
    .mb .c{
        background:var(--navy)
    }
    .mb .wa{
        background:#1a8f4c
    }
    .mb .e{
        background:var(--or);
        color:var(--navy)
    }
    body{
        padding-bottom:70px
    }
    .cta .btn{
        flex:1 1 100%
    }
    .nav img{
        height:46px
    }
    .g{
        min-height:140px;
        padding:16px 14px;
        font-size:.92rem
    }
}
 @media(max-width:420px){
    .gg{
        gap:10px
    }
}
 @media(prefers-reduced-motion:reduce){
    *{
        transition:none!important;
        scroll-behavior:auto!important
    }
}
 header .menu{
    margin:0 auto;
    gap:2px
}
header .menu>a,header .menu .dd>a{
    border-radius:0;
    padding:22px 6px;
    position:relative;
    background:none;
    color:var(--navy);
    display:block
}
 header .menu>a::after,header .menu .dd>a::after{
    content:"";
    position:absolute;
    left:14px;
    right:14px;
    bottom:18px;
    height:3px;
    border-radius:2px;
    background:var(--or);
    transform:scaleX(0);
    transition:transform .25s
}
 header .menu>a:hover::after,header .menu .dd:hover>a::after,header .menu a[aria-current=page]::after{
    transform:scaleX(1)
}
header .menu a[aria-current=page]{
    color:var(--blue);
    background:none
}
header .menu>a:hover{
    background:none
}
 .cv{
    display:inline-block;
    width:7px;
    height:7px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg);
    margin:0 0 3px 8px
}
 .nav{
    transition:min-height .25s
}
.nav img{
    transition:height .25s
}
header.sc .nav{
    min-height:62px
}
header.sc .nav img{
    height:44px
}
header.sc .menu>a,header.sc .menu .dd>a{
    padding-top:20px;
    padding-bottom:20px
}
header.sc .menu>a::after,header.sc .menu .dd>a::after{
    bottom:10px
}
 .hr{
    display:flex;
    align-items:center;
    gap:16px
}
.hp{
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    color:var(--navy)
}
.hp small{
    display:block;
    font-size:.72rem;
    color:var(--mut);
    line-height:1.1
}
.hp b{
    font-size:1rem;
    line-height:1.2
}
 .pi{
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--lb);
    display:grid;
    place-items:center;
    animation:ring 2.4s infinite
}
.pi svg{
    width:20px;
    height:20px;
    fill:none;
    stroke:var(--navy);
    stroke-width:2;
    stroke-linejoin:round
}
 @keyframes ring{
    0%{
        box-shadow:0 0 0 0 rgba(245,158,11,.6)
    }
    70%,100%{
        box-shadow:0 0 0 12px rgba(245,158,11,0)
    }
}
 header .menu .mo{
    display:none
}
 .sub{
    left:50%;
    transform:translateX(-50%);
    width:580px;
    grid-template-columns:1fr 1fr;
    gap:4px;
    padding:12px;
    border-top:3px solid var(--or);
    border-radius:0 0 16px 16px
}
.dd:hover .sub,.dd:focus-within .sub{
    display:grid;
    animation:up .2s ease-out
}
 .sub a{
    padding:12px 14px!important;
    border-radius:10px!important
}
.sub a::after{
    display:none!important
}
.sub a b{
    display:block;
    color:var(--navy);
    font-size:.92rem
}
.sub a small{
    display:block;
    color:var(--mut);
    font-weight:400;
    font-size:.8rem;
    line-height:1.35
}
 @keyframes up{
    from{
        opacity:0;
        transform:translateY(24px)
    }
}
 .rv{
    opacity:0
}
.rv.in{
    opacity:1;
    animation:up .6s ease-out backwards;
    animation-delay:var(--d,0s)
}
 .hero .w>div>*{
    animation:up .7s ease-out backwards
}
.hero .w>div>*:nth-child(2){
    animation-delay:.1s
}
.hero .w>div>*:nth-child(3){
    animation-delay:.2s
}
.hero .w>div>*:nth-child(4){
    animation-delay:.3s
}
.hero .w>div>*:nth-child(5){
    animation-delay:.4s
}
.art{
    animation:up .9s .2s ease-out backwards
}
 .fl{
    animation:fl 4s ease-in-out infinite;
    transform-box:fill-box
}
.fl2{
    animation:fl 5s 1s ease-in-out infinite;
    transform-box:fill-box
}
@keyframes fl{
    50%{
        transform:translateY(-12px)
    }
}
 .hero::after{
    animation:pl 6s ease-in-out infinite
}
@keyframes pl{
    50%{
        transform:scale(1.12)
    }
}
 .mq{
    background:var(--or);
    color:var(--navy);
    overflow:hidden;
    white-space:nowrap;
    padding:14px 0;
    margin-top:44px
}
.mq>div{
    display:inline-flex;
    gap:0;
    animation:mq 30s linear infinite
}
.mq span{
    font-weight:800;
    font-size:1.05rem;
    padding:0 28px
}
.mq span::before{
    content:"";
    display:inline-block;
    width:10px;
    height:10px;
    background:var(--navy);
    border-radius:50%;
    margin-right:28px
}
@keyframes mq{
    to{
        transform:translateX(-50%)
    }
}
 .ff{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:44px;
    align-items:center;
    padding:28px 0
}
.ff:nth-child(even) .fi{
    order:2
}
.fi svg{
    width:100%;
    height:auto;
    border-radius:24px;
    box-shadow:0 14px 34px rgba(16,44,99,.18);
    transition:transform .3s
}
.fi svg:hover{
    transform:scale(1.02) rotate(-.6deg)
}
 .fq{
    display:grid;
    gap:12px;
    max-width:860px
}
.fq details{
    background:#fff;
    border-radius:14px;
    box-shadow:0 4px 14px rgba(16,44,99,.08);
    padding:0 20px
}
.fq summary{
    cursor:pointer;
    font-weight:700;
    color:var(--navy);
    padding:16px 28px 16px 0;
    list-style:none;
    position:relative
}
.fq summary::-webkit-details-marker{
    display:none
}
.fq summary::after{
    content:"+";
    position:absolute;
    right:0;
    top:12px;
    font-size:1.6rem;
    color:var(--or);
    transition:transform .25s
}
.fq details[open] summary::after{
    transform:rotate(45deg)
}
.fq details p{
    animation:up .3s ease-out;
    padding-bottom:6px;
    margin:0 0 10px
}
 .pbg{
    display:grid;
    grid-template-columns:1fr 300px;
    gap:30px;
    align-items:center
}
.pbg svg{
    width:100%;
    height:auto;
    border-radius:20px
}
 @media(max-width:1000px){
    .hr{
        display:none
    }
    header .menu{
        margin:0;
        gap:0
    }
    header .menu>a,header .menu .dd>a{
        padding:12px 6px
    }
    header .menu>a::after,header .menu .dd>a::after{
        display:none
    }
    header .menu .mo{
        display:flex
    }
    header .menu a[aria-current=page]{
        background:var(--lb);
        border-radius:8px
    }
    .sub{
        display:block;
        position:static;
        transform:none;
        width:auto;
        border:0;
        box-shadow:none;
        padding:0 0 0 14px
    }
    .sub a small{
        display:none
    }
}
 @media(max-width:860px){
    .ff{
        grid-template-columns:1fr;
        gap:20px
    }
    .ff:nth-child(even) .fi{
        order:0
    }
    .pbg{
        grid-template-columns:1fr
    }
    .pbg svg{
        display:none
    }
}
 @media(prefers-reduced-motion:reduce){
    .rv{
        opacity:1
    }
    .mq>div,.fl,.fl2,.pi,.hero::after{
        animation:none!important
    }
}
 .pho{
    display:block;
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover;
    border-radius:24px;
    box-shadow:0 14px 34px rgba(16,44,99,.18)
}
.hph{
    max-width:500px;
    justify-self:center
}
.hph .pho{
    border:6px solid #fff
}
.ff .pho{
    transition:transform .3s
}
.ff .pho:hover{
    transform:scale(1.02)
}
@media(max-width:860px){
    .pbg .pho{
        display:none
    }
}
 .hero::after{
    left:auto;
    right:-90px;
    bottom:-130px;
    width:260px;
    height:260px
}
.hph{
    position:relative;
    z-index:1
}
 .ff{
    padding:14px 0
}
.cards.why{
    grid-template-columns:repeat(3,1fr)
}
.leg h2{
    font-size:1.3rem;
    margin-top:1.4em
}
.leg h2::after{
    display:none
}
.leg{
    max-width:820px
}
.leg p,.leg li{
    max-width:none
}
 @media(max-width:1000px){
    .cards.why{
        grid-template-columns:repeat(2,1fr)
    }
}
@media(max-width:600px){
    .cards.why{
        grid-template-columns:1fr
    }
}
 section.s{
    padding:44px 0
}
.sup{
    padding:44px 0
}
.big{
    padding:48px 0
}
.mq{
    margin-top:30px
}
.s h2{
    margin-bottom:.7em
}
 .ff{
    padding:10px 0;
    gap:36px
}
.fi .pho{
    aspect-ratio:16/10
}
.two.aln{
    align-items:center
}
.fq{
    max-width:none
}
 .ft2{
    padding:48px 0 0;
    margin-top:0
}
.ft2 .fg{
    grid-template-columns:1.4fr 1fr 1fr 1.3fr;
    gap:32px
}
.ft2 h3{
    color:#fff;
    font-size:1rem;
    margin-bottom:.8em
}
.ft2 ul{
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    gap:8px
}
.ft2 p{
    color:#cfdcf2;
    max-width:34ch;
    margin:0 0 .8em
}
.ft2 a{
    font-weight:400
}
.ft2 .fl{
    display:block;
    background:#fff;
    border-radius:12px;
    padding:6px;
    height:64px;
    width:auto;
    margin-bottom:14px
}
 .ft2 .fb{
    border-top:1px solid rgba(255,255,255,.18);
    margin-top:32px;
    padding:16px 0;
    font-size:.85rem
}
.ft2 .fb .w{
    display:flex;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap
}
 @media(max-width:900px){
    .ft2 .fg{
        grid-template-columns:1fr 1fr
    }
}
@media(max-width:520px){
    .ft2 .fg{
        grid-template-columns:1fr
    }
}
 @media(max-width:860px){
    section.s{
        padding:36px 0
    }
}
/* bigger logo */
 .nav{
    min-height:92px
}
header.sc .nav{
    min-height:74px
}
 .nav img{
    height:78px;
    width:auto
}
header.sc .nav img{
    height:62px
}
 .ft2 .fl{
    height:92px;
    width:auto
}
 @media(max-width:700px){
    .nav{
        min-height:72px
    }
    .nav img,header.sc .nav img{
        height:56px
    }
}
