/* ============================================================
   Buttons
   ============================================================ */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding:15px 38px; font-size:1rem; font-weight:500; border-radius:8px;
  transition:all .3s var(--ease); white-space:nowrap;
}
.btn--filled { background:var(--accent); color:var(--bg) }
.btn--filled:hover { background:var(--accent-hover); box-shadow:0 4px 28px rgba(79,170,115,.25) }
.btn--outline { border:1px solid var(--border-hover); color:var(--text) }
.btn--outline:hover { border-color:var(--accent); color:var(--accent) }

/* ============================================================
   Back to Top
   ============================================================ */
.back-to-top {
  position:fixed; bottom:32px; right:32px; width:46px; height:46px;
  border-radius:50%; background:var(--bg-elevated); border:1px solid var(--border);
  color:var(--text-mid); font-size:1.2rem;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:all .3s var(--ease); z-index:90;
}
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0) }
.back-to-top:hover { border-color:var(--accent); color:var(--accent) }

/* ============================================================
   Scroll Reveal
   ============================================================ */
[data-reveal] {
  opacity:0; transform:translateY(28px);
  transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
[data-reveal].visible { opacity:1; transform:translateY(0) }

/* ============================================================
   Photo Overlay
   ============================================================ */
.photo-overlay {
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .35s var(--ease), visibility .35s;
}
.photo-overlay.active { opacity:1; visibility:visible }

.photo-overlay__backdrop {
  position:absolute; inset:0;
  background:rgba(0,0,0,.8); backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
[data-theme="light"] .photo-overlay__backdrop { background:rgba(255,255,255,.85) }

.photo-overlay__img {
  position:relative; z-index:1;
  width:min(360px, 80vw); height:min(360px, 80vw);
  border-radius:50%; object-fit:cover; object-position:top;
  border:3px solid var(--border-hover);
  box-shadow:0 20px 80px rgba(0,0,0,.5);
  transform:scale(.85); transition:transform .35s var(--ease-out);
}
.photo-overlay.active .photo-overlay__img { transform:scale(1) }

/* ============================================================
   Keyframes
   ============================================================ */
@keyframes blink { 50% { opacity:0 } }

/* ============================================================
   Reduced Motion
   ============================================================ */
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important }
  [data-reveal] { opacity:1; transform:none }
}