/* v1.2.0 – adds Projects grid */
:root{
  --vah-bg: #0a0a0a;
  --vah-surface: #121212;
  --vah-border: rgba(255,255,255,.08);
  --vah-text: #ffffff;
  --vah-muted: rgba(255,255,255,.65);
  --vah-accent: #ffffff;
  --vah-radius: 18px;
  --vah-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.vah-wrap{
  color: var(--vah-text);
  background: var(--vah-bg);
  padding: clamp(16px, 3vw, 40px);
  border-radius: var(--vah-radius);
  box-shadow: var(--vah-shadow);
}

.vah-hero{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(16px, 2.5vw, 32px);
  align-items: stretch;
  margin-bottom: clamp(18px, 3vw, 36px);
}

@media (max-width: 900px){
  .vah-hero{ grid-template-columns: 1fr; }
}

.vah-hero__left{
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border: 1px solid var(--vah-border);
  border-radius: var(--vah-radius);
  padding: clamp(16px, 3vw, 32px);
}

.vah-badge{ display:inline-block; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; padding:6px 10px; border:1px solid var(--vah-border); border-radius:999px; color:var(--vah-muted); margin-bottom:10px; }
.vah-title{ font-size:clamp(28px, 4vw, 42px); line-height:1.06; margin:0 0 6px 0; }
.vah-sub{ color:var(--vah-muted); margin:0 0 18px 0; }

.vah-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.vah-btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; border-radius:14px; background: var(--vah-accent); color:#000; font-weight:700; text-decoration:none; line-height:1; white-space:nowrap; transition: transform .15s ease, opacity .2s ease, box-shadow .2s ease; box-shadow: 0 6px 18px rgba(0,0,0,.35); }
.vah-btn:hover{ transform: translateY(-2px); opacity:.95; }
.vah-btn--ghost{ background: transparent; color: var(--vah-text); border:1px solid var(--vah-border); box-shadow: none; }

.vah-hero__right{ display:grid; gap: clamp(12px, 2vw, 16px); }

.vah-card{ background: var(--vah-surface); border:1px solid var(--vah-border); border-radius: var(--vah-radius); padding: clamp(14px, 2.2vw, 22px); box-shadow: var(--vah-shadow); }
.vah-panel + .vah-panel{ margin-top: 14px; }

.vah-card--kpi{ display:flex; gap:18px; }
.vah-kpi{ flex:1; text-align:center; }
.vah-kpi__num{ font-size: clamp(24px, 4vw, 34px); font-weight:800; }
.vah-kpi__label{ color: var(--vah-muted); font-size:.9rem; }

.vah-card--links{ display:flex; flex-wrap:wrap; gap:12px; }
.vah-chip{ display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius: 999px; border:1px solid var(--vah-border); text-decoration:none; color:var(--vah-text); line-height:1; white-space:nowrap; backdrop-filter: blur(4px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.vah-chip > span{ font-weight:600; font-size: clamp(12px, 1.2vw, 14px); }
.vah-chip:hover{ border-color: rgba(255,255,255,.22); text-decoration:none; }

/* UM area container */
.vah-um-area .um{ --um-white:#fff; }

/* Light restyle of UM account */
.vah-um-area .um.um-account{ background: var(--vah-surface); border:1px solid var(--vah-border); border-radius: var(--vah-radius); padding: clamp(10px, 1.8vw, 20px); }

.vah-um-area .um-account-nav{ border-bottom:1px solid var(--vah-border); }
.vah-um-area .um-account-nav a{ color: var(--vah-muted); padding:10px 14px; border-radius: 10px; transition: background .2s ease, color .2s ease; text-decoration:none; line-height:1; white-space:nowrap; }
.vah-um-area .um-account-nav a.current,
.vah-um-area .um-account-nav a:hover{ background: rgba(255,255,255,.06); color: var(--vah-text); }

.vah-um-area .um-form input[type="text"],
.vah-um-area .um-form input[type="email"],
.vah-um-area .um-form input[type="password"],
.vah-um-area .um-form textarea,
.vah-um-area .um-form select{ background:#0e0e0e; border:1px solid var(--vah-border); color: var(--vah-text); border-radius: 12px; }
.vah-um-area .um-field-label{ color: var(--vah-muted); }
.vah-um-area .um .um-button,
.vah-um-area .um input[type="submit"],
.vah-um-area .um a.um-button{ background: var(--vah-accent); color: #000; border-radius: 12px; font-weight: 700; border:none; line-height:1; white-space:nowrap; }
.vah-um-area .um .um-button:hover,
.vah-um-area .um input[type="submit"]:hover,
.vah-um-area .um a.um-button:hover{ opacity:.95; transform: translateY(-1px); }

/* Projects grid */
.vah-projects-grid h3{ margin-top:0; }
.vah-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:14px; }
@media (max-width: 1024px){ .vah-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .vah-grid{ grid-template-columns: 1fr; } }
.vah-prj{ display:flex; flex-direction:column; border:1px solid var(--vah-border); border-radius:14px; overflow:hidden; background:#0f0f0f; }
.vah-prj__thumb{ width:100%; padding-top:56%; background-size:cover; background-position:center; background-color:#111; }
.vah-prj__body{ padding:12px; }
.vah-prj__title{ margin:.2rem 0 .4rem; font-size:1.05rem; }
.vah-prj__excerpt{ color:var(--vah-muted); margin:0 0 .6rem; min-height:2.4em; }
.vah-prj__actions{ display:flex; gap:10px; }
.vah-muted{ color:var(--vah-muted); }