/* =========================================================
   INFINITY — Blogs & Articles (/blog and /blog/{slug}).
   No mockup exists; built in the redesign's visual system
   (same tokens, type recipe and torn edges as The Lab).
   Scoped under .inf-blog-v3 (applied to <main>) so nothing leaks
   into the shared nav/footer. Prefix: bl-
   Display type is Oswald (tight tracking), body Outfit, script Caveat Brush.
   ========================================================= */

@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Outfit:wght@300;400;500;600&family=Caveat+Brush&family=Cormorant+Garamond:ital,wght@1,500&display=swap");

/* Header: transparent over the top of the page, like the other v3 pages. */
body.inf-blog .eg-header__transparent {
   position: absolute !important;
   top: 0 !important;
   left: 0;
   right: 0;
   z-index: 20;
}
body.inf-blog .eg-header__transparent:not(.header-sticky) {
   background: transparent !important;
   border-bottom: none !important;
}

.inf-blog-v3{
  --bl-bg:        #f4efe5;
  --bl-card:      #faf8f3;
  --bl-border:    #e6dfd0;
  --bl-dark:      #0d0b0a;
  --bl-text:      #1b1819;
  --bl-muted:     #6f6a63;
  --bl-amber:     #8a6134;
  --bl-amber-soft:#a98865;
  --bl-tan:       #c9a877;
  --bl-shadow:    0 3px 14px rgba(70,52,24,.09);
  --bl-font-display: 'Oswald', sans-serif;
  --bl-font-body:    'Outfit', sans-serif;
  --bl-font-script:  'Caveat Brush', 'Caveat', cursive;

  font-family: var(--bl-font-body);
  color: var(--bl-text);
  background: var(--bl-bg);
  overflow-x: hidden;
  display: block;
}

.inf-blog-v3 img{ max-width:100%; display:block; }
.inf-blog-v3 a{ text-decoration:none; color:inherit; }
.inf-blog-v3 ul{ list-style:none; margin:0; padding:0; }
.inf-blog-v3 h1,
.inf-blog-v3 h2,
.inf-blog-v3 h3{ color: var(--bl-text); margin: 0; }
.inf-blog-v3 p{ color: var(--bl-text); }

.inf-blog-v3 .bl-container{ width: 95%; margin: 0 auto; position: relative; z-index: 2; }
.inf-blog-v3 .bl-container--wide{ width: 92%; }
.inf-blog-v3 .bl-container--narrow{ width: min(92%, 760px); }
.inf-blog-v3 .bl-container--cover{ width: min(92%, 1080px); }

.inf-blog-v3 .bl-icon{
  width: 26px; height: 26px;
  fill: none; stroke: currentColor;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0;
}
.inf-blog-v3 .bl-icon--sm{ width: 16px; height: 16px; stroke-width: 2; }

.inf-blog-v3 .bl-leaf{ position:absolute; pointer-events:none; user-select:none; z-index: 5; }

/* ---------------- Script overlay ---------------- */
.inf-blog-v3 .bl-script{
  position:absolute; z-index: 4; margin: 0;
  font-family: var(--bl-font-script);
  text-transform: uppercase;
  line-height: 1.02;
  color: #fff;
  transform: rotate(-9deg);
  transform-origin: left top;
  text-shadow: 0 2px 12px rgba(0,0,0,.45);
}

/* ---------------- Torn-paper edges ---------------- */
.inf-blog-v3 .bl-edge{
  position:absolute; left:0; right:0; height: 56px; z-index: 4; pointer-events:none;
  background: var(--bl-bg);
  -webkit-mask-image: url('/assets/img/shape/footer-shape-01.png');
  mask-image: url('/assets/img/shape/footer-shape-01.png');
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
.inf-blog-v3 .bl-edge--bottom{ bottom:-1px; transform: scaleY(-1); }
.inf-blog-v3 .bl-edge--top{ top:-1px; }

/* ---------------- Type + buttons ---------------- */
.inf-blog-v3 .bl-eyebrow{
  display:block;
  font-family: var(--bl-font-display); font-weight: 500;
  font-size: 18px; letter-spacing: .04em; text-transform: uppercase;
  color: var(--bl-amber-soft);
  margin-bottom: 4px;
}
.inf-blog-v3 .bl-title{
  font-family: var(--bl-font-display); font-weight: 600; text-transform: uppercase;
  font-size: clamp(22px, 1.67vw, 24px); line-height: 1.1;
}
.inf-blog-v3 .bl-sub{ font-size: 15px; color: var(--bl-text); margin: 6px 0 0; }

.inf-blog-v3 .bl-btn{
  display:inline-flex; align-items:center; justify-content:center; gap: 12px;
  height: 48px; padding: 0 32px;
  border-radius: 999px; border: 0;
  background: var(--bl-dark); color:#fff;
  font-family: var(--bl-font-body); font-size: 15px; font-weight: 500;
  transition: transform .2s, background .2s;
}
.inf-blog-v3 .bl-btn:hover{ background:#000; color:#fff; transform: translateY(-2px); }
.inf-blog-v3 .bl-btn--tan{ background: var(--bl-tan); color: var(--bl-dark); }
.inf-blog-v3 .bl-btn--tan:hover{ background:#d6b98d; color: var(--bl-dark); }

.inf-blog-v3 .bl-link{
  display:inline-flex; align-items:center; gap: 10px;
  font-size: 14.5px; font-weight: 500; color: var(--bl-text);
  white-space: nowrap;
}
.inf-blog-v3 .bl-link:hover{ color: var(--bl-amber); }

.inf-blog-v3 .bl-section-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap: 20px;
  margin: 44px 0 18px;
}

.inf-blog-v3 .bl-meta{ display:flex; flex-wrap:wrap; align-items:center; gap: 6px 18px; font-size: 13px; color: var(--bl-muted); }
.inf-blog-v3 .bl-meta span{ display:inline-flex; align-items:center; gap: 7px; }
.inf-blog-v3 .bl-meta .bl-icon{ width: 14px; height: 14px; }
.inf-blog-v3 .bl-meta--lg{ font-size: 14.5px; gap: 8px 22px; }

/* ---------------- Hero ---------------- */
.inf-blog-v3 .bl-hero{
  position:relative; overflow:hidden;
  min-height: 440px;
  background: var(--bl-bg);
}
.inf-blog-v3 .bl-hero-bg{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover; object-position: 70% 40%; max-width:none;
}
.inf-blog-v3 .bl-hero-scrim{
  position:absolute; inset:0; z-index:1;
  background: linear-gradient(90deg, var(--bl-bg) 0%, var(--bl-bg) 30%, rgba(244,239,229,.86) 40%, rgba(244,239,229,.45) 50%, rgba(244,239,229,0) 60%);
}
.inf-blog-v3 .bl-hero-inner{ padding: 128px 0 96px 5.8%; width: 100%; margin: 0; }
.inf-blog-v3 .bl-hero-heading{
  font-family: var(--bl-font-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(42px, 5.2vw, 75px); line-height: 1; letter-spacing: -.055em;
  color: var(--bl-dark);
}
.inf-blog-v3 .bl-hero-heading .accent{
  background: linear-gradient(180deg, #a87a45 0%, #8a5f33 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: var(--bl-amber);
}
.inf-blog-v3 .bl-hero-copy{
  max-width: 505px; margin: 18px 0 0;
  font-size: 18px; line-height: 1.45; color: var(--bl-text);
}
.inf-blog-v3 .bl-leaf--hero-tl{ top: -18px; left: -52px; width: 128px; }
.inf-blog-v3 .bl-leaf--hero-bl{ bottom: -34px; left: -46px; width: 122px; }
.inf-blog-v3 .bl-leaf--hero-tr{ top: 30px; right: -50px; width: 112px; }

/* ---------------- Listing ---------------- */
.inf-blog-v3 .bl-listing{ position: relative; padding: 18px 0 56px; }
.inf-blog-v3 .bl-listing--related{ padding-top: 0; }
.inf-blog-v3 .bl-leaf--list-r{ top: 40px; right: -46px; width: 118px; }
.inf-blog-v3 .bl-leaf--list-l{ top: 520px; left: -50px; width: 118px; }

.inf-blog-v3 .bl-chips{ display:flex; flex-wrap:wrap; gap: 12px; margin-bottom: 34px; }
.inf-blog-v3 .bl-chip{
  display:inline-flex; align-items:center; justify-content:center;
  height: 44px; padding: 0 26px; border-radius: 999px;
  border: 1px solid var(--bl-border); background: rgba(255,255,255,.35);
  font-size: 14.5px; color: var(--bl-text);
  transition: background .2s, color .2s, border-color .2s;
}
.inf-blog-v3 .bl-chip:hover{ border-color: #cfc5b0; background:#fff; color: var(--bl-text); }
.inf-blog-v3 .bl-chip.is-active{ background: var(--bl-dark); border-color: var(--bl-dark); color:#fff; font-weight: 500; }

/* Featured article */
.inf-blog-v3 .bl-featured{
  display:grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr);
  background: var(--bl-dark); border-radius: 10px; overflow:hidden;
  box-shadow: 0 8px 28px rgba(40,30,15,.18);
  transition: transform .2s, box-shadow .2s;
}
.inf-blog-v3 .bl-featured:hover{ transform: translateY(-3px); box-shadow: 0 14px 34px rgba(40,30,15,.24); }
.inf-blog-v3 .bl-featured-photo{ position:relative; min-height: 340px; overflow:hidden; }
.inf-blog-v3 .bl-featured-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; max-width:none; }
.inf-blog-v3 .bl-featured-panel{
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap: 14px;
  padding: 44px 48px;
}
.inf-blog-v3 .bl-tag{
  font-family: var(--bl-font-body); font-size: 12.5px; font-weight: 500; letter-spacing: .06em;
  text-transform: uppercase; color: var(--bl-tan);
}
.inf-blog-v3 .bl-featured-panel h2{
  font-family: var(--bl-font-display); font-weight: 600; text-transform: uppercase;
  font-size: clamp(30px, 3.26vw, 47px); line-height: 1.02; letter-spacing: -.045em;
  color: #fff;
}
.inf-blog-v3 .bl-featured-panel p{ margin: 0; font-size: 16.5px; line-height: 1.45; color: rgba(255,255,255,.9); max-width: 420px; }
.inf-blog-v3 .bl-featured-panel .bl-meta{ color: rgba(255,255,255,.7); }
.inf-blog-v3 .bl-featured-panel .bl-btn{ margin-top: 8px; }

/* Card grid */
.inf-blog-v3 .bl-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.inf-blog-v3 .bl-card{
  display:flex; flex-direction:column;
  background: var(--bl-card); border-radius: 8px; overflow:hidden;
  box-shadow: var(--bl-shadow); transition: transform .2s, box-shadow .2s;
}
.inf-blog-v3 .bl-card:hover{ transform: translateY(-3px); box-shadow: 0 8px 22px rgba(70,52,24,.14); }
.inf-blog-v3 .bl-card-photo{ overflow:hidden; aspect-ratio: 16 / 9; background: var(--bl-border); }
.inf-blog-v3 .bl-card-photo img{ width:100%; height:100%; object-fit: cover; transition: transform .35s; }
.inf-blog-v3 .bl-card:hover .bl-card-photo img{ transform: scale(1.04); }
.inf-blog-v3 .bl-card-body{ display:flex; flex-direction:column; flex:1; padding: 18px 20px 18px; }
.inf-blog-v3 .bl-card-cat{
  font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--bl-amber);
  margin-bottom: 8px;
}
.inf-blog-v3 .bl-card-body h3{
  font-family: var(--bl-font-display); font-weight: 600; font-size: 21px;
  text-transform: uppercase; line-height: 1.15; letter-spacing: -.02em;
}
.inf-blog-v3 .bl-card-body p{ margin: 10px 0 16px; font-size: 14.5px; line-height: 1.4; }
.inf-blog-v3 .bl-card-body .bl-meta{ margin-top: auto; padding-top: 12px; border-top: 1px solid var(--bl-border); }

/* Pagination */
.inf-blog-v3 .bl-pager{ display:flex; justify-content:center; gap: 10px; margin-top: 40px; }
.inf-blog-v3 .bl-pager-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--bl-border); background: rgba(255,255,255,.35);
  font-size: 15px; color: var(--bl-text);
  transition: background .2s, color .2s;
}
.inf-blog-v3 a.bl-pager-btn:hover{ background:#fff; color: var(--bl-text); }
.inf-blog-v3 .bl-pager-btn.is-current{ background: var(--bl-dark); border-color: var(--bl-dark); color:#fff; font-weight: 500; }
.inf-blog-v3 .bl-pager-btn.is-disabled{ opacity: .4; }

.inf-blog-v3 .bl-empty{ text-align:center; padding: 70px 0 40px; }
.inf-blog-v3 .bl-empty p{ margin: 12px 0 24px; font-size: 16px; color: var(--bl-muted); }

/* ---------------- Article page ---------------- */
.inf-blog-v3 .bl-article-head{ position: relative; padding: 148px 0 34px; }
.inf-blog-v3 .bl-leaf--art-tl{ top: 40px; left: -52px; width: 128px; }
.inf-blog-v3 .bl-leaf--art-tr{ top: 70px; right: -50px; width: 112px; }
.inf-blog-v3 .bl-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap: 10px; margin-bottom: 20px; font-size: 14px; color: var(--bl-muted); }
.inf-blog-v3 .bl-crumbs a{ display:inline-flex; align-items:center; gap: 8px; color: var(--bl-amber); font-weight: 500; }
.inf-blog-v3 .bl-crumbs a:hover{ color: var(--bl-dark); }
.inf-blog-v3 .bl-article-title{
  font-family: var(--bl-font-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(34px, 4.4vw, 62px); line-height: 1.02; letter-spacing: -.05em;
  color: var(--bl-dark);
}
.inf-blog-v3 .bl-article-lede{ margin: 18px 0 20px; font-size: 19px; line-height: 1.45; color: var(--bl-text); }
.inf-blog-v3 .bl-article-cover{
  width:100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: 10px;
  box-shadow: 0 8px 28px rgba(40,30,15,.16);
}
.inf-blog-v3 .bl-prose{ padding: 38px 0 12px; font-size: 17.5px; line-height: 1.7; color: var(--bl-text); }
.inf-blog-v3 .bl-prose p{ margin: 0 0 1.2em; font-size: inherit; line-height: inherit; }
.inf-blog-v3 .bl-prose h2,
.inf-blog-v3 .bl-prose h3,
.inf-blog-v3 .bl-prose h4{
  font-family: var(--bl-font-display); font-weight: 600; text-transform: uppercase;
  color: var(--bl-dark); letter-spacing: -.03em; line-height: 1.1; margin: 1.6em 0 .6em;
}
.inf-blog-v3 .bl-prose h2{ font-size: 32px; }
.inf-blog-v3 .bl-prose h3{ font-size: 24px; }
.inf-blog-v3 .bl-prose h4{ font-size: 19px; }
.inf-blog-v3 .bl-prose > :first-child{ margin-top: 0; }
.inf-blog-v3 .bl-prose ul,
.inf-blog-v3 .bl-prose ol{ margin: 0 0 1.4em; padding-left: 1.3em; }
.inf-blog-v3 .bl-prose ul{ list-style: disc; }
.inf-blog-v3 .bl-prose ol{ list-style: decimal; }
.inf-blog-v3 .bl-prose li{ margin-bottom: .45em; padding-left: .2em; }
.inf-blog-v3 .bl-prose li::marker{ color: var(--bl-amber); }
.inf-blog-v3 .bl-prose a{ color: var(--bl-amber); text-decoration: underline; text-underline-offset: 3px; }
.inf-blog-v3 .bl-prose a:hover{ color: var(--bl-dark); }
.inf-blog-v3 .bl-prose blockquote{
  margin: 1.6em 0; padding: 6px 0 6px 22px; border-left: 3px solid var(--bl-tan);
  font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.3em; font-style: italic; line-height: 1.4;
}
.inf-blog-v3 .bl-prose img{ border-radius: 8px; margin: 1.4em 0; height: auto; }
.inf-blog-v3 .bl-article-foot{
  display:flex; flex-wrap:wrap; gap: 14px; padding: 26px 0 64px; margin-top: 18px;
  border-top: 1px solid var(--bl-border);
}

/* ---------------- Stay informed band ---------------- */
.inf-blog-v3 .bl-join{ position:relative; overflow:hidden; background:#14100d; min-height: 190px; }
.inf-blog-v3 .bl-join-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position: 50% 62%; max-width:none; }
.inf-blog-v3 .bl-join-scrim{ position:absolute; inset:0; background: rgba(9,8,7,.66); }
.inf-blog-v3 .bl-join-inner{
  position:relative; z-index:3;
  display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr) minmax(0,.7fr);
  align-items:center; gap: 34px;
  min-height: 190px; padding: 46px 0 26px;
}
.inf-blog-v3 .bl-join-copy{ padding-left: 3.4%; }
.inf-blog-v3 .bl-join-copy h2{
  font-family: var(--bl-font-display); font-weight: 600; text-transform: uppercase;
  font-size: clamp(24px, 2.1vw, 30px); color:#fff; margin: 0 0 8px; line-height: 1.1;
}
.inf-blog-v3 .bl-join-copy p{ margin:0; font-size: 14.5px; line-height: 1.45; color: rgba(255,255,255,.88); }
.inf-blog-v3 .bl-join-form{ display:flex; align-items:stretch; height: 52px; background:#fff; border-radius: 999px; overflow:hidden; }
.inf-blog-v3 .bl-join-form input{
  flex:1; min-width:0; border:0; outline:none; background:transparent;
  padding: 0 26px; font-family: var(--bl-font-body); font-size: 14.5px; color: var(--bl-text);
}
.inf-blog-v3 .bl-join-form button{
  flex: 0 0 auto; padding: 0 30px; border:0; cursor:pointer;
  background: var(--bl-tan); color: var(--bl-dark);
  display:flex; align-items:center; gap: 10px;
  font-family: var(--bl-font-body); font-size: 15px; font-weight: 500;
  transition: background .2s;
}
.inf-blog-v3 .bl-join-form button:hover{ background:#d6b98d; }
.inf-blog-v3 .bl-join-msg{ margin: 10px 0 0 22px; font-size: 14px; color:#fff; }
.inf-blog-v3 .bl-join-msg.is-ok{ margin:0; height: 52px; display:flex; align-items:center; padding: 0 26px; background: rgba(255,255,255,.12); border-radius: 999px; font-size: 15px; }
.inf-blog-v3 .bl-join-msg.is-error{ color:#ffb3a8; }
.inf-blog-v3 .bl-join-script{ top: 30%; left: 87%; font-size: clamp(16px, 2.2vw, 31px); }
.inf-blog-v3 .bl-leaf--join-l{ top: 14px; left: -46px; width: 104px; }
.inf-blog-v3 .bl-leaf--join-r{ top: 20px; right: -46px; width: 100px; }

/* ---------------- Responsive ---------------- */
@media (max-width: 1200px){
  .inf-blog-v3 .bl-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 1000px){
  .inf-blog-v3 .bl-featured{ grid-template-columns: 1fr; }
  .inf-blog-v3 .bl-featured-photo{ min-height: 0; aspect-ratio: 16 / 9; }
  .inf-blog-v3 .bl-featured-panel{ padding: 32px 6%; }
  .inf-blog-v3 .bl-join-inner{ grid-template-columns: 1fr; gap: 18px; }
  .inf-blog-v3 .bl-join-script{ display:none; }
}
@media (max-width: 900px){
  .inf-blog-v3 .bl-hero{ min-height: 0; padding-bottom: 260px; }
  .inf-blog-v3 .bl-hero-bg{ top:auto; bottom:0; height: 300px; object-position: 70% 40%; }
  .inf-blog-v3 .bl-hero-scrim{ background: linear-gradient(180deg, var(--bl-bg) 0%, var(--bl-bg) 62%, rgba(244,239,229,0) 86%); }
  .inf-blog-v3 .bl-hero-inner{ padding: 116px 6% 0; }
  .inf-blog-v3 .bl-leaf--hero-bl{ display:none; }
}
@media (max-width: 700px){
  .inf-blog-v3 .bl-grid{ grid-template-columns: 1fr; }
  .inf-blog-v3 .bl-section-head{ flex-direction: column; gap: 10px; }
  .inf-blog-v3 .bl-prose{ font-size: 16.5px; }
  .inf-blog-v3 .bl-prose h2{ font-size: 27px; }
  .inf-blog-v3 .bl-article-head{ padding-top: 124px; }
}
@media (max-width: 560px){
  .inf-blog-v3 .bl-leaf{ display:none; }
  .inf-blog-v3 .bl-join-form button{ padding: 0 20px; }
  .inf-blog-v3 .bl-chip{ height: 40px; padding: 0 20px; }
}
