body{
margin:0;
font-family:Arial, Helvetica, sans-serif;
background:black;
color:white;
text-align:center;
}

.container{
max-width:520px;
margin:auto;
padding:20px;
}

/* LOGO */

.logo{
width:340px;
max-width:90%;
margin:10px auto 10px auto;
display:block;
}

/* HERO */

.hero-title{
font-size:17px;
font-weight:700;
margin-top:6px;
color:#ddd;
letter-spacing:0.3px;
}

.hero-sub{
color:#aaa;
margin-bottom:25px;
}

/* PERSON */

.profile{
width:90px;
height:90px;
border-radius:50%;
margin-top:10px;
border:2px solid #ff7a2f;
}

.position{
color:#bbb;
margin-bottom:25px;
}

/* TITLES */

.section-title{
color:#ff7a2f;
font-size:22px;
margin-bottom:20px;
}

/* ACCORDION */

details{
margin-bottom:14px;
}

summary{
cursor:pointer;
font-weight:bold;
font-size:18px;
display:inline-flex;
align-items:center;
gap:6px;
justify-content:center;
}

summary::before{
content:"✔ ";
color:#ff7a2f;
}

summary::after{
content:"▼";
font-size:12px;
color:#aaa;
}

details p{
color:rgba(255,255,255,0.75);
margin-top:10px;
text-align:center;
font-size:15px;
line-height:1.5;
max-width:420px;
margin-left:auto;
margin-right:auto;
}

.services-box{
border:2px solid #ff7a2f;
border-radius:16px;
padding:20px;
margin-top:25px;
margin-bottom:25px;
background:rgba(255,255,255,0.02);
}

/* CONTACT CARD */

.contact-card{
background:rgba(255,255,255,0.08);
backdrop-filter:blur(10px);
border:1px solid rgba(255,255,255,0.1);
border-radius:12px;
padding:20px;
margin-top:25px;
}

.contact-card a{
display:block;
color:white;
text-decoration:none;
margin:8px 0;
}

/* CTA */

.cta{
margin-bottom:15px;
font-weight:bold;
color:white;
}

/* BUTTON */

.call-button,
.vcard-button{
display:block;
width:90%;
max-width:360px;
margin:15px auto 0 auto;
padding:14px;
border-radius:30px;
text-decoration:none;
font-weight:bold;
text-align:center;
font-size:16px;
}

.call-button{
background:#ff7a2f;
color:white;
}

.vcard-button{
background:white;
color:black;
}

.contact-card i,
.call-button i,
.vcard-button i{
margin-right:8px;
}

.site-footer{
margin-top:40px;
font-size:11px;
color:rgba(255,255,255,0.5);
text-align:center;
padding-bottom:15px;
}

.dev-credit{
font-size:10px;
color:rgba(255,255,255,0.35);
}

.dev-credit a{
color:rgba(255,255,255,0.45);
text-decoration:none;
}

.dev-credit a:hover{
color:#ff7a2f;
}

.heart{
color:#ff7a2f;
}