@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&family=Inter:wght@400;600;800&display=swap');

:root {
  --ink:#241812; --brown:#4b3328; --cream:#fff8ee; --warm:#f2dfc5; --gold:#d8a43f; --white:#fff;
  --shadow:0 24px 70px rgba(36,24,18,.18);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Inter,Arial,sans-serif; background:var(--cream); color:var(--ink); line-height:1.65; }
img { max-width:100%; }
.site-header {
  min-height:100vh; color:white;
  background:linear-gradient(115deg, rgba(36,24,18,.96), rgba(75,51,40,.72)), url("images/jordan-photo-001.jpg");
  background-size:cover; background-position:center;
}
.nav { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; padding:22px 5%; position:relative; z-index:10; }
.brand { color:white; font-weight:800; text-decoration:none; font-size:1.1rem; }
.nav-links { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px 18px; max-width:980px; }
.nav-links a { color:white; text-decoration:none; font-size:.87rem; font-weight:800; }
.menu-button { display:none; background:transparent; border:0; color:white; font-size:2rem; }
.hero { width:min(1180px,90%); margin:auto; padding:58px 0 90px; display:grid; grid-template-columns:1.05fr .75fr; gap:46px; align-items:center; }
.homepage-banner { border-left:6px solid var(--gold); padding:22px 0 22px 24px; background:rgba(0,0,0,.18); border-radius:0 26px 26px 0; }
.homepage-banner p { text-transform:uppercase; letter-spacing:4px; color:#ffe0a0; font-weight:800; margin:0 0 10px; }
h1,h2 { font-family:"Cormorant Garamond",Georgia,serif; line-height:.95; margin:0 0 18px; }
h1 { font-size:clamp(4rem,10vw,8rem); }
.homepage-banner h2 { font-size:clamp(1.7rem,3vw,2.8rem); color:#ffe9b8; }
.homepage-banner strong { display:block; font-size:clamp(1rem,2vw,1.35rem); }
.hero-copy { font-size:1.2rem; max-width:720px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:24px; }
.button { display:inline-block; border-radius:999px; padding:14px 24px; font-weight:800; text-decoration:none; }
.gold { background:var(--gold); color:var(--ink); }
.outline { border:2px solid white; color:white; }
.hero-photo { background:rgba(255,255,255,.15); padding:14px; border-radius:34px; box-shadow:var(--shadow); }
.hero-photo img { border-radius:24px; height:610px; width:100%; object-fit:cover; display:block; }
.quick-stats { width:min(1100px,90%); margin:-45px auto 0; background:white; border-radius:24px; box-shadow:var(--shadow); display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; position:relative; z-index:5; }
.quick-stats div { padding:24px; border-right:1px solid #ead6bd; }
.quick-stats div:last-child { border-right:0; }
.quick-stats b { display:block; color:#956449; }
.quick-stats span { font-weight:800; }
.section { padding:90px 6%; }
.warm { background:var(--warm); }
.dark { background:linear-gradient(135deg,#241812,#4b3328); color:white; }
.split { display:grid; grid-template-columns:.85fr 1fr; gap:55px; align-items:start; }
.kicker { text-transform:uppercase; letter-spacing:4px; color:var(--gold); font-weight:800; font-size:.78rem; }
.section h2, .section-header h2 { font-size:clamp(2.5rem,5vw,4.8rem); color:var(--brown); }
.dark h2, .light h2 { color:white; }
.card,.contact-card,.media-card,.news-card,.legacy-grid article,.tribute-grid blockquote { background:white; color:var(--ink); border-radius:28px; padding:32px; box-shadow:var(--shadow); }
.section-header { max-width:880px; margin:0 auto 42px; text-align:center; }
.featured-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:34px; }
.featured-strip img { width:100%; height:260px; object-fit:cover; border-radius:24px; box-shadow:0 14px 34px rgba(36,24,18,.16); }
.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(205px,1fr)); gap:15px; }
.gallery-item { border:0; background:transparent; padding:0; cursor:pointer; }
.gallery-item img { width:100%; height:255px; object-fit:cover; border-radius:22px; box-shadow:0 14px 34px rgba(36,24,18,.14); transition:.25s; }
.gallery-item:hover img { transform:translateY(-4px); }
.video-frame { width:min(950px,100%); margin:auto; aspect-ratio:16/9; border-radius:28px; overflow:hidden; box-shadow:var(--shadow); background:#000; }
.video-frame iframe { width:100%; height:100%; border:0; }
.tag-list { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.tag-list span { background:#f6e5c9; border-radius:999px; padding:8px 14px; font-weight:800; }
.timeline { max-width:920px; margin:auto; display:grid; gap:18px; }
.timeline div { background:white; border-left:6px solid var(--gold); border-radius:18px; padding:20px 24px; box-shadow:0 14px 34px rgba(36,24,18,.12); }
.timeline span { font-weight:800; color:#956449; }
.media-grid,.news-grid,.legacy-grid,.tribute-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; }
.media-card { background:#fff8ee; }
.media-card a,.news-card a { color:#805222; font-weight:800; }
.news-card span { color:#956449; font-weight:800; text-transform:uppercase; font-size:.78rem; }
.contact { background:linear-gradient(rgba(255,248,238,.9),rgba(255,248,238,.9)),url("images/jordan-photo-001.jpg"); background-size:cover; background-position:center; }
.contact-card { max-width:760px; margin:auto; text-align:center; }
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,.9); display:none; align-items:center; justify-content:center; padding:24px; z-index:99; }
.lightbox.active { display:flex; }
.lightbox img { max-height:88vh; max-width:92vw; border-radius:18px; }
.close { position:absolute; top:18px; right:28px; width:46px; height:46px; border-radius:50%; border:0; font-size:2rem; cursor:pointer; }
footer { background:var(--ink); color:white; text-align:center; padding:28px; }
@media(max-width:900px){
  .menu-button { display:block; }
  .nav { align-items:center; }
  .nav-links { display:none; position:absolute; top:68px; right:5%; left:5%; background:rgba(36,24,18,.98); padding:20px; border-radius:20px; }
  .nav-links.open { display:grid; }
  .hero,.split { grid-template-columns:1fr; }
  .hero-photo img { height:auto; max-height:680px; }
  .quick-stats,.featured-strip { grid-template-columns:1fr 1fr; }
}
@media(max-width:560px){
  .quick-stats,.featured-strip { grid-template-columns:1fr; }
  .section { padding:64px 5%; }
  .homepage-banner { padding-left:16px; }
}


.music-player {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 80;
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 360px;
  background: rgba(36, 24, 18, .94);
  color: white;
  padding: 14px 16px;
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.15);
}

.music-info {
  display: grid;
  line-height: 1.25;
}

.music-info strong {
  color: #ffe0a0;
}

.music-info span {
  font-size: .82rem;
  opacity: .9;
}

#play-memorial-music {
  background: var(--gold);
  color: var(--ink);
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

#youtube-music-holder {
  position: fixed;
  width: 1px;
  height: 1px;
  left: -9999px;
  bottom: -9999px;
  overflow: hidden;
}

@media(max-width:560px) {
  .music-player {
    left: 12px;
    right: 12px;
    bottom: 12px;
    max-width: none;
    justify-content: space-between;
  }
}


.archive-hero {
  min-height: 70vh;
  color: white;
  background:
    linear-gradient(120deg, rgba(36,24,18,.96), rgba(75,51,40,.78)),
    url("images/news-thumb-01.jpg");
  background-size: cover;
  background-position: center;
}

.archive-hero-content {
  width: min(1050px, 90%);
  margin: 0 auto;
  padding: 90px 0 110px;
}

.archive-hero-content h1 {
  font-size: clamp(4rem, 10vw, 8rem);
}

.archive-hero-content p {
  max-width: 760px;
  font-size: 1.2rem;
}

.archive-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 24px;
}

.archive-card {
  background: white;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
}

.archive-card img {
  width: 100%;
  height: 230px;
  object-fit: cover;
}

.archive-card-body {
  padding: 26px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.article-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  color: #956449;
  font-weight: 800;
  font-size: .85rem;
  margin-bottom: 14px;
}

.outlet-logo {
  background: #241812;
  color: #ffe0a0;
  border-radius: 999px;
  padding: 6px 10px;
  letter-spacing: .5px;
}

.read-button {
  margin-top: auto;
  display: inline-block;
  width: fit-content;
  background: var(--gold);
  color: var(--ink);
  text-decoration: none;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 800;
}

.news-timeline {
  max-width: 950px;
  margin: auto;
  position: relative;
  display: grid;
  gap: 18px;
}

.news-timeline-item {
  background: white;
  border-left: 6px solid var(--gold);
  border-radius: 18px;
  padding: 22px 26px;
  box-shadow: 0 14px 34px rgba(36,24,18,.12);
}

.news-timeline-item span {
  color: #956449;
  font-weight: 800;
}

.news-timeline-item a {
  color: #805222;
  font-weight: 800;
}

.archive-cta {
  text-align: center;
  margin: -15px 0 32px;
}
