/* ==========================================================================
   TRIP BLOGS PAGE – GLOBAL LAYOUT ADJUSTMENTS
   (Card grid + expand-to-read comes from research_style.css / research.js;
   this file only carries the page-specific heading and typography.)
   ========================================================================== */

body.page-tripblogs .page-wrapper,
body.page-tripblogs main,
body.page-tripblogs .section-timeline,
body.page-tripblogs .section-timeline-heading,
body.page-tripblogs .container{
  background: transparent !important;
}

body.page-tripblogs .section-timeline{
  position: relative;
}

body.page-tripblogs .overlay-fade-top{
  background-image: linear-gradient(black, #0a0a0a00);
  height: 660px;
  position: absolute;
  inset: 0% 0% auto;
  top: -180px;
  left: -50%;
  right: 0;
  width: 300vw;
  z-index: -1;
  pointer-events: none;
}

body.page-tripblogs footer{
  background: transparent !important;
}

body.light-mode.page-tripblogs{
  background-color: transparent !important;
}

body.light-mode.page-tripblogs footer{
  background: transparent !important;
  color: #111111 !important;
}

/* Prevent inversion of card images. Site-wide rules invert .project-card
   img in light mode (light_mode.css, for icon/logo-style card art) and
   .project-clone .project-full img in dark mode (research_style.css, for
   diagrams). Every image on this page is a real photo, so cancel both in
   both themes rather than just the one direction the defaults happen to
   leave alone. */
body.page-tripblogs .project-card img,
body.page-tripblogs .project-clone .project-full img{
  filter: none !important;
  -webkit-filter: none !important;
}

body.page-tripblogs .project-clone .project-image,
body.page-tripblogs .project-clone .project-full figure,
body.page-tripblogs .project-clone .project-full img,
body.page-tripblogs .project-clone .project-full figcaption{
  display: none !important;
}

/* In-post photos inside an opened story. research_style.css only constrains
   these below 780px, so without this a full-size photo would overflow the
   expanded card on desktop. */
body.page-tripblogs .project-clone .project-full figure img{
  display: none !important;
  width: 100%;
  max-width: 900px;
  height: auto;
  margin: 0 auto;
  border-radius: 6px;
}

/* ==========================================================================
   HEADING
   ========================================================================== */

body.page-tripblogs .tripblogs-title-plain{
  color: transparent;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  background: linear-gradient(to right, gold, #ee0979) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}

body.page-tripblogs.light-mode .tripblogs-title-plain{
  background: linear-gradient(to right, rgb(169, 143, 0), #80003e) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

body.page-tripblogs .tripblogs-subtitle{
  color: #9a9a9a;
  font-family: 'Abaddon Light', sans-serif !important;
  font-weight: 300 !important;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  margin: 8px 0 0;
}

body.light-mode.page-tripblogs .tripblogs-subtitle{
  color: #666;
}

/* ==========================================================================
   PROJECT CARD TYPOGRAPHY (Trip Blogs page only)
   ========================================================================== */

body.page-tripblogs .project-title{
  font-family: 'Abaddon Bold', sans-serif !important;
  font-weight: 700 !important;
}

body.page-tripblogs .project-subtitle{
  font-family: 'Abaddon Light', sans-serif !important;
  font-weight: 300 !important;
}

body.page-tripblogs .blog-meta{
  font-family: 'Abaddon Bold', sans-serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: gold !important;
  margin-bottom: 6px;
}
body.page-tripblogs.light-mode .blog-meta{
  color: #8c761c !important;
}

body.page-tripblogs #projects-grid .project-title{
  font-size: 17px !important;
  line-height: 1.3 !important;
}
body.page-tripblogs #projects-grid .project-subtitle{
  font-size: 14.5px !important;
  line-height: 1.45 !important;
}
@media (max-width: 1100px){
  body.page-tripblogs #projects-grid .project-title{
    font-size: 15px !important;
  }
  body.page-tripblogs #projects-grid .project-subtitle{
    font-size: 13.5px !important;
  }
}
