:root {
  --gold: #D4A843;
  --gold2: #F0C864;
  --gold3: #8B6914;
  --black: #020100;
  --dark: #0A0804;
  --mid: #140E06;
  --cream: #F2E8D0;
  --white: #FFFDF7;
  --red: #9B1C1C;
  --green: #1C5E2A;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }

body {
  background: var(--black);
  color: var(--cream);
  font-family: 'Lato', sans-serif;
  overflow-x: hidden;
  cursor: none;
}

/* ── CURSOR ── */
#cur { position:fixed; width:10px; height:10px; background:var(--gold); border-radius:50%; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); mix-blend-mode:difference; transition:width .15s,height .15s; }
#cur2 { position:fixed; width:40px; height:40px; border:1px solid rgba(212,168,67,.5); border-radius:50%; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); transition:all .12s ease; }
body:hover #cur { opacity:1; }

/* ── CANVAS BG ── */
#bgCanvas { position:fixed; inset:0; z-index:0; opacity:.6; pointer-events:none; }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; justify-content:space-between; align-items:center;
  padding:28px 64px;
  background:linear-gradient(180deg,rgba(2,1,0,.9) 0%,transparent 100%);
}
.nav-logo {
  font-family:'Oswald',sans-serif; font-weight:600; font-size:20px;
  letter-spacing:.25em; color:var(--gold); text-decoration:none;
  opacity:0; animation:fadeDown .8s .2s forwards;
}
.nav-links { display:flex; gap:36px; list-style:none; opacity:0; animation:fadeDown .8s .4s forwards; }
.nav-links a { font-family:'Lato',sans-serif; font-size:11px; letter-spacing:.2em; color:rgba(242,232,208,.6); text-decoration:none; text-transform:uppercase; transition:color .3s; }
.nav-links a:hover { color:var(--gold); }
.nav-btn {
  font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--black); background:var(--gold); padding:10px 28px; text-decoration:none;
  opacity:0; animation:fadeDown .8s .6s forwards;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
  transition:background .3s;
}
.nav-btn:hover { background:var(--gold2); }

/* ── HERO ── */
.hero {
  position:relative; min-height:100vh; display:flex; align-items:center;
  overflow:hidden; z-index:1;
}

/* Animated gradient orbs */
.orb {
  position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none;
  animation:orbFloat 8s ease-in-out infinite alternate;
}
.orb1 { width:600px; height:600px; background:radial-gradient(circle,rgba(212,168,67,.18) 0%,transparent 70%); top:-100px; right:0; animation-delay:0s; }
.orb2 { width:400px; height:400px; background:radial-gradient(circle,rgba(155,28,28,.15) 0%,transparent 70%); bottom:-50px; left:10%; animation-delay:-3s; }
.orb3 { width:300px; height:300px; background:radial-gradient(circle,rgba(28,94,42,.12) 0%,transparent 70%); top:30%; left:30%; animation-delay:-5s; }

@keyframes orbFloat {
  0% { transform:translate(0,0) scale(1); }
  100% { transform:translate(30px,40px) scale(1.08); }
}

/* Animated grid lines */
.hero-grid {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(212,168,67,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,168,67,.04) 1px, transparent 1px);
  background-size:80px 80px;
  animation:gridPan 20s linear infinite;
}
@keyframes gridPan {
  0% { background-position:0 0; }
  100% { background-position:80px 80px; }
}

/* IG PHOTO ZONES — hero split layout */
.hero-photo-right {
  position:absolute; right:0; top:0; bottom:0; width:48%;
  overflow:hidden;
  clip-path:polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.hero-photo-right::before {
  content:'';
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(90deg, var(--black) 0%, transparent 40%),
             linear-gradient(180deg, rgba(2,1,0,.4) 0%, transparent 20%, transparent 70%, var(--black) 100%);
}
.hero-photo-right::after {
  content:'📸 REPLACE WITH IG PHOTO\A @iamsmade — Use stage/event shot\A (Afro Nation crowd or O2 Arena)';
  white-space:pre;
  position:absolute; inset:0; z-index:3;
  display:flex; align-items:center; justify-content:center;
  font-family:'Lato',sans-serif; font-size:11px; letter-spacing:.15em;
  color:rgba(212,168,67,.35); text-align:center;
  background:
    linear-gradient(135deg, rgba(212,168,67,.04) 0%, rgba(155,28,28,.04) 50%, rgba(28,94,42,.04) 100%);
  border-left:1px solid rgba(212,168,67,.12);
}
/* When real image is set: */
.hero-photo-right.has-image::after { display:none; }
.hero-photo-right img { width:100%; height:100%; object-fit:cover; object-position:center top; }

/* Floating kente stripes */
.kente-stripe {
  position:absolute; left:0; right:0; height:6px; z-index:3;
  background:repeating-linear-gradient(90deg,
    var(--green) 0, var(--green) 20px,
    var(--gold) 20px, var(--gold) 40px,
    var(--red) 40px, var(--red) 60px,
    #000 60px, #000 80px
  );
  opacity:.7;
}
.kente-top { top:0; animation:stripeSlide 3s linear infinite; }
.kente-bot { bottom:0; animation:stripeSlide 3s linear infinite reverse; }
@keyframes stripeSlide {
  0% { background-position:0 0; }
  100% { background-position:80px 0; }
}

.hero-content {
  position:relative; z-index:5; padding:0 64px;
  max-width:58%;
}

/* Staggered text reveal */
.hero-eyebrow {
  font-family:'Lato',sans-serif; font-size:11px; letter-spacing:.35em;
  color:var(--gold); text-transform:uppercase;
  display:flex; align-items:center; gap:16px;
  opacity:0; animation:fadeUp .9s .5s forwards;
}
.hero-eyebrow span { display:block; width:48px; height:1px; background:var(--gold); }

.hero-name {
  font-family:'Oswald',sans-serif; font-weight:700;
  font-size:clamp(70px,9vw,140px);
  line-height:.9; letter-spacing:.03em;
  color:var(--white);
  margin:20px 0 0;
}
.hero-name .line { display:block; overflow:hidden; }
.hero-name .line span {
  display:block;
  animation:slideUp .9s cubic-bezier(.16,1,.3,1) both;
}
.hero-name .line:nth-child(1) span { animation-delay:.6s; }
.hero-name .line:nth-child(2) span { animation-delay:.75s; color:var(--gold); }
.hero-name .line:nth-child(3) span {
  animation-delay:.9s;
  font-family:'Playfair Display',serif;
  font-weight:400; font-style:italic;
  font-size:.5em; color:rgba(242,232,208,.5);
}

.hero-tagline {
  font-family:'Playfair Display',serif; font-style:italic;
  font-size:20px; color:rgba(242,232,208,.7);
  margin:28px 0; line-height:1.5; max-width:440px;
  opacity:0; animation:fadeUp .9s 1.1s forwards;
}

/* Animated counter stats */
.hero-stats {
  display:flex; gap:40px; margin:36px 0;
  opacity:0; animation:fadeUp .9s 1.2s forwards;
}
.stat { border-left:2px solid var(--gold3); padding-left:20px; }
.stat-num {
  font-family:'Oswald',sans-serif; font-size:42px; font-weight:600;
  color:var(--gold); line-height:1;
}
.stat-lbl { font-size:10px; letter-spacing:.2em; color:rgba(242,232,208,.5); text-transform:uppercase; margin-top:4px; }

.hero-btns {
  display:flex; gap:16px; align-items:center;
  opacity:0; animation:fadeUp .9s 1.4s forwards;
}
.btn-gold {
  display:inline-flex; align-items:center; gap:12px;
  padding:16px 36px; background:var(--gold); color:var(--black);
  font-family:'Oswald',sans-serif; font-weight:600; font-size:13px;
  letter-spacing:.15em; text-transform:uppercase; text-decoration:none;
  clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);
  transition:background .3s,transform .2s;
  position:relative; overflow:hidden;
}
.btn-gold::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
  transform:translateX(-100%);
  transition:transform .5s;
}
.btn-gold:hover::before { transform:translateX(100%); }
.btn-gold:hover { background:var(--gold2); transform:translateY(-2px); }
.btn-outline {
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 36px; border:1px solid rgba(212,168,67,.4);
  color:var(--gold); font-family:'Oswald',sans-serif; font-weight:400;
  font-size:13px; letter-spacing:.15em; text-transform:uppercase; text-decoration:none;
  transition:all .3s;
}
.btn-outline:hover { border-color:var(--gold); background:rgba(212,168,67,.06); }

/* Scroll indicator */
.scroll-ind {
  position:absolute; bottom:36px; left:64px; z-index:5;
  display:flex; align-items:center; gap:16px;
  font-family:'Lato',sans-serif; font-size:10px; letter-spacing:.25em;
  color:rgba(212,168,67,.5); text-transform:uppercase;
  opacity:0; animation:fadeUp .9s 1.8s forwards;
}
.scroll-line { width:60px; height:1px; background:rgba(212,168,67,.3); position:relative; overflow:hidden; }
.scroll-line::after {
  content:''; position:absolute; inset:0;
  background:var(--gold);
  animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse {
  0% { transform:translateX(-100%); }
  100% { transform:translateX(100%); }
}

/* ── ANIMATIONS ── */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeDown { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideUp { from{transform:translateY(110%)} to{transform:translateY(0)} }

/* ── MARQUEE ── */
.marquee-wrap {
  position:relative; z-index:1; overflow:hidden;
  border-top:1px solid rgba(212,168,67,.12);
  border-bottom:1px solid rgba(212,168,67,.12);
  background:var(--mid);
  padding:14px 0;
}
.marquee-track {
  display:flex; gap:0; white-space:nowrap;
  animation:marquee 25s linear infinite;
}
.marquee-track2 {
  display:flex; gap:0; white-space:nowrap;
  animation:marquee 25s linear infinite;
  animation-delay:-12.5s;
}
.marquee-item {
  flex-shrink:0; padding:0 48px;
  font-family:'Oswald',sans-serif; font-size:13px; font-weight:300;
  letter-spacing:.25em; color:var(--gold); text-transform:uppercase;
  display:flex; align-items:center; gap:48px;
}
.marquee-item::after { content:'◆'; font-size:6px; color:var(--red); }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── PHOTO GRID SECTION ── */
.photo-section {
  position:relative; z-index:1; padding:100px 64px;
  background:var(--dark);
}
.photo-section-head { margin-bottom:60px; }
.section-label {
  font-family:'Lato',sans-serif; font-size:10px; letter-spacing:.35em;
  color:var(--gold); text-transform:uppercase; margin-bottom:12px;
  display:flex; align-items:center; gap:12px;
}
.section-label::before { content:''; display:block; width:32px; height:1px; background:var(--gold); }
.section-title {
  font-family:'Playfair Display',serif; font-size:clamp(36px,4vw,60px);
  font-weight:700; line-height:1.1; color:var(--white);
}
.section-title em { font-style:italic; color:var(--gold); }

/* Masonry-style photo grid */
.photo-grid {
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  grid-template-rows:300px 300px;
  gap:4px;
}
.photo-cell {
  position:relative; overflow:hidden;
  background:var(--mid);
  cursor:pointer;
}
.photo-cell.tall { grid-row:span 2; }
.photo-cell::before {
  content:''; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg,transparent 40%,rgba(2,1,0,.85) 100%);
  opacity:0; transition:opacity .4s;
}
.photo-cell:hover::before { opacity:1; }
.photo-cell-img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.photo-cell:hover .photo-cell-img { transform:scale(1.06); }

/* IG photo placeholder styling */
.photo-placeholder {
  width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; padding:24px; text-align:center;
  position:relative; overflow:hidden;
}
.photo-placeholder::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,var(--mid) 0%,rgba(212,168,67,.06) 100%);
}
.photo-placeholder-icon { font-size:32px; position:relative; z-index:1; }
.photo-placeholder-label {
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:300;
  letter-spacing:.15em; color:rgba(212,168,67,.6); text-transform:uppercase;
  position:relative; z-index:1; line-height:1.6;
}
.photo-placeholder-ig {
  font-family:'Lato',sans-serif; font-size:10px;
  color:rgba(242,232,208,.3); letter-spacing:.1em;
  position:relative; z-index:1;
}

.photo-cell-caption {
  position:absolute; bottom:0; left:0; right:0; z-index:3;
  padding:20px 24px;
  opacity:0; transform:translateY(8px); transition:all .35s;
}
.photo-cell:hover .photo-cell-caption { opacity:1; transform:translateY(0); }
.photo-cell-caption h4 {
  font-family:'Oswald',sans-serif; font-size:16px; font-weight:500;
  letter-spacing:.1em; color:var(--white); margin-bottom:4px;
}
.photo-cell-caption p { font-size:12px; color:rgba(212,168,67,.8); letter-spacing:.1em; }

/* ── ABOUT SECTION ── */
.about-section {
  position:relative; z-index:1; padding:120px 64px;
  overflow:hidden;
}
.about-section::before {
  content:'SMADE'; position:absolute;
  font-family:'Oswald',sans-serif; font-weight:700; font-size:280px;
  color:rgba(212,168,67,.025); top:50%; left:50%;
  transform:translate(-50%,-50%); pointer-events:none; letter-spacing:.1em;
  white-space:nowrap;
}
.about-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center;
  max-width:1400px; margin:0 auto;
}
.about-photo-frame {
  position:relative;
}
.about-photo-main {
  width:100%; aspect-ratio:2/3; object-fit:cover; object-position:top;
  position:relative; z-index:1; display:block;
}
.about-photo-wrapper {
  position:relative;
}
.about-photo-wrapper::before {
  content:''; position:absolute;
  top:24px; left:24px; right:-24px; bottom:-24px;
  border:1px solid rgba(212,168,67,.2); z-index:0;
}
.about-photo-wrapper::after {
  content:''; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg,transparent 60%,var(--black) 100%);
}
.about-floating-stat {
  position:absolute; z-index:3; bottom:48px; right:-40px;
  background:var(--gold); padding:24px 28px; text-align:center;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
}
.afloat-num { font-family:'Oswald',sans-serif; font-size:44px; font-weight:700; color:var(--black); line-height:1; }
.afloat-lbl { font-family:'Lato',sans-serif; font-size:9px; letter-spacing:.18em; color:rgba(2,1,0,.7); text-transform:uppercase; margin-top:4px; }
.about-photo-tag {
  position:absolute; top:32px; left:-20px; z-index:3;
  background:var(--dark); border:1px solid rgba(212,168,67,.25);
  padding:10px 16px;
  font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:.2em;
  color:var(--gold); text-transform:uppercase;
}
/* IG note overlay on about photo */
.ig-note {
  position:absolute; inset:0; z-index:4;
  background:rgba(10,8,4,.85);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; text-align:center; padding:32px;
}
.ig-note-icon { font-size:40px; }
.ig-note-text {
  font-family:'Oswald',sans-serif; font-size:13px; letter-spacing:.15em;
  color:var(--gold); text-transform:uppercase; line-height:1.6;
}
.ig-note-sub { font-family:'Lato',sans-serif; font-size:11px; color:rgba(242,232,208,.4); letter-spacing:.1em; }

.about-text { }
.about-quote-big {
  font-family:'Playfair Display',serif; font-size:26px; font-style:italic;
  font-weight:400; color:var(--white); line-height:1.5; margin-bottom:36px;
  padding-left:28px; border-left:3px solid var(--gold);
}
.about-body-text { font-size:16px; line-height:1.85; color:rgba(242,232,208,.65); font-weight:300; margin-bottom:20px; }
.about-pills { display:flex; flex-wrap:wrap; gap:10px; margin:32px 0; }
.pill {
  padding:8px 20px; border:1px solid rgba(212,168,67,.2);
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:300;
  letter-spacing:.15em; color:rgba(212,168,67,.8); text-transform:uppercase;
  transition:all .3s;
}
.pill:hover { background:rgba(212,168,67,.08); border-color:var(--gold); color:var(--gold); }

/* ── AFRO NATION CINEMATIC ── */
.afronation-section {
  position:relative; z-index:1;
  min-height:100vh; display:flex; align-items:center;
  overflow:hidden;
}
.an-bg {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, var(--black) 0%, var(--black) 45%, transparent 70%),
    linear-gradient(180deg, rgba(2,1,0,.6) 0%, transparent 30%, transparent 70%, var(--black) 100%);
  z-index:1;
}
.an-photo {
  position:absolute; right:0; top:0; width:65%; height:100%;
  object-fit:cover; object-position:center;
}
.an-photo-placeholder {
  position:absolute; right:0; top:0; width:65%; height:100%;
  background:
    radial-gradient(ellipse at center, rgba(212,168,67,.08) 0%, transparent 60%),
    linear-gradient(135deg, #0A0804 0%, #140E06 50%, #0A0804 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
  text-align:center;
}
.an-photo-placeholder::before {
  content:''; position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 20% 80%, rgba(212,168,67,.06) 0%, transparent 40%),
    radial-gradient(circle at 80% 20%, rgba(155,28,28,.06) 0%, transparent 40%);
}
.an-crowd-icon { font-size:64px; position:relative; z-index:1; filter:grayscale(1) brightness(.5); }
.an-crowd-label { font-family:'Oswald',sans-serif; font-size:14px; letter-spacing:.25em; color:rgba(212,168,67,.35); text-transform:uppercase; position:relative; z-index:1; line-height:1.6; }
/* Animated light rays */
.an-rays {
  position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden;
}
.ray {
  position:absolute; bottom:0;
  width:2px; background:linear-gradient(180deg,rgba(212,168,67,0) 0%,rgba(212,168,67,.15) 100%);
  animation:rayPulse 3s ease-in-out infinite alternate;
}
.ray:nth-child(1) { left:20%; height:70%; animation-delay:0s; }
.ray:nth-child(2) { left:35%; height:85%; animation-delay:.5s; }
.ray:nth-child(3) { left:50%; height:60%; animation-delay:1s; }
.ray:nth-child(4) { left:65%; height:90%; animation-delay:.3s; }
.ray:nth-child(5) { left:80%; height:75%; animation-delay:.8s; }
@keyframes rayPulse {
  0% { opacity:.2; transform:scaleY(.8); }
  100% { opacity:.8; transform:scaleY(1); }
}
.an-content {
  position:relative; z-index:2; padding:0 64px; max-width:55%;
}
.an-title {
  font-family:'Oswald',sans-serif; font-weight:700;
  font-size:clamp(60px,8vw,120px); line-height:.9; letter-spacing:.04em;
  color:var(--white); margin:20px 0 24px;
}
.an-title span { color:var(--gold); display:block; }
.an-desc { font-size:17px; line-height:1.8; color:rgba(242,232,208,.6); font-weight:300; max-width:460px; margin-bottom:40px; }
.an-numbers {
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
  margin-bottom:40px; border:1px solid rgba(212,168,67,.1);
}
.an-num-box {
  padding:24px 20px; background:rgba(212,168,67,.04);
  border-right:1px solid rgba(212,168,67,.08);
  text-align:center;
}
.an-num-box:last-child { border-right:none; }
.an-num { font-family:'Oswald',sans-serif; font-size:36px; font-weight:600; color:var(--gold); }
.an-num-lbl { font-size:10px; letter-spacing:.18em; color:rgba(242,232,208,.4); text-transform:uppercase; margin-top:6px; }

/* ── TIMELINE ── */
.timeline-section {
  position:relative; z-index:1; padding:120px 64px;
  background:var(--dark);
}
.timeline-inner { max-width:1100px; margin:0 auto; }
.tl-items { margin-top:80px; position:relative; }
.tl-items::before {
  content:''; position:absolute; left:180px; top:0; bottom:0;
  width:1px;
  background:linear-gradient(180deg, transparent, rgba(212,168,67,.3) 10%, rgba(212,168,67,.3) 90%, transparent);
}
.tl-item {
  display:grid; grid-template-columns:160px 1px 1fr;
  gap:0 40px; margin-bottom:72px;
  opacity:0; transform:translateX(-20px);
  transition:opacity .7s ease, transform .7s ease;
}
.tl-item.vis { opacity:1; transform:translateX(0); }
.tl-year {
  font-family:'Oswald',sans-serif; font-size:32px; font-weight:600;
  color:var(--gold3); text-align:right; padding-top:2px; line-height:1;
}
.tl-dot-col { display:flex; justify-content:center; position:relative; }
.tl-dot {
  width:14px; height:14px; background:var(--gold); border-radius:50%;
  box-shadow:0 0 0 4px rgba(212,168,67,.15), 0 0 20px rgba(212,168,67,.3);
  flex-shrink:0; margin-top:4px;
  position:relative; z-index:1;
}
.tl-body { padding-bottom:32px; border-bottom:1px solid rgba(212,168,67,.06); }
.tl-title {
  font-family:'Playfair Display',serif; font-size:24px; font-weight:700;
  color:var(--white); margin-bottom:10px; line-height:1.2;
}
.tl-desc { font-size:15px; color:rgba(242,232,208,.55); line-height:1.75; font-weight:300; }
.tl-tag {
  display:inline-block; margin-top:12px; padding:4px 14px;
  background:rgba(212,168,67,.08); border:1px solid rgba(212,168,67,.15);
  font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:.2em;
  color:var(--gold); text-transform:uppercase;
}

/* ── ARTISTS ── */
.artists-section {
  position:relative; z-index:1; padding:100px 64px;
  overflow:hidden;
}
.artists-section::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 50% 50%, rgba(212,168,67,.04) 0%, transparent 70%);
}
.artists-scroll {
  display:flex; gap:16px; flex-wrap:wrap; justify-content:center;
  margin-top:60px;
}
.artist-card {
  padding:16px 28px;
  background:rgba(212,168,67,.04);
  border:1px solid rgba(212,168,67,.1);
  font-family:'Playfair Display',serif; font-size:20px; font-style:italic;
  color:rgba(242,232,208,.7);
  transition:all .3s; position:relative; overflow:hidden; cursor:default;
}
.artist-card::before {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:var(--gold); transform:scaleX(0); transition:transform .3s;
}
.artist-card:hover { color:var(--gold); background:rgba(212,168,67,.07); border-color:rgba(212,168,67,.25); }
.artist-card:hover::before { transform:scaleX(1); }

/* ── DOCTORATE ── */
.doctorate-section {
  position:relative; z-index:1;
  padding:120px 64px;
  background:var(--mid);
  overflow:hidden;
  text-align:center;
}
/* Animated radial rings */
.doc-rings {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  pointer-events:none;
}
.doc-ring {
  position:absolute; border-radius:50%; border:1px solid rgba(212,168,67,.06);
  top:50%; left:50%; transform:translate(-50%,-50%);
  animation:ringPulse 4s ease-in-out infinite;
}
.doc-ring:nth-child(1) { width:300px; height:300px; animation-delay:0s; }
.doc-ring:nth-child(2) { width:500px; height:500px; animation-delay:.7s; }
.doc-ring:nth-child(3) { width:700px; height:700px; animation-delay:1.4s; }
.doc-ring:nth-child(4) { width:900px; height:900px; animation-delay:2.1s; }
@keyframes ringPulse {
  0%,100% { opacity:.3; transform:translate(-50%,-50%) scale(1); }
  50% { opacity:.7; transform:translate(-50%,-50%) scale(1.02); }
}
.doc-content { position:relative; z-index:1; max-width:800px; margin:0 auto; }
.doc-crown { font-size:80px; animation:crownFloat 3s ease-in-out infinite; display:block; margin-bottom:24px; }
@keyframes crownFloat {
  0%,100% { transform:translateY(0) rotate(-3deg); }
  50% { transform:translateY(-10px) rotate(3deg); }
}
.doc-title {
  font-family:'Oswald',sans-serif; font-weight:700; font-size:clamp(40px,5vw,72px);
  letter-spacing:.05em; color:var(--white); margin-bottom:8px; line-height:1;
}
.doc-sub {
  font-family:'Playfair Display',serif; font-style:italic;
  font-size:22px; color:var(--gold); margin-bottom:32px;
}
.doc-body { font-size:17px; line-height:1.8; color:rgba(242,232,208,.6); margin-bottom:48px; }
.doc-cert {
  display:inline-block;
  padding:40px 60px;
  border:1px solid rgba(212,168,67,.25);
  position:relative;
}
.doc-cert::before,.doc-cert::after {
  content:''; position:absolute;
  width:20px; height:20px;
  border-color:var(--gold); border-style:solid; opacity:.5;
}
.doc-cert::before { top:8px; left:8px; border-width:1px 0 0 1px; }
.doc-cert::after { bottom:8px; right:8px; border-width:0 1px 1px 0; }
.doc-cert-title { font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:.3em; color:var(--gold); text-transform:uppercase; }
.doc-cert-name {
  font-family:'Playfair Display',serif; font-size:36px; font-style:italic;
  color:var(--white); margin:12px 0;
}
.doc-cert-sub { font-family:'Lato',sans-serif; font-size:12px; color:rgba(242,232,208,.4); letter-spacing:.15em; }

/* ── PHOTO STRIP (2nd IG section) ── */
.photostrip {
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(4,1fr); height:380px; gap:3px;
}
.strip-cell {
  position:relative; overflow:hidden; cursor:pointer;
}
.strip-cell-img { width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.strip-cell:hover .strip-cell-img { transform:scale(1.08); }
.strip-cell::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(2,1,0,.7) 100%);
  opacity:0; transition:opacity .4s;
}
.strip-cell:hover::after { opacity:1; }
.strip-placeholder {
  width:100%; height:100%;
  background:var(--mid);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px;
}
.strip-ph-icon { font-size:28px; opacity:.4; }
.strip-ph-text { font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:.2em; color:rgba(212,168,67,.3); text-transform:uppercase; text-align:center; line-height:1.6; padding:0 16px; }
.strip-overlay-text {
  position:absolute; bottom:0; left:0; right:0; z-index:2;
  padding:20px; opacity:0; transform:translateY(6px); transition:all .35s;
}
.strip-cell:hover .strip-overlay-text { opacity:1; transform:translateY(0); }
.strip-overlay-text h5 { font-family:'Oswald',sans-serif; font-size:14px; font-weight:500; color:var(--white); letter-spacing:.1em; }
.strip-overlay-text span { font-size:11px; color:var(--gold); letter-spacing:.1em; }

/* ── CTA / CONTACT ── */
.cta-section {
  position:relative; z-index:1; padding:140px 64px; text-align:center;
  background:var(--dark); overflow:hidden;
}
/* Particle field via CSS */
.particles { position:absolute; inset:0; pointer-events:none; }
.particle {
  position:absolute; width:2px; height:2px; background:var(--gold);
  border-radius:50%; opacity:0;
  animation:particleDrift linear infinite;
}
@keyframes particleDrift {
  0% { opacity:0; transform:translate(0,0); }
  10% { opacity:.8; }
  90% { opacity:.4; }
  100% { opacity:0; transform:translate(var(--dx),var(--dy)); }
}
.cta-inner { position:relative; z-index:1; max-width:800px; margin:0 auto; }
.cta-sup { font-family:'Lato',sans-serif; font-size:11px; letter-spacing:.35em; color:var(--gold); text-transform:uppercase; margin-bottom:24px; }
.cta-title {
  font-family:'Playfair Display',serif; font-size:clamp(48px,6vw,88px);
  font-weight:700; color:var(--white); line-height:1.05; margin-bottom:24px;
}
.cta-title em { font-style:italic; color:var(--gold); }
.cta-sub { font-size:18px; color:rgba(242,232,208,.55); font-weight:300; line-height:1.7; margin-bottom:48px; }
.cta-links { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin-bottom:60px; }
.social-row { display:flex; gap:24px; justify-content:center; }
.social-link {
  display:flex; align-items:center; gap:8px;
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:300;
  letter-spacing:.2em; color:rgba(242,232,208,.4); text-decoration:none;
  text-transform:uppercase; transition:color .3s;
}
.social-link:hover { color:var(--gold); }
.social-link span { width:24px; height:1px; background:currentColor; display:block; }

/* ── FOOTER ── */
footer {
  position:relative; z-index:1; padding:40px 64px;
  background:var(--black);
  border-top:1px solid rgba(212,168,67,.08);
  display:flex; justify-content:space-between; align-items:center;
}
.footer-logo { font-family:'Oswald',sans-serif; font-size:22px; font-weight:600; letter-spacing:.2em; color:var(--gold); }
.footer-copy { font-family:'Lato',sans-serif; font-size:11px; color:rgba(212,168,67,.3); letter-spacing:.15em; }

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

/* delay helpers */
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s}
.d4{transition-delay:.4s} .d5{transition-delay:.5s} .d6{transition-delay:.6s}

@media(max-width:900px){
  nav{padding:20px 24px;}
  .nav-links{display:none;}
  .hero-content{max-width:100%;padding:0 24px;}
  .hero-photo-right{display:none;}
  .about-grid,.an-content{grid-template-columns:1fr;gap:60px;max-width:100%;}
  .an-content{padding:0 24px;max-width:100%;}
  .an-photo-placeholder{display:none;}
  .photo-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto;}
  .photo-cell.tall{grid-row:span 1;}
  .photostrip{grid-template-columns:1fr 1fr;height:auto;}
  .strip-cell{height:200px;}
  .tl-items::before{left:100px;}
  .tl-year{font-size:22px;}
  footer{flex-direction:column;gap:20px;text-align:center;padding:40px 24px;}
  .cta-section,.photo-section,.about-section,.timeline-section,.artists-section,.doctorate-section{padding:80px 24px;}
}