/* Vibrant CV style (copied from simple version) */
:root{
  --bg: #ffffff;
  --paper: #fbf7f2;
  --card: #f5efe6;
  --text: #222222;
  --muted: #656565;
  --line: #ebe6df;
  --accent: #4f46e5;
  --accent-2: #06b6d4;
  --accent-3: #f97316;
  --accent-dark: #111827;
  --radius: 10px;
}
*{ box-sizing: border-box; }
html,body{ height:100%; margin:0; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; background:var(--bg); color:var(--text); }
.container{ width: min(980px, 94vw); margin: 0 auto; }
.site-header{ background: linear-gradient(90deg, rgba(79,70,229,0.06), rgba(6,182,212,0.03)); border-bottom: 1px solid var(--line); position: sticky; top:0; z-index: 20; }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; }
.brand-wrap{ display:flex; align-items:center; justify-content:space-between; gap:18px; width:100%; }
.brand{ display:flex; gap:12px; align-items:center; }
.brand .logo{ border-radius:8px; }
.brand-name{ margin:0; font-size:18px; font-weight:800; color:var(--accent-dark); }
.brand-tagline{ font-size:12px; color:var(--muted); margin-top:2px; }
.main-nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:10px; align-items:center; }
.main-nav a{ color:var(--muted); text-decoration:none; padding:8px 12px; border-radius:999px; transition: all 180ms ease; font-weight:600; }
.main-nav a:hover{ color:var(--accent-dark); background:linear-gradient(90deg, rgba(79,70,229,0.06), rgba(6,182,212,0.04)); transform:translateY(-3px); }
.main-nav a.active{ color:var(--accent-dark); background:linear-gradient(90deg, rgba(79,70,229,0.12), rgba(6,182,212,0.06)); box-shadow: 0 8px 26px rgba(15,23,42,0.06); }
.hero{ display:flex; gap:28px; align-items:center; padding:36px 0; background: linear-gradient(180deg, var(--paper), transparent); }
.hero-text{ flex:1; background: linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0)); padding:22px; border-radius: calc(var(--radius) + 6px); }
.hero-text h2{ margin-top:0; font-size:30px; color:var(--accent-dark); }
.hero-text p{ color:var(--muted); line-height:1.6; margin:12px 0; }
.badge{ display:inline-block; padding:6px 10px; background:linear-gradient(90deg, rgba(79,70,229,0.06), rgba(6,182,212,0.04)); border-radius:999px; border:1px solid var(--line); color:var(--accent-dark); font-size:13px; margin-right:8px; }
.hero-photo{ width:360px; flex:0 0 360px; text-align:center; }
.hero-photo .photo-frame{ display:inline-block; background:var(--card); padding:10px; border-radius:12px; box-shadow: 0 20px 46px rgba(14,23,40,0.06); transition: transform 260ms cubic-bezier(.2,.9,.3,1), box-shadow 260ms ease; }
.hero-photo img{ display:block; max-width:320px; height:auto; border-radius:8px; display:block; }
.hero-photo .photo-frame:hover{ transform: translateY(-8px) rotate(-0.6deg); box-shadow: 0 34px 70px rgba(14,23,40,0.14); }
.photo-caption{ margin-top:10px; font-size:13px; color:var(--muted); }
.card{ background:var(--card); border-radius: var(--radius); padding:18px; border:1px solid var(--line); box-shadow: 0 8px 30px rgba(0,0,0,0.04); }
.header-actions{ display:flex; align-items:center; gap:12px; }
.btn-cta{ display:inline-block; padding:8px 14px; background: linear-gradient(90deg,var(--accent),var(--accent-2)); color:white; border-radius:999px; text-decoration:none; font-weight:700; box-shadow: 0 8px 30px rgba(79,70,229,0.12); transition: transform 180ms ease, box-shadow 180ms ease; }
.btn-cta:hover{ transform:translateY(-3px); box-shadow: 0 26px 60px rgba(79,70,229,0.12); }
.two-col{ display:grid; grid-template-columns: 1fr 320px; gap:22px; align-items:start; }
.two-col .aside{ background:var(--paper); padding:14px; border-radius:8px; border:1px solid var(--line); }
.gallery{ display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
.gallery img{ width:100%; height:auto; object-fit:contain; border-radius:8px; display:block; }
.gallery .card{ padding:0; overflow:hidden; }
@media (max-width:860px){ .hero{ flex-direction:column-reverse; gap:18px; } .hero-photo{ width:100%; } .hero-photo .photo-frame img{ max-width:100%; } .two-col{ grid-template-columns: 1fr; } .gallery{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:480px){ .gallery{ grid-template-columns: 1fr; } }
.container .muted-note{ color:var(--muted); font-size:13px; }

.highlights{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin:20px 0 40px; }
.highlight h3{ margin-top:0; margin-bottom:6px; color:var(--accent-dark); }
.highlight p{ margin:0; color:var(--muted); line-height:1.5; }

@media (max-width:860px){ .brand-wrap{ flex-direction:column; align-items:flex-start; } .header-actions{ margin-top:8px; } .highlights{ grid-template-columns: 1fr; } }