/* =====================================================
   Arch2O Profile Redesign v3 — Architizer Layout
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --a2pr-gold:    #C8A96E;
  --a2pr-gold-20: rgba(200,169,110,0.20);
  --a2pr-gold-08: rgba(200,169,110,0.08);
  --a2pr-dark:    #0D0D0D;
  --a2pr-sidebar: #111111;
  --a2pr-text:    rgba(255,255,255,0.82);
  --a2pr-muted:   rgba(255,255,255,0.40);
  --a2pr-border:  rgba(255,255,255,0.08);
  --a2pr-hero-h:  460px;
  --a2pr-sw:      300px;
  --a2pr-serif:   'Cormorant Garamond', Georgia, serif;
  --a2pr-sans:    'DM Sans', system-ui, sans-serif;
  --a2pr-ease:    cubic-bezier(0.4,0,0.2,1);
}

/* ── Hide original BP header completely ── */
#buddypress #item-header,
#buddypress #item-header-cover-image,
.bb-profile-header-wrap,
.bb-user-front-page-cover,
.user-profile-header,
#item-header { display: none !important; }

/* ── Root wrapper ── */
.a2pr-root {
  display: flex;
  min-height: 80vh;
  background: var(--a2pr-dark);
  font-family: var(--a2pr-sans);
  color: var(--a2pr-text);
  position: relative;
  z-index: 1;
}

/* =====================================================
   SIDEBAR
   ===================================================== */
.a2pr-sidebar {
  width: var(--a2pr-sw);
  min-width: var(--a2pr-sw);
  background: var(--a2pr-sidebar);
  border-right: 0.5px solid var(--a2pr-border);
  padding: 36px 24px 60px;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  max-height: 100vh;
  overflow-y: auto;
  scrollbar-width: none;
  flex-shrink: 0;
}
.a2pr-sidebar::-webkit-scrollbar { display: none; }

.a2pr-avatar {
  width: 68px; height: 68px;
  border-radius: 4px;
  overflow: hidden;
  border: 1.5px solid var(--a2pr-gold);
  background: #1a1a1a;
  margin-bottom: 14px;
  flex-shrink: 0;
}
.a2pr-avatar img { width:100%;height:100%;object-fit:cover;display:block; }
.a2pr-avatar-initials {
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--a2pr-serif);font-size:26px;font-weight:300;
  color:var(--a2pr-gold);
}

.a2pr-name {
  font-family: var(--a2pr-serif);
  font-size: 20px; font-weight: 300;
  color: #fff; line-height: 1.2;
  margin-bottom: 6px;
}
.a2pr-tagline {
  font-size: 10px; letter-spacing: 1px;
  color: var(--a2pr-muted); margin-bottom: 14px;
  text-transform: capitalize;
}

.a2pr-divider { height:0.5px; background:var(--a2pr-border); margin:16px 0; }

.a2pr-bio {
  font-size: 12px; line-height: 1.9;
  color: var(--a2pr-muted); font-weight: 300;
  margin-bottom: 4px;
}

/* Meta rows */
.a2pr-meta { display:flex; gap:10px; margin-bottom:9px; align-items:flex-start; }
.a2pr-meta-label {
  font-size:9px; letter-spacing:1.5px; text-transform:uppercase;
  color:rgba(255,255,255,0.25); min-width:70px; padding-top:1px; flex-shrink:0;
}
.a2pr-meta-value { font-size:11px; color:var(--a2pr-text); }

/* Contact */
.a2pr-contact {
  display:flex; align-items:center; gap:9px;
  font-size:11px; color:var(--a2pr-muted);
  text-decoration:none; margin-bottom:9px;
  transition:color 0.2s;
}
.a2pr-contact:hover { color:var(--a2pr-gold); }
.a2pr-contact svg { width:13px;height:13px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.8; }

/* Follow btn */
.a2pr-follow {
  display:block; width:100%; padding:9px 0; margin-top:20px;
  border:0.5px solid var(--a2pr-gold); background:transparent;
  color:var(--a2pr-gold); font-family:var(--a2pr-sans);
  font-size:10px; letter-spacing:2px; text-transform:uppercase;
  cursor:pointer; transition:all 0.2s;
}
.a2pr-follow:hover { background:var(--a2pr-gold); color:#000; }
.a2pr-follow.active { background:var(--a2pr-gold-08); }

/* =====================================================
   MAIN (right)
   ===================================================== */
.a2pr-main { flex:1; min-width:0; display:flex; flex-direction:column; }

/* HERO */
.a2pr-hero {
  position:relative; width:100%;
  height:var(--a2pr-hero-h);
  overflow:hidden; background:#0a0a0a;
  flex-shrink:0;
}
.a2pr-hero-bg {
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;
  filter:brightness(0.62) saturate(0.85);
  transition:transform 10s ease;
  display:block;
}
.a2pr-hero:hover .a2pr-hero-bg { transform:scale(1.04); }
.a2pr-hero-grid {
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(200,169,110,0.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(200,169,110,0.04) 1px,transparent 1px);
  background-size:60px 60px;
  pointer-events:none;
}
.a2pr-hero-vignette {
  position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(13,13,13,0) 0%,rgba(13,13,13,0) 55%,rgba(13,13,13,0.92) 100%);
  pointer-events:none;
}
.a2pr-hero-wm {
  position:absolute;bottom:18px;right:28px;
  font-family:var(--a2pr-serif);
  font-size:clamp(36px,6vw,84px);
  font-weight:300;letter-spacing:10px;
  color:rgba(200,169,110,0.055);
  pointer-events:none;user-select:none;white-space:nowrap;
}

/* PROJECTS */
.a2pr-projects { padding:28px 28px 64px; }

.a2pr-proj-head {
  display:flex; align-items:baseline; gap:10px;
  margin-bottom:18px; padding-bottom:12px;
  border-bottom:0.5px solid var(--a2pr-border);
}
.a2pr-proj-label {
  font-size:10px;letter-spacing:3px;
  text-transform:uppercase;color:var(--a2pr-muted);
}
.a2pr-proj-count {
  font-family:var(--a2pr-serif);font-size:18px;
  font-weight:300;color:rgba(255,255,255,0.25);
}

/* Grid — 2 cols like Architizer */
.a2pr-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:3px;
}
@media(max-width:860px){ .a2pr-grid{ grid-template-columns:1fr; } }

/* Card */
.a2pr-card {
  display:block; position:relative;
  aspect-ratio:16/10; overflow:hidden;
  text-decoration:none; background:#141414;
}
.a2pr-card-img {
  width:100%;height:100%;object-fit:cover;display:block;
  filter:brightness(0.78) saturate(0.9);
  transition:transform 0.5s var(--a2pr-ease),filter 0.4s;
}
.a2pr-card:hover .a2pr-card-img {
  transform:scale(1.06);
  filter:brightness(0.58) saturate(1.05);
}
.a2pr-card-ph {
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,0.1);
  transition:transform 0.5s var(--a2pr-ease);
}
.a2pr-card:hover .a2pr-card-ph { transform:scale(1.03); }

/* Title always visible at bottom — like Architizer */
.a2pr-card-info {
  position:absolute;bottom:0;left:0;right:0;
  padding:9px 13px 11px;
  background:linear-gradient(to top,rgba(0,0,0,0.72) 0%,transparent 100%);
}
.a2pr-card-title {
  font-size:12px;font-weight:400;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* Skeleton */
.a2pr-sk {
  background:linear-gradient(90deg,#141414 25%,#1d1d1d 50%,#141414 75%);
  background-size:200% 100%;
  animation:a2pr-sh 1.5s infinite;
}
@keyframes a2pr-sh { 0%{background-position:-200% 0} 100%{background-position:200% 0} }

/* Load more */
.a2pr-more {
  display:block;width:100%;padding:12px;margin-top:3px;
  background:transparent;border:0.5px solid var(--a2pr-border);
  color:var(--a2pr-muted);font-family:var(--a2pr-sans);
  font-size:10px;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;transition:all 0.2s;
}
.a2pr-more:hover { border-color:var(--a2pr-gold);color:var(--a2pr-gold); }

/* BG placeholders */
.bg0{background:#16202e}.bg1{background:#162016}.bg2{background:#261616}
.bg3{background:#1c1626}.bg4{background:#26220e}.bg5{background:#0e2026}

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media(max-width:720px){
  .a2pr-root { flex-direction:column; }
  .a2pr-sidebar {
    width:100%;min-width:unset;position:static;
    max-height:none;padding:20px 16px;
    border-right:none;border-bottom:0.5px solid var(--a2pr-border);
  }
  .a2pr-hero { height:240px; }
  .a2pr-projects { padding:20px 16px 48px; }
}