:root{

    --navy:#0B2341;
    --gold:#C7A15A;
    --light:#F4F6F8;
    --text:#1F2937;
    --muted:#6B7280;

}

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

body{

    background:var(--light);

    font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    sans-serif;

    color:var(--text);

    min-height:100vh;

}

.container{

    max-width:620px;

    margin:0 auto;

    padding:0 20px 50px;

}

.hero{

    padding-top:50px;

    padding-bottom:20px;

    text-align:center;

}

.profile-photo{

    width:140px;

    height:140px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid var(--navy);

    box-shadow:
    0 10px 25px rgba(11,35,65,.15);

}

.name{

    margin-top:22px;

    color:var(--navy);

    font-size:2.2rem;

    font-weight:700;

    line-height:1.1;

}

.gold-divider{

    width:60px;

    height:1px;

    background:#D1D5DB;

    margin:18px auto;

}

.subtitle{

    color:var(--muted);

    max-width:360px;

    margin:0 auto;

    line-height:1.6;

    font-size:1rem;

}

.section-title{

    color:var(--navy);

    font-size:12px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    margin-top:38px;

    margin-bottom:16px;

    padding-left:14px;

    border-left:4px solid var(--gold);

}

.link-card{

    display:block;

    background:#FFFFFF;

    color:#0B2341;

    text-decoration:none;

    padding:18px 24px;

    border-radius:14px;

    border:1px solid #E5E7EB;

    margin-bottom:12px;

    font-weight:500;

    transition:all .25s ease;

}

.link-card:hover{

    color:#0B2341;

    text-decoration:none;

    border-color:#D1D5DB;

    transform:translateY(-1px);

    box-shadow:
    0 8px 20px rgba(0,0,0,.04);

}

.link-card:active{

    transform:translateY(-1px);

}

.footer{

    margin-top:40px;

    text-align:center;

    color:var(--muted);

    font-size:.85rem;

}

.footer hr{

    border:none;

    height:1px;

    background:#E5E7EB;

    margin-bottom:20px;

}

@media(max-width:576px){

    .container{

        padding-left:16px;
        padding-right:16px;

    }

    .profile-photo{

        width:130px;
        height:130px;

    }

    .name{

        font-size:1.9rem;

    }

    .link-card{

        padding:17px 18px;

    }

}