/****************************************************
 I2C Post Layout (reference-matching)
****************************************************/

/* Hide theme hero/header block (NOT navbar, NOT footer) */
.header,
.page-header,
.inner-header,
.inner-header-description,
.post-header,
.post-title-wrap,
.page-title,
.page-title-wrapper,
.content-top,
.hero,
.hero-wrap,
.hero-container {
  display: none !important;
}

/* Prevent clipping from theme containers */
.i2c-post,
.i2c-post__wrap,
.i2c-post__featured,
.i2c-post__bodyGrid,
.i2c-post__contentCol {
  overflow: visible !important;
}

/* Force left alignment everywhere (prevents theme centering) */
.i2c-post,
.i2c-post__wrap,
.i2c-post__title,
.i2c-post__contentCol,
.i2c-post__contentCol * {
  text-align: left !important;
}

.i2c-post {
  font-family: "Anek Latin", sans-serif !important;
  color: #0a1b3f !important;
}

/* Outer column */
.i2c-post__wrap {
  max-width: 1000px !important;
  margin: 0 auto !important;
  padding: 0px 24px 0px !important;
  box-sizing: border-box !important;
}

/* Back link */
.i2c-post__back {
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  color: rgba(10, 27, 63, 0.62) !important;
  text-decoration: none !important;
  margin: 0 0 12px !important;
}
.i2c-post__back:hover {
  color: #0a1b3f !important;
  text-decoration: underline !important;
}

/* -------------------------------------------------
   Chips: match reference (flat, not huge, not round)
--------------------------------------------------*/
.i2c-post__pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 0 12px !important;
}

.i2c-post__pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 9px 14px !important;
  border-radius: 9px !important;          /* less round than pill */
  font-weight: 850 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  border: none !important; 
  letter-spacing: 0.12em !important;                /* flat look */
}

/* Category chip: light blue fill + blue text (reference feel) */
.i2c-post__pill--cat {
  background: #eaf4fb !important;         /* soft light blue */
  color: #005a7a !important;
}

/* Tag chip: light grey fill + dark text */
.i2c-post__pill--tag {
  background: #eef0f3 !important;
  color: #0a1b3f !important;
}

/* -------------------------------------------------
   Featured image: controlled hero crop (reference)
--------------------------------------------------*/
.i2c-post__featured {
  width: 100% !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin: 0 0 18px !important;

  /* a bit more “hero” like the reference */
  height: clamp(240px, 26vw, 320px) !important;
}

.i2c-post__featuredImg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 70% !important; /* bias lower area */
}

/* Title */
.i2c-post__title {
  margin: 0 0 10px !important;
  font-size: 38px !important;             /* closer to reference */
  line-height: 1.12 !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
  color: #0a1b3f !important;
}

/* Two-column body: date left, content right */
.i2c-post__bodyGrid {
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important; /* tighter like reference */
  column-gap: 20px !important;
  align-items: start !important;
}

/* Date column */
.i2c-post__dateCol {
  padding-top: 2px !important;
}

/* Optional: sticky date on wide screens */
@media (min-width: 769px) {
  .i2c-post__dateCol {
    position: sticky !important;
    top: 16px !important;
    align-self: start !important;
  }
}

/* Date text */
.i2c-post__date {
  font-size: 14px !important;
  /* font-weight: 650 !important; */
  color: rgba(10, 27, 63, 0.50) !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.85 !important;
  text-align: right !important;
}

/* Content column (reference has narrower readable width) */
.i2c-post__contentCol {
  max-width: 740px !important;
  line-height: 1.85 !important;
  color: #67758D !important;  /* lighter like reference */
}

/* Align first block with date */
.i2c-post__contentCol > :first-child {
  margin-top: 0 !important;
}

/* Theme-proof blocks inside content */
.i2c-post__contentCol p,
.i2c-post__contentCol ul,
.i2c-post__contentCol ol,
.i2c-post__contentCol figure,
.i2c-post__contentCol blockquote {
  float: none !important;
  clear: both !important;
  width: 100% !important;
}

/* Paragraph rhythm like reference */
.i2c-post__contentCol p {
  margin: 0 0 1.1rem 0 !important;
}

.i2c-post__contentCol ul,
.i2c-post__contentCol ol {
  margin: 0 0 1.1rem 0 !important;
  padding-left: 1.4rem !important;
}

.i2c-post__contentCol li { margin-bottom: 0.55rem !important; }

/* Headings */
.i2c-post__contentCol h2 {
  font-size: 26px !important;
  line-height: 1.2 !important;
  margin: 2rem 0 1rem !important;
  font-weight: 850 !important;
  color: #0a1b3f !important;
}
.i2c-post__contentCol h3 {
  font-size: 20px !important;
  line-height: 1.2 !important;
  margin: 1.8rem 0 0.8rem !important;
  font-weight: 850 !important;
  color: #0a1b3f !important;
}

/* Links */
.i2c-post__contentCol a {
  color: #005a7a !important;
  font-weight: 650 !important;
  text-decoration: underline !important;
}
.i2c-post__contentCol a:hover { color: #0a1b3f !important; }

/* Images in content */
.i2c-post__contentCol img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 14px !important;
}

.i2c-post__contentCol figure,
.i2c-post__contentCol .wp-block-image,
.i2c-post__contentCol .wp-caption {
  margin: 20px 0 !important;
}

.i2c-post__contentCol figcaption,
.i2c-post__contentCol .wp-caption-text {
  margin-top: 8px !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: rgba(10, 27, 63, 0.60) !important;
}

/* Responsive: stack date above content, never center */
@media (max-width: 768px) {
  .i2c-post__wrap { padding: 0px 16px 0px !important; }

  .i2c-post__featured {
    height: clamp(210px, 46vw, 280px) !important;
    border-radius: 14px !important;
  }

  .i2c-post__title {
    font-size: 30px !important;
    margin-bottom: 8px !important;
  }

  .i2c-post__bodyGrid {
    grid-template-columns: 1fr !important;
    row-gap: 8px !important;
  }

  .i2c-post__date {
    text-align: left !important;
  }

  .i2c-post__dateCol {
    position: static !important;
    top: auto !important;
    padding-top: 0 !important;
  }

  .i2c-post__contentCol { max-width: 100% !important; }

  .i2c-post__pills {
    gap: 8px !important;
  }

  .i2c-post__pill {
    padding: 8px 12px !important;
    font-size: 11px !important;
  }
}

/* -------------------------------------------------
   Speaker block (ported from old post CSS)
   Keeps the same look as before
--------------------------------------------------*/
.i2c-post__contentCol .i2c-speaker {
  display: flex !important;
  align-items: flex-start !important;
  gap: 24px !important;
  margin: 24px 0 !important;
}

.i2c-post__contentCol .i2c-speaker__photo {
  flex: 0 0 218px !important;
  max-width: 218px !important;
}

.i2c-post__contentCol .i2c-speaker__photo img,
.i2c-post__contentCol .i2c-speaker__img {
  display: block !important;
  width: 218px !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 14px !important;
}

.i2c-post__contentCol .i2c-speaker__text {
  min-width: 0 !important; /* prevents overflow in flex */
}

.i2c-post__contentCol .i2c-speaker__name {
  font-weight: 800 !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
  margin: 0 0 10px 0 !important;
  color: #0a1b3f !important;
}

/* Optional: keep speaker bio paragraph rhythm consistent */
.i2c-post__contentCol .i2c-speaker__text > div {
  margin: 0 !important;
}

/* Mobile: stack photo above text (same as old behavior) */
@media (max-width: 700px) {
  .i2c-post__contentCol .i2c-speaker {
    flex-direction: column !important;
    align-items: center !important;
  }

  .i2c-post__contentCol .i2c-speaker__photo {
    flex: 0 0 auto !important;
    max-width: 260px !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  .i2c-post__contentCol .i2c-speaker__photo img,
  .i2c-post__contentCol .i2c-speaker__img {
    width: min(260px, 100%) !important;
  }

  .i2c-post__contentCol .i2c-speaker__text {
    width: 100% !important;
  }
}