/* ============================================================
   JOURNAL (LIST) — page-only rules.
   Links after common.css. Reuses hero/nav/footer/eyebrow/serif/
   media-banner/story/story-img/media-quote from common.css.
   ============================================================ */

/* ----- Hero: this page's photography + height. ----- */
.journal-hero{
  min-height:var(--hero-height,80vh);
  background:#0b1420 url('/img/db/content/hero.jpg') center/cover no-repeat;
}
.nav-center .current{border-bottom:1px solid rgba(255,255,255,.75);padding-bottom:4px;}

/* ===== CATEGORY TABS ===== */
.journal-tabs{
  background:var(--cream);
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:3;
}
.journal-tabs .container{
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:20px;
}
.tabs-row{
  display:flex;
  flex:1;
  justify-content:space-between;
  gap:0;
  overflow-x:auto;
  scrollbar-width:none;
}
.tabs-row::-webkit-scrollbar{display:none;}
.tab-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding:26px 22px 18px;
  font-size:10.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--muted);
  white-space:nowrap;
  border-bottom:2px solid transparent;
  cursor:pointer;
  background:none;
  flex-shrink:0;
}
.tab-item svg{width:60px;height:60px;stroke:currentColor;flex-shrink:0;transition:color .25s ease;}
.tab-item svg path,
.tab-item svg circle{transition:fill .25s ease,fill-opacity .25s ease;}
.tab-item:hover{color:var(--gold);}
.tab-item:hover svg path,
.tab-item:hover svg circle{fill:var(--gold);fill-opacity:.18;}
.tab-item.active{color:var(--ink);border-bottom-color:var(--gold);}
.tab-search{
  flex-shrink:0;
  padding-left:24px;
  margin-left:4px;
  border-left:1px solid var(--line);
  display:flex;
  align-items:center;
  color:var(--muted);
  cursor:pointer;
  background:none;
  border-top:none;
  border-right:none;
  border-bottom:none;
}
.tab-search:hover{color:var(--ink);}

/* ===== FEATURED ARTICLE ===== */
.featured-article{padding:60px 0 50px;}
.featured-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}
.featured-text h2{
  font-family:'Playfair Display',serif;
  font-weight:var(--fw-h2);
  font-size:var(--fs-h2);
  line-height:1.15;
  margin:14px 0 18px;
}
.featured-text p:not(.eyebrow){
  font-size:16px;
  color:var(--muted);
  line-height:1.7;
  max-width:420px;
  margin-bottom:26px;
}
.featured-img{
  position:relative;
  aspect-ratio:16/9;
  border-radius:2px;
  overflow:hidden;
  background:#0b1420 url('/img/db/content/featured-pause.jpg') center/cover no-repeat;
}

/* ===== LATEST STORIES ===== */
.latest-stories{padding:0 0 90px;}
.latest-head{--sh-gap:30px;--sh-margin:40px;}
.latest-caption{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:500;
  max-width:50%;
  white-space:nowrap;
  text-align:right;
}
.journal-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
}
.journal-card{cursor:pointer;}
.jc-img{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:2px;
  margin-bottom:18px;
  background-color:var(--dark);
  background-size:cover;
  background-position:center;
}
.jc-img::after{
  content:"";
  position:absolute;inset:0;
  background:transparent;
  transition:background .3s ease;
}
.journal-card:hover .jc-img::after{background:rgba(10,9,7,.08);}
.jc-eyebrow{
  font-size:10.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600;
  margin-bottom:10px;
}
.jc-title{
  font-family:'Playfair Display',serif;
  font-size:19px;
  font-weight:500;
  line-height:1.35;
  margin-bottom:10px;
}
.jc-excerpt{
  font-size:15px;
  color:var(--muted);
  line-height:1.65;
  margin-bottom:16px;
}
.jc-1{background-image:url('/img/db/content/card-antigua.jpg');}
.jc-2{background-image:url('/img/db/content/card-people.jpg');}
.jc-3{background-image:url('/img/db/content/card-wellness.jpg');}
.jc-4{background-image:url('/img/db/content/card-food.jpg');}

/* "Explore All Articles" accordion-style load-more groups */
.load-more-group{
  height:0;
  overflow:hidden;
  margin-top:0;
}
.load-more-group.has-content{margin-top:26px;}
.latest-cta{text-align:center;margin-top:52px;}
.latest-cta .btn{
  border:none;
  outline:none;
  font-family:'Jost',sans-serif;
  appearance:none;
  -webkit-appearance:none;
}
.latest-cta .btn[data-done]{opacity:.4;pointer-events:none;}

/* ===== FAQ INTRO BANNER (reuses .media-banner) ===== */
.faq-banner-bg{background-image:url('/img/db/content/faq-banner.jpg');}

/* ===== FAQ SPLIT (reuses .story / .story-img) ===== */
.faq-split-img{background-image:url('/img/db/content/faq-split.jpg');}
.faq-panel{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:var(--section-space-sm,70px) 90px;
}
.faq-list{margin:22px 0 26px;}
.faq-item{
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.faq-item summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 0;
  font-size:14.5px;
  color:var(--ink);
  cursor:pointer;
  list-style:none;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"+";
  font-size:19px;
  font-weight:300;
  color:var(--gold);
  flex-shrink:0;
  line-height:1;
  transition:transform .35s cubic-bezier(.65,0,.35,1);
}
.faq-item[open] summary::after{content:"\2212";}
.faq-item .faq-content{
  padding:0 26px 18px 0;
}
.faq-item .faq-content p{
  font-size:15.5px;
  color:var(--muted);
  line-height:1.65;
}

/* ===== NEWSLETTER (standalone section, not footer's) ===== */
.journal-newsletter{background:var(--cream-2);padding:var(--section-space-md,80px) 0;}
.newsletter-split{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:50px;
  flex-wrap:wrap;
}
.newsletter-text h2{
  font-size:var(--fs-h2);
  font-weight:var(--fw-h2);
  line-height:1.28;
  margin:12px 0 10px;
}
.newsletter-text p:not(.eyebrow){font-size:16px;color:var(--muted);white-space:nowrap;line-height:1.6;}
.newsletter-form-col{
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  max-width:440px;
}
.newsletter-form-col form{display:flex;border:1px solid var(--line);background:var(--cream);}
.newsletter-form-col input{
  flex:1;
  min-width:0;
  border:none;
  background:transparent;
  padding:22px 22px;
  font-family:'Jost',sans-serif;
  font-size:15px;
  color:var(--ink);
}
.newsletter-form-col input::placeholder{color:var(--muted);}
.newsletter-form-col input:focus{outline:none;}
.newsletter-form-col button{
  background:var(--gold);
  border:none;
  padding:0 34px;
  color:#fff;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:600;
  cursor:pointer;
  transition:opacity .2s ease;
  white-space:nowrap;
}
.newsletter-form-col button:hover{opacity:.85;}
.newsletter-note{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:var(--muted);
}
.newsletter-note svg{flex-shrink:0;color:var(--gold);}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .featured-grid{grid-template-columns:1fr;gap:36px;}
  .journal-grid{grid-template-columns:repeat(2,1fr);}
  .latest-head{gap:14px;}
  .latest-caption{text-align:left;max-width:100%;white-space:normal;}
  .faq-panel{padding:56px 32px;}
  .newsletter-split{flex-direction:column;align-items:flex-start;}
  .newsletter-form-col{max-width:100%;}
  .newsletter-text p,
  .newsletter-text p:not(.eyebrow){white-space:normal;}
  .tabs-row{justify-content:flex-start;}
  .tab-item{flex:0 0 auto;}
}

@media (max-width:640px){
  .journal-grid{grid-template-columns:1fr;}
  .tab-item{padding:18px 14px 14px;}
}