/* Simple responsive styling */
:root{
  --accent:#d43b3b;
  --bg:#0f1724;
  --card:#0b1220;
  --glass: rgba(255,255,255,0.03);
  color-scheme: dark;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: linear-gradient(180deg,#071226 0%, #0f1724 100%);
  color:#e6eef8;
  -webkit-font-smoothing:antialiased;
}
.header, .container{max-width:1100px; margin:0 auto; padding:20px}
.hero{
  padding:60px 20px;
  text-align:center;
  background: linear-gradient(90deg, rgba(212,59,59,0.12), rgba(25,118,210,0.06));
}
.hero-inner{display:inline-block; max-width:860px}
.portrait{
  width:140px; height:140px; border-radius:999px; display:block; margin:0 auto 18px; background:linear-gradient(135deg,#fff, #ddd); padding:6px;
}
h1{font-size:clamp(28px,4vw,42px); margin:0 0 6px}
.tagline{opacity:0.85; margin-bottom:10px}
.cta{display:inline-block; background:var(--accent); color:white; padding:10px 18px; border-radius:8px; text-decoration:none}
.container{padding:28px 18px}
.card{background:var(--card); border-radius:12px; padding:18px; margin-bottom:18px; box-shadow: 0 6px 18px rgba(2,6,23,0.6)}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px}
.small{font-size:13px; opacity:0.8}
.placeholder-grid{display:flex; gap:10px; flex-wrap:wrap}
.placeholder-grid img{width:32%; border-radius:8px}
form input, form textarea{width:100%; padding:10px; margin:8px 0; border-radius:8px; border:none; background:var(--glass); color:inherit}
form button{background:var(--accent); border:none; color:white; padding:10px 16px; border-radius:8px}
.foot{padding:20px; text-align:center; opacity:0.8; font-size:14px}
@media(max-width:560px){
  .placeholder-grid img{width:100%}
}