
:root{
  --bg:#0f1724;
  --card:#0b1220;
  --accent:#f97373;
  --muted:#94a3b8;
  --glass: rgba(255,255,255,0.03);
}
*{box-sizing:border-box;font-family:Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial;}
body{margin:0;background:linear-gradient(180deg,#071122 0%, #081426 100%);color:#e6eef8;line-height:1.45;}
.container{max-width:1000px;margin:0 auto;padding:24px;}
.site-header{padding:28px 0;text-align:center;border-bottom:1px solid rgba(255,255,255,0.04);}
.site-header h1{margin:0;font-size:28px;letter-spacing:0.4px;}
.tag{margin-top:6px;color:var(--muted);}
.nav{margin-top:10px;}
.nav a{color:var(--muted);margin:0 8px;text-decoration:none;font-size:14px;}
.hero{padding:36px 12px;text-align:center;}
.hero h2{font-size:24px;margin:0 0 12px;}
.cta{display:inline-block;padding:10px 18px;border-radius:8px;background:var(--accent);color:#032033;text-decoration:none;font-weight:700;}
.card-grid{margin:28px 0;}
.cards{display:flex;gap:12px;flex-wrap:wrap;}
.card{background:var(--glass);padding:16px;border-radius:10px;flex:1;min-width:220px;border:1px solid rgba(125,211,252,0.06);}
.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:12px;}
.thumb{background:linear-gradient(180deg,#082033,#063045);height:120px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--muted);border:1px solid rgba(255,255,255,0.03);}
.contact-card{background:var(--card);padding:18px;border-radius:10px;margin:16px 0;border:1px solid rgba(255,255,255,0.03);}
form label{display:block;margin-bottom:10px;color:var(--muted);font-size:14px;}
input,textarea{width:100%;padding:8px;border-radius:6px;border:1px solid rgba(255,255,255,0.04);background:transparent;color:inherit;}
button{padding:10px 16px;border-radius:8px;border:none;background:var(--accent);color:#032033;font-weight:700;cursor:pointer;}
.footer{padding:18px 0;color:var(--muted);text-align:center;}
.muted{color:var(--muted);margin-top:8px;}
.legal-note{font-size:13px;color:var(--muted);margin-top:12px;}
@media (max-width:600px){
  .cards{flex-direction:column;}
  .site-header h1{font-size:20px;}
}
