:root{
	--bg:#0b0f17;
	--page-bg:#0b0f17;
	--card:#0f1720;
	--muted:#98a0a6;
	--accent:#ff7a5a; /* warm coral accent */
	--accent-2:#ff6b4a; /* accent contrast */
	--radius:12px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
	margin:0;
	font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
	background:var(--page-bg);
	color:#e6eef6;
	line-height:1.6;
}

.container{max-width:1100px;margin:0 auto;padding:2rem}

.site-header{background:transparent;padding:1.25rem 0}
.header-inner{display:flex;justify-content:space-between;align-items:center}
.brand{font-weight:700;color:var(--accent);text-decoration:none;font-size:1.05rem;letter-spacing:0.2px}
.site-header nav a{margin-left:1rem;color:var(--muted);text-decoration:none}

.hero{padding:6.5rem 0;background:linear-gradient(180deg, rgba(255,122,90,0.04), transparent 30%);position:relative;overflow:visible}
.hero-inner{display:flex;gap:2rem;align-items:center;justify-content:center}
.hero-copy{flex:0 1 720px;text-align:center;position:relative;z-index:2}
.hero-decor{position:absolute;right:6%;top:10%;width:420px;height:420px;border-radius:48% 52% 60% 40%/40% 60% 40% 60%;background:radial-gradient(circle at 30% 30%, rgba(249,115,99,0.14), rgba(160,62,43,0.06) 50%, transparent 60%);filter:blur(30px);transform:rotate(-12deg);z-index:1}
/* remove avatar styles (no longer used) */
.avatar{display:none}

.tagline{color:var(--muted);margin:0 0 1rem;font-size:1.05rem}
h1{font-size:2.25rem;margin:0 0 .5rem}
.cta-row{display:flex;gap:.75rem;align-items:center;justify-content:center}
.btn{display:inline-block;padding:.7rem 1rem;background:var(--accent);color:#0b0f17;border-radius:12px;text-decoration:none;font-weight:700;box-shadow:0 12px 30px rgba(255,122,90,0.12)}
.btn.ghost{background:transparent;color:var(--muted);border:1px solid rgba(255,122,90,0.08)}
.resume{color:var(--muted);margin-left:.5rem;text-decoration:underline;font-weight:600}

.about{padding:2.5rem 0;background:transparent}
/* About cards */
.about-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.about-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1.25rem;border-radius:12px;box-shadow:0 10px 30px rgba(2,6,23,0.6);text-align:center}
.about-card h3{margin:0.5rem 0;color:#fff}
.about-card p{color:var(--muted);margin:0}
.card-icon{font-size:28px;margin-bottom:0.5rem;display:block}
.about-card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(2,6,23,0.75)}

.projects{padding:3rem 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1rem;border-radius:var(--radius);box-shadow:0 12px 30px rgba(2,6,23,0.6);transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(2,6,23,0.7)}
.card img{width:100%;height:160px;object-fit:cover;border-radius:8px}
.card h3{margin:.65rem 0}
.excerpt{color:var(--muted);font-size:.96rem}
.card-links a{color:var(--accent);text-decoration:none}

.skills{padding:2.25rem 0}
.skills-list{display:flex;flex-wrap:wrap;gap:.75rem;list-style:none;padding:0;margin:0}
.skills-list li{background:linear-gradient(90deg, rgba(255,122,90,0.08), rgba(255,122,90,0.02));padding:.5rem .8rem;border-radius:999px;color:var(--accent);font-weight:700}
.experience{padding:2.25rem 0}
.contact{padding:2.25rem 0}
.contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.contact-list li{margin:0;color:var(--muted);text-align:center}
.contact-list a{color:var(--accent);text-decoration:none}

.contact h2{text-align:center;margin-bottom:0.75rem}

/* Experience cards */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.exp-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1.25rem;border-radius:12px;box-shadow:0 10px 30px rgba(2,6,23,0.6)}
.exp-card h3{margin:0 0 .25rem}
.exp-card .meta{color:var(--muted);font-size:.95rem;margin-bottom:.25rem}
.exp-card .date{color:var(--muted);font-size:.85rem;margin-bottom:.5rem}
.exp-card ul{margin:.5rem 0 0 1.1rem;color:var(--muted)}

/* Education cards */
.edu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.edu-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1.25rem;border-radius:12px;box-shadow:0 10px 30px rgba(2,6,23,0.6);text-align:left}
.edu-card h3{margin:0 0 .25rem}
.edu-card .meta{color:var(--muted);font-size:.95rem;margin-bottom:.25rem}
.edu-card .date{color:var(--muted);font-size:.85rem}

.site-footer{padding:2.5rem 0;color:var(--muted);font-size:.95rem;border-top:1px solid rgba(255,122,90,0.04)}


@media (max-width:900px){
	.hero-inner{flex-direction:column;text-align:center}
 	.hero-decor{right:-10%;top:6%;width:360px;height:360px;filter:blur(36px)}
	.grid{grid-template-columns:repeat(2,1fr)}
	.about-cards{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:560px){
	.grid{grid-template-columns:1fr}
	.exp-grid,.edu-grid{grid-template-columns:1fr}
	.container{padding:1rem}
	h1{font-size:1.4rem}
	.avatar{width:140px;height:140px}
	.about-cards{grid-template-columns:1fr}
}