*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    scroll-behavior:smooth;
    font-family:Arial,Helvetica,sans-serif;
}

body{
    background:#eef2f6;
    color:#1b1b1b;
    line-height:1.6;
}

header{
    position:sticky;
    top:0;
    z-index:1000;
    background:#12263A;
    color:white;
    padding:15px 8%;
    box-shadow:0 5px 20px rgba(0,0,0,.2);
}

nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

nav ul{
    display:flex;
    list-style:none;
    gap:20px;
}

nav a{
    color:white;
    text-decoration:none;
    font-weight:bold;
    transition:.3s;
}

nav a:hover{
    color:#67c1ff;
}


section{
    padding:40px 8%;
    min-height:auto;
}


section h2{
    font-size:2rem;
    color:#12263A;
    margin-bottom:20px;
}


.container{
    max-width:1200px;
    margin:auto;
}


/* HERO */
#hero{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:100px;
    padding:60px 8%;
}

h1 {
  font-family: "Carter One", system-ui;
  font-weight: 400;
  font-style: normal;
}


.hero-image img{
    width:260px;
    height:260px;
    object-fit:cover;
    border-radius:50%;
    border:8px solid #12263A;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
}


.hero-text{
    max-width:650px;
}


.hero-text h1{
    font-size:3rem;
}


.hero-text h2{
    color:#345;
}


.hero-text a,
#contact a{
    display:inline-block;
    margin-top:15px;
    margin-right:10px;
    padding:10px 20px;
    background:#12263A;
    color:white;
    border-radius:25px;
    text-decoration:none;
}



/* BUBBLE SECTIONS */


section article,
section>p,
section ul,
.achievement-card{

    background:white;
    padding:25px;
    margin:15px 0;

    border-radius:30px;

    box-shadow:
    0 10px 25px rgba(0,0,0,.08);

    transition:.4s;

}


section article:hover,
.achievement-card:hover{

    transform:translateY(-8px);

    box-shadow:
    0 15px 35px rgba(0,0,0,.15);

}



/* ACHIEVEMENTS CAROUSEL */


.achievement-carousel{

    position:relative;
    overflow:hidden;
    max-width:600px;
    margin:auto;

}


.achievement-track{

    display:flex;
    transition:.5s;

}


.achievement-card{

    min-width:100%;
    text-align:center;

}


.carousel-buttons{

    text-align:center;
    margin-top:15px;

}


.carousel-buttons button{

    background:#12263A;
    color:white;

    border:none;
    padding:10px 15px;

    margin:5px;

    border-radius:50%;

    cursor:pointer;

}



/* SCROLL ANIMATION */


.hidden{

    opacity:0;
    transform:translateY(60px);

}


.show{

    opacity:1;
    transform:translateY(0);

}


section{

    transition:1s ease;

}



/* FOOTER */


footer{

    background:#12263A;
    color:white;
    text-align:center;
    padding:20px;

}



/* MOBILE */


@media(max-width:800px){

nav{
    flex-direction:column;
}

nav ul{
    flex-wrap:wrap;
    justify-content:center;
}


#hero{

    flex-direction:column;
    text-align:center;

}

.hero-text h1{

font-size:2rem;

}

}

.achievement-toggle {
    width: 100%;
    background: none;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: inherit;
    color: inherit;
}

.achievement-toggle span {
    font-size: 1.3rem;
    transition: transform 0.3s ease;
}


.achievement-info {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s ease;
}


.achievement-card.active {
    transform: scale(1.03);
}


.achievement-card {
    transition: transform 0.3s ease;
}