/* Avenir Black */
@font-face {
    font-family: "Avenir";
    src: url("../fonts/Avenir-Black-03.woff2") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


/* Avenir Light */
@font-face {
    font-family: "Avenir";
    src: url("../fonts/Avenir-Light-07.woff2") format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* Avenir Light Oblique */
@font-face {
    font-family: "Avenir";
    src: url("../fonts/Avenir-LightOblique-08.woff2") format("truetype");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

/* Avenir Medium */
@font-face {
    font-family: "Avenir";
    src: url("../fonts/Avenir-Medium-09.woff2") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

html {
    scroll-behavior: smooth;
}

/* ===== PAGE THEME TOKENS =====
   Dark is the default; light applies when <html data-theme="light">
   (set by the script at the top of the header include). */
:root{
    --ink:#1F1200; --ink-2:#221b15; --ink-3:#2c241c; --cream:#f3ead9;
    --cream-dim:#c7b89e; --cream-faint:#8f8270; --gold:#c8a15f;
    --gold-bright:#e0bd7c; --gold-deep:#7d6234; --wine:#8a4a3a;
    --wine-bright:#c17257; --line:rgba(200,161,95,0.18); --live:#8fae7a;
    --live-ring:rgba(143,174,122,0.18);
    --tint:rgba(200,161,95,0.05);
    --card-hover:rgba(200,161,95,0.045);
    --hero-glow-1:rgba(200,161,95,0.10);
    --hero-glow-2:rgba(138,74,58,0.14);
    --featured-from:rgba(138,74,58,0.14);
    --featured-to:rgba(200,161,95,0.06);
    --badge-bg:rgba(138,74,58,0.85);
    --badge-text:#f3ead9;
    --overlay:rgba(10,8,6,0.92);
    --bs-body-bg: var(--ink);
    --bs-body-color: var(--cream);
  }

:root[data-theme="light"]{
    --ink:#faf6ee; --ink-2:#f2ebdd; --ink-3:#e8dec9; --cream:#1f1812;
    --cream-dim:#54463a; --cream-faint:#7d6e5c; --gold:#916416;
    --gold-bright:#7a5410; --gold-deep:#cdb284; --wine:#8a4a3a;
    --wine-bright:#9a4630; --line:rgba(145,100,22,0.22); --live:#4f8a3a;
    --live-ring:rgba(79,138,58,0.18);
    --tint:rgba(145,100,22,0.06);
    --card-hover:rgba(145,100,22,0.06);
    --hero-glow-1:rgba(200,161,95,0.20);
    --hero-glow-2:rgba(138,74,58,0.08);
    --featured-from:rgba(138,74,58,0.07);
    --featured-to:rgba(200,161,95,0.14);
    --badge-bg:rgba(138,74,58,0.9);
    --badge-text:#fff;
    --overlay:rgba(250,246,238,0.97);
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{background:var(--ink); color:var(--cream);
    /* font-family:'DM Sans', sans-serif;  */
    font-family: "Avenir", sans-serif !important;
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
  .serif{font-family:'Cormorant Garamond', serif;}
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
  ::selection{background:var(--gold); color:var(--ink);}

  /* HERO */
  .hero{position:relative; padding:80px 0 56px; background:radial-gradient(ellipse 900px 500px at 15% -10%, var(--hero-glow-1), transparent 60%), radial-gradient(ellipse 700px 500px at 100% 10%, var(--hero-glow-2), transparent 55%), var(--ink); border-bottom:1px solid var(--line);}
  .eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold); font-weight:600;}
  .eyebrow::before{content:''; width:22px; height:1px; background:var(--gold-deep);}
  .hero h1{
    /* font-family:'Cormorant Garamond', serif; */
    font-family:"Avenir", sans-serif !important;
     font-weight:500; font-size:clamp(42px, 6vw, 76px); line-height:1.03; color:var(--cream); margin:20px 0 4px;}
  .hero h1 em{font-style:italic; color:var(--gold-bright);}
  .hero .sub{font-family:"Avenir", sans-serif !important; font-style:italic; font-size:clamp(19px,2.4vw,25px); color:var(--cream-dim); margin-bottom:30px; max-width:640px;}

  .cadence{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:34px; padding:14px 20px; border:1px solid var(--gold-deep); background:var(--tint); max-width:fit-content;}
  .cadence .dot-live{width:8px; height:8px; border-radius:50%; background:var(--live); box-shadow:0 0 0 4px var(--live-ring); flex-shrink:0;}
  .cadence span{font-size:13px; color:var(--cream-dim);}
  .cadence b{color:var(--cream); font-weight:600;}
  .cadence .sep{color:var(--gold-deep);}

  .hero-copy{max-width:660px; color:var(--cream-dim); font-size:16px; margin-bottom:12px;}
  .hero-copy strong{color:var(--cream); font-weight:600;}

  .stat-row{display:flex; gap:36px; margin-bottom:32px; flex-wrap:wrap; margin-top: 30px;}
  .stat b{font-family:"Avenir", sans-serif !important; font-size:34px; color:var(--gold-bright); display:block; line-height:1;}
  .stat span{font-size:12px; color:var(--cream-faint); letter-spacing:0.03em;}

  /* SECTIONS */
  .section{padding:60px 0;}
  .section-head{display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:30px; flex-wrap:wrap;}
  .section-head h2{font-family:"Avenir", sans-serif !important; font-weight:500; font-size:clamp(28px,3.2vw,40px); color:var(--cream);}
  .section-head .note{font-size:13px; color:var(--cream-faint);}

  /* FEATURED */
  .featured-list{display:flex; flex-direction:column; gap:16px;}
  .featured{background:linear-gradient(135deg, var(--featured-from), var(--featured-to)); border:1px solid var(--gold-deep); padding:32px; display:grid; grid-template-columns:auto 1fr auto; gap:26px; align-items:center;}
  .featured .badge{font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--wine-bright); font-weight:700; display:inline-block; margin-bottom:9px;}
  .featured-photos{display:flex; gap:10px; align-items:center;}
  .featured .photo{width:70px; height:70px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); background:var(--ink-3);}
  .featured h3{font-family:"Avenir", sans-serif !important; font-weight:500; font-size:25px; color:var(--cream); line-height:1.2; margin-bottom:9px;}
  .featured .meta{font-size:13.5px; color:var(--cream-dim);}
  .featured .meta b{color:var(--cream); font-weight:600;}
  .btn{display:inline-block; background:var(--gold); color:var(--ink); font-weight:700; font-size:13px; padding:13px 26px; white-space:nowrap; transition:all .18s ease;}
  .btn:hover{background:var(--gold-bright); color:var(--ink); transform:translateY(-1px);}

  /* CONTROLS */
  .controls{display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-bottom:34px; padding-bottom:26px; border-bottom:1px solid var(--line);}
  .search{flex:1; min-width:220px; background:var(--ink-2); border:1px solid var(--line); color:var(--cream); padding:12px 16px; font-size:14px;}
  .search::placeholder{color:var(--cream-faint);}
  .search:focus{outline:none; border-color:var(--gold);}
  .chips{display:flex; gap:8px; flex-wrap:wrap;}
  .chip{font-size:12.5px; padding:8px 15px; border:1px solid var(--line); border-radius:999px; color:var(--cream-dim); cursor:pointer; background:transparent; transition:all .15s ease;}
  .chip:hover{border-color:var(--gold-deep); color:var(--cream);}
  .chip.active{background:var(--gold); border-color:var(--gold); color:var(--ink); font-weight:700;}

  /* MONTH GROUPS & CARDS */
  .month-group{margin-bottom:8px;}
  .month-group.hidden{display:none;}
  .month-title{display:flex; align-items:baseline; gap:14px; padding:22px 0 14px;}
  .month-title .m{font-family:"Avenir", sans-serif !important; font-weight:500; font-size:26px; color:var(--gold-bright);}
  .month-title .y{font-size:14px; color:var(--cream-faint); font-weight:400;}
  .month-title .rule{flex:1; height:1px; background:var(--line);}
  .row-list{border-top:1px solid var(--line);}

  .card{display:grid; grid-template-columns:66px 148px 1fr auto; gap:20px; align-items:center; padding:16px 6px; border-bottom:1px solid var(--line); cursor:pointer; transition:background .15s ease;}
  .card:hover{background:var(--card-hover);}
  .card.hidden{display:none;}

  .date-block{text-align:center; border:1px solid var(--gold-deep); padding:8px 4px; background:var(--ink-2);}
  .date-block .dow{font-size:10px; letter-spacing:0.06em; text-transform:uppercase; color:var(--cream-faint); display:block;}
  .date-block .dnum{font-family:"Avenir", sans-serif !important; font-size:26px; color:var(--gold-bright); line-height:1.15; display:block;}

  .thumb-wrap{position:relative; aspect-ratio:16/9; background:var(--ink-3); overflow:hidden; border:1px solid var(--line);}
  .thumb-wrap img{width:100%; height:100%; object-fit:cover;}
  /* play overlay sits on the video thumbnail, so it stays dark in both themes */
  .play-btn{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(to top, rgba(22,18,16,0.55), rgba(22,18,16,0.05) 55%);}
  .play-btn::after{content:''; width:34px; height:34px; border-radius:50%; background:rgba(22,18,16,0.55); border:1.3px solid #e0bd7c; position:relative;}
  .play-btn svg{position:absolute; width:12px; height:12px; fill:#e0bd7c; margin-left:1.5px;}
  .no-recording{position:absolute; bottom:5px; left:5px; font-size:9px; background:var(--badge-bg); color:var(--badge-text); padding:3px 6px;}

  .info h4{font-family:"Avenir", sans-serif !important; font-weight:500; font-size:19px; line-height:1.28; color:var(--cream); margin-bottom:6px;}
  .info .speaker{font-size:13px; color:var(--cream-dim); margin-bottom: 2px;}
  .info .host{font-size:12.5px; color:var(--cream-faint);}
  .watch-label{font-size:12px; font-weight:700; color:var(--gold); white-space:nowrap; display:flex; align-items:center; gap:5px;}
  .watch-label.disabled{color:var(--cream-faint); font-weight:500;}

  /* LIGHTBOX */
  .lightbox{position:fixed; inset:0; background:var(--overlay); z-index:10099; display:none; align-items:center; justify-content:center; padding:24px;}
  .lightbox.open{display:flex;}
  .lightbox-inner{width:100%; max-width:960px;}
  .lightbox-frame{position:relative; width:100%; aspect-ratio:16/9; background:#000;}
  .lightbox-frame iframe{width:100%; height:100%; border:0;}
  .lightbox-meta{padding:18px 4px 0; display:flex; justify-content:space-between; gap:20px; align-items:flex-start;}
  .lightbox-meta h3{font-family:"Avenir", sans-serif !important; font-size:22px; color:var(--cream); margin-bottom:6px;}
  .lightbox-meta p{font-size:13.5px; color:var(--cream-dim);}
  .lightbox-close{background:none; border:1px solid var(--gold-deep); color:var(--cream-dim); width:38px; height:38px; border-radius:50%; cursor:pointer;}
  .no-results{display:none; text-align:center; padding:60px 20px; color:var(--cream-faint); font-family:"Avenir", sans-serif !important; font-size:22px; font-style:italic;}

  @media (max-width:760px){
    .card{grid-template-columns:52px 100px 1fr; grid-template-areas:"date thumb info" "date thumb watch"; row-gap:6px;}
    .date-block{grid-area:date;} .thumb-wrap{grid-area:thumb;} .info{grid-area:info;} .watch-label{grid-area:watch;}
  }