/* ═══════════════════════════════════════════════
   DANNY MUSIC – dannymusic.ro
   Minimalist · Navy · Lime
═══════════════════════════════════════════════ */

:root {
  --navy:      #0B1229;
  --navy-2:    #0F1A38;
  --navy-3:    #162040;
  --lime:      #C8E63A;
  --lime-dim:  #a8c22e;
  --lime-glow: rgba(200,230,58,0.12);
  --white:     #FFFFFF;
  --grey:      rgba(255,255,255,0.55);
  --grey-dim:  rgba(255,255,255,0.15);
  --border:    rgba(200,230,58,0.14);
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-sans:  'DM Sans', sans-serif;
  --font-mono:  'Bebas Neue', sans-serif;
  --transition: 0.4s cubic-bezier(.16,1,.3,1);
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--font-sans);
  background: var(--navy);
  color: var(--white);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }

/* ── CURSOR ── */
.cur { width:8px; height:8px; background:var(--lime); border-radius:50%; position:fixed; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); transition:transform .1s; mix-blend-mode:exclusion; }
.cur-ring { width:36px; height:36px; border:1px solid rgba(200,230,58,.45); border-radius:50%; position:fixed; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); transition:left .22s ease,top .22s ease; }

/* ── NAV ── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  padding: 1.4rem 5vw;
  display: flex; align-items: center; justify-content: space-between;
  transition: background var(--transition), border var(--transition);
}
.nav.stuck {
  background: rgba(11,18,41,0.94);
  backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--border);
}
.nav__logo {
  font-family: var(--font-mono);
  font-size: 1.5rem; letter-spacing: .16em;
  color: var(--white);
}
.nav__logo em { color: var(--lime); font-style: normal; }
.nav__links { display:flex; gap:2.8rem; list-style:none; }
.nav__links a {
  font-size: .78rem; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--grey);
  position: relative;
  transition: color .3s;
}
.nav__links a::after {
  content:''; position:absolute; bottom:-3px; left:0; width:0; height:1px;
  background:var(--lime); transition:width .3s;
}
.nav__links a:hover { color:var(--white); }
.nav__links a:hover::after { width:100%; }

/* ── HERO ── */
.hero {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 40%;
  position: relative;
  overflow: hidden;
}
.hero__noise {
  position:absolute; inset:0; pointer-events:none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
  opacity:.6;
}
.hero__glow {
  position:absolute; right:-5%; top:10%;
  width:55vw; height:90vh;
  background: radial-gradient(ellipse, rgba(200,230,58,.06) 0%, transparent 65%);
  pointer-events:none;
}
.hero__left {
  position:relative; z-index:2;
  display:flex; flex-direction:column; justify-content:center;
  padding: 9rem 5vw 5rem 5vw;
}
.hero__eyebrow {
  display:flex; align-items:center; gap:.8rem;
  font-size:.72rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--lime); margin-bottom:2rem;
}
.hero__eyebrow::before { content:''; display:block; width:28px; height:1px; background:var(--lime); }

.hero__name {
  font-family: var(--font-serif);
  font-size: clamp(3.8rem, 6.5vw, 7rem);
  font-weight: 700; line-height: 1.0;
  margin-bottom: .5rem;
}
.hero__name .line2 {
  display:block;
  color: var(--lime);
  font-style: italic;
}
.hero__role {
  font-family: var(--font-mono);
  font-size: clamp(1rem,1.6vw,1.5rem);
  letter-spacing: .28em;
  color: var(--grey);
  margin-bottom: 2.5rem;
}
.hero__bio {
  font-size: .98rem; font-weight: 300; line-height: 1.9;
  color: var(--grey);
  max-width: 400px;
  margin-bottom: 3.5rem;
}
.hero__stats {
  display:flex; gap:3rem; margin-bottom:3.5rem;
  border-top:1px solid var(--border);
  padding-top:2rem;
}
.stat__n {
  font-family:var(--font-serif);
  font-size:2.5rem; font-weight:700; color:var(--lime); line-height:1;
}
.stat__l {
  font-size:.68rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--grey); margin-top:.3rem;
}
.hero__cta {
  display:flex; gap:1.2rem; align-items:center; flex-wrap:wrap;
}
.btn {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.85rem 2rem; border-radius:50px;
  font-size:.8rem; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase;
  cursor:pointer; border:none;
  transition:all .3s ease;
}
.btn--lime { background:var(--lime); color:var(--navy); box-shadow:0 0 28px rgba(200,230,58,.28); }
.btn--lime:hover { background:#d6f04a; box-shadow:0 0 44px rgba(200,230,58,.45); transform:translateY(-2px); }
.btn--ghost { background:transparent; color:var(--white); border:1px solid var(--grey-dim); }
.btn--ghost:hover { border-color:var(--lime); color:var(--lime); }

.hero__right {
  position:relative; z-index:2;
  overflow:hidden;
}
.hero__photo {
  width:100%; height:100%;
  object-fit:cover; object-position:top center;
  mask-image: linear-gradient(to right, transparent 0%, black 15%, black 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 15%, black 100%);
  filter:grayscale(15%) contrast(1.05);
}
.hero__photo-overlay {
  position:absolute; bottom:0; left:0; right:0; height:35%;
  background:linear-gradient(to top, var(--navy), transparent);
}

.hero__scroll {
  position:absolute; bottom:2.5rem; left:5vw; z-index:3;
  display:flex; align-items:center; gap:.8rem;
  font-size:.68rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase;
  color:var(--grey);
}
.hero__scroll-bar {
  width:48px; height:1px; background:var(--grey-dim); overflow:hidden; position:relative;
}
.hero__scroll-bar::after {
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background:var(--lime); animation:scrollBar 1.8s ease infinite;
}
@keyframes scrollBar { to { left:100%; } }

/* ── SECTIONS common ── */
.section { padding:7rem 5vw; }
.s-tag {
  display:inline-flex; align-items:center; gap:.7rem;
  font-size:.68rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--lime); margin-bottom:1rem;
}
.s-tag::before { content:''; display:block; width:28px; height:1px; background:var(--lime); }
.s-title {
  font-family:var(--font-serif);
  font-size:clamp(2rem,3.8vw,3.6rem);
  font-weight:700; line-height:1.1;
}
.s-title em { font-style:italic; color:var(--lime); }

/* ── ABOUT ── */
.about { background:var(--navy-2); }
.about__inner {
  display:grid; grid-template-columns:1fr 1.5fr;
  gap:6rem; align-items:center;
}
.about__img-wrap { position:relative; }
.about__img {
  width:100%; aspect-ratio:3/4;
  object-fit:cover; object-position:top;
  filter:grayscale(20%) contrast(1.05);
  border-radius:2px;
}
.about__img-border {
  position:absolute; inset:0;
  border:1px solid var(--lime);
  border-radius:2px;
  transform:translate(12px,12px);
  z-index:-1;
}
.about__badge {
  position:absolute; bottom:-1rem; right:-1rem;
  width:100px; height:100px; border-radius:50%;
  background:var(--lime); color:var(--navy);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  box-shadow:0 0 32px rgba(200,230,58,.35);
}
.about__badge-n { font-family:var(--font-serif); font-size:1.9rem; font-weight:700; line-height:1; }
.about__badge-l { font-size:.58rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; text-align:center; line-height:1.3; }

.about__text { margin-top:2rem; }
.about__text p {
  font-size:.98rem; font-weight:300; line-height:1.95;
  color:var(--grey); margin-bottom:1.1rem;
}
.about__text strong { color:var(--white); font-weight:600; }
.about__tags { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:2rem; }
.tag {
  padding:.38rem 1rem; border-radius:50px;
  border:1px solid var(--border);
  font-size:.72rem; font-weight:500;
  color:rgba(200,230,58,.7);
  background:var(--lime-glow);
}

/* ── ACTIVITY ── */
.activity { background:var(--navy); position:relative; overflow:hidden; }
.activity__watermark {
  position:absolute; right:-2rem; top:50%;
  transform:translateY(-50%);
  font-family:var(--font-mono);
  font-size:16rem; line-height:1;
  color:rgba(255,255,255,.018);
  pointer-events:none;
  letter-spacing:.05em;
}
.activity__grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; margin-top:4rem;
  border:1px solid var(--border);
}
.activity-card {
  padding:2.2rem; background:var(--navy);
  border:none;
  transition:background var(--transition);
  cursor:default;
  position:relative; overflow:hidden;
}
.activity-card::before {
  content:''; position:absolute;
  inset:0; opacity:0;
  background:linear-gradient(135deg, rgba(200,230,58,.05), transparent);
  transition:opacity .4s;
}
.activity-card:hover { background:var(--navy-2); }
.activity-card:hover::before { opacity:1; }
.activity-card__icon { font-size:1.4rem; margin-bottom:1.4rem; }
.activity-card__title {
  font-family:var(--font-serif);
  font-size:1.3rem; font-weight:700;
  margin-bottom:.6rem;
}
.activity-card__desc {
  font-size:.86rem; font-weight:300; line-height:1.8;
  color:var(--grey);
}
.activity-card__note {
  display:inline-block; margin-top:1.2rem;
  font-size:.68rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--lime);
}

/* ── COMMUNITY ── */
.community { background:var(--navy-2); }
.community__inner {
  display:grid; grid-template-columns:1fr 1fr;
  gap:5rem; align-items:center;
}
.community__nums { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:2.5rem; }
.num-card {
  border:1px solid var(--border);
  padding:1.5rem; border-radius:2px;
}
.num-card__n { font-family:var(--font-serif); font-size:2.2rem; font-weight:700; color:var(--lime); line-height:1; }
.num-card__l { font-size:.68rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); margin-top:.3rem; }
.community__links { margin-top:2.5rem; display:flex; gap:1rem; flex-wrap:wrap; }
.social-link {
  display:inline-flex; align-items:center; gap:.6rem;
  padding:.65rem 1.4rem; border-radius:50px;
  border:1px solid var(--border);
  font-size:.78rem; font-weight:500;
  color:var(--grey); transition:all .3s;
}
.social-link:hover { border-color:var(--lime); color:var(--lime); background:var(--lime-glow); }
.community__visual {
  background:var(--navy);
  border:1px solid var(--border);
  border-radius:2px; overflow:hidden;
}
.cv__header {
  background:var(--navy-3);
  padding:1.1rem 1.5rem;
  display:flex; align-items:center; gap:1rem;
  border-bottom:1px solid var(--border);
}
.cv__dot { width:8px; height:8px; border-radius:50%; background:var(--lime); }
.cv__name { font-weight:600; font-size:.88rem; }
.cv__sub { font-size:.72rem; color:var(--lime); }
.cv__body { padding:1.5rem; }
.cv__post-text { font-size:.86rem; line-height:1.75; color:rgba(255,255,255,.78); margin-bottom:1rem; }
.cv__bar { height:1px; background:var(--border); margin:1rem 0; }
.cv__reactions { display:flex; gap:1.2rem; font-size:.78rem; color:var(--grey); }

/* ── CONTACT ── */
.contact { background:var(--navy); text-align:center; position:relative; overflow:hidden; }
.contact__glow {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(200,230,58,.07) 0%, transparent 70%);
  pointer-events:none;
}
.contact__inner { position:relative; z-index:1; max-width:560px; margin:0 auto; }
.contact__inner .s-tag { justify-content:center; }
.contact__inner .s-tag::before { display:none; }
.contact__email {
  display:block;
  font-family:var(--font-serif);
  font-size:clamp(1.4rem,2.8vw,2.2rem);
  color:var(--white);
  margin:1.8rem 0 2.5rem;
  transition:color .3s;
}
.contact__email:hover { color:var(--lime); }
.contact__socials { display:flex; justify-content:center; gap:.8rem; flex-wrap:wrap; }
.soc-btn {
  width:46px; height:46px; border-radius:50%;
  border:1px solid var(--grey-dim);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; color:var(--grey);
  transition:all .3s;
}
.soc-btn:hover { border-color:var(--lime); color:var(--lime); box-shadow:0 0 18px rgba(200,230,58,.2); }

/* ── FOOTER ── */
.footer {
  background:rgba(0,0,0,.5);
  padding:1.5rem 5vw;
  display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid rgba(255,255,255,.05);
  font-size:.75rem; color:var(--grey);
  flex-wrap:wrap; gap:1rem;
}
.footer__logo { font-family:var(--font-mono); font-size:1rem; letter-spacing:.14em; color:var(--white); }
.footer__logo em { color:var(--lime); font-style:normal; }

/* ── ADMIN BTN ── */
.admin-fab {
  position:fixed; bottom:2rem; right:2rem; z-index:800;
  width:48px; height:48px; border-radius:50%;
  background:var(--navy-3); border:1px solid var(--border);
  color:var(--lime); font-size:1.1rem;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:all .3s;
  box-shadow:0 0 20px rgba(200,230,58,.1);
}
.admin-fab:hover { background:var(--lime); color:var(--navy); box-shadow:0 0 30px rgba(200,230,58,.35); }

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(32px); transition:opacity .8s ease,transform .8s ease; }
.reveal.on { opacity:1; transform:none; }
.reveal-l { opacity:0; transform:translateX(-32px); transition:opacity .8s ease,transform .8s ease; }
.reveal-l.on { opacity:1; transform:none; }
.reveal-r { opacity:0; transform:translateX(32px); transition:opacity .8s ease,transform .8s ease; }
.reveal-r.on { opacity:1; transform:none; }

/* ── FADE IN (hero) ── */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }
.fi { opacity:0; animation:fadeUp .9s ease forwards; }
.fi-1{animation-delay:.1s} .fi-2{animation-delay:.25s} .fi-3{animation-delay:.4s}
.fi-4{animation-delay:.55s} .fi-5{animation-delay:.7s}

/* ── RESPONSIVE ── */
@media(max-width:960px){
  .nav__links{display:none}
  .hero{grid-template-columns:1fr}
  .hero__left{padding:8rem 5vw 4rem}
  .hero__right{display:none}
  .about__inner{grid-template-columns:1fr; gap:3rem}
  .activity__grid{grid-template-columns:1fr}
  .community__inner{grid-template-columns:1fr}
  .section{padding:5rem 5vw}
}
