.blog-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);margin-top:56px}.blog-card:nth-child(2){--reveal-i:1}.blog-card:nth-child(3){--reveal-i:2}.blog-card{align-items:flex-start;flex-direction:column}.blog-card,.blog-card__media{display:flex;position:relative}.blog-card__media{align-items:center;aspect-ratio:415/264;background:#ddd6cb;border-radius:.75rem;justify-content:center;overflow:hidden;width:100%}.blog-card__media:after{background:#3a312a;content:"";inset:0;opacity:0;position:absolute;transition:opacity .3s}.blog-card__img{display:block;height:100%;object-fit:cover;width:100%}.blog-card__ph{font-family:DM Sans,system-ui,-apple-system,Segoe UI,sans-serif;font-size:13px;font-weight:500;letter-spacing:0;line-height:16px}@media (width<=991.98px){.blog-card__ph{font-size:13px;font-weight:500;letter-spacing:0;line-height:16px}}.blog-card__ph{background:#c2b9ac;color:#887a6d;padding:2px 8px;position:relative}.blog-card__date{font-family:DM Sans,system-ui,-apple-system,Segoe UI,sans-serif;font-size:13px;font-weight:500;letter-spacing:0;line-height:16px}@media (width<=991.98px){.blog-card__date{font-size:13px;font-weight:500;letter-spacing:0;line-height:16px}}.blog-card__date{color:#6b5f53;margin:12px 0 0}.blog-card__title{font-family:DM Sans,system-ui,-apple-system,Segoe UI,sans-serif;font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:24px}@media (width<=991.98px){.blog-card__title{font-size:16px;font-weight:500;letter-spacing:0;line-height:24px}}.blog-card__title{color:#17100a;margin:4px 0 0}.blog-card__excerpt{font-family:DM Sans,system-ui,-apple-system,Segoe UI,sans-serif;font-size:16px;font-weight:400;letter-spacing:-.02em;line-height:24px}@media (width<=991.98px){.blog-card__excerpt{font-size:16px;font-weight:400;letter-spacing:0;line-height:24px}}.blog-card__excerpt{color:#52473c;margin:0}.blog-card__link{margin-top:12px}.blog-card:focus-within .blog-card__media:after,.blog-card:hover .blog-card__media:after{opacity:.12}.blog-card:focus-within .blog-card__link,.blog-card:hover .blog-card__link{border-bottom-width:2px}@media (width<=991.98px){.blog-grid{grid-template-columns:repeat(2,1fr);margin-top:48px}.blog-card:nth-child(2),.blog-card:nth-child(3){--reveal-i:0}.blog-cta{margin-top:32px}}@media (width<=767.98px){.blog-grid{gap:48px;grid-template-columns:1fr}}.page-head--blog{padding-bottom:104px}.section--blog{padding:96px 0}


/* ==========================================================================
   Next Article Card Component (.next-case)
   ========================================================================== */
.next-case {
  background: #ede8e0;
  border-radius: 16px;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  max-width: 800px;
  margin: 48px auto 0;
  padding: 32px 36px;
  display: flex;
  box-sizing: border-box;
}
.next-case__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  flex: 1 1 auto;
}
.next-case__kicker {
  font-family: DM Sans, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  color: #2c221a;
  margin: 0;
}
.next-case__title {
  font-family: DM Sans, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: 26px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.01em;
  color: #2c221a;
  margin: 0;
}
.next-case__btn {
  align-self: flex-start;
  padding: 12px 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  margin-top: 6px;
  background-color: #f9cc00;
  color: #17100a;
  border: 1.5px solid #f9cc00;
  text-decoration: none;
}
.next-case__btn:hover {
  background-color: #e5bb00;
  border-color: #e5bb00;
  color: #17100a;
}
.next-case__img,
picture.next-case__img {
  flex: none;
  width: 220px;
  height: 175px;
  border-radius: 10px;
  overflow: hidden;
  display: block;
}
.next-case__img img,
picture.next-case__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 10px;
}

@media (max-width: 767.98px) {
  .next-case {
    flex-direction: column-reverse;
    align-items: stretch;
    padding: 24px 20px;
    gap: 20px;
  }
  .next-case__img,
  picture.next-case__img {
    width: 100%;
    height: 200px;
  }
}


/* ==========================================================================
   2K & 4K Proportional Scaling (Maintains 1080p visual proportions on 2K/4K)
   ========================================================================== */

/* --- 2K / QHD Displays (2560px - 3399px) --- */
@media (min-width: 2560px) {
  :root {
    --nav-h: 84px;
  }
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1720px;
  }
  .site-nav {
    padding: 12px 48px;
  }
  .site-nav .nav-link {
    font-size: 19px;
  }
  .site-nav .btn {
    font-size: 18px;
    padding: 13px 28px;
    border-radius: 12px;
  }
  .site-nav .logo__mark {
    transform: scale(1.25);
    transform-origin: left center;
  }
  .hero__content {
    padding-left: max(48px, calc(50% - 860px));
    padding-right: max(48px, calc(50% - 860px));
    padding-bottom: 100px;
  }
  .hero__title {
    font-size: 92px;
    line-height: 100px;
  }
  .hero__lead {
    font-size: 32px;
    line-height: 42px;
  }
  .hero__tags {
    font-size: 19px;
    gap: 16px;
  }
  .hero .cta-row .btn {
    font-size: 18px;
    padding: 14px 28px;
    border-radius: 12px;
  }
  .hero__card {
    right: max(48px, calc(50% - 860px));
    bottom: 100px;
    width: 540px;
    padding: 8px 24px 8px 8px;
    border-radius: 24px;
  }
  .hero__card-media {
    width: 250px;
    height: 250px;
    border-radius: 18px;
  }
  .hero__card-stat-value {
    font-size: 38px;
    line-height: 46px;
  }
  .hero__card-stat-label {
    font-size: 16.5px;
    line-height: 22px;
    max-width: 210px;
  }
  .hero__card-cta {
    font-size: 17px;
    line-height: 22px;
    margin-top: 36px;
  }
  .hero__card-dots {
    left: 282px;
    bottom: 24px;
    gap: 10px;
  }
  .hero__card-dot-track {
    width: 8px;
    height: 8px;
  }
  .hero__card-dot.is-active .hero__card-dot-track {
    width: 38px;
  }
  
  /* Sections Scaling */
  .section {
    padding: 120px 0;
  }
  .sec-head h2, h2.word-reveal {
    font-size: 64px;
    line-height: 72px;
  }
  .sec-head__lead--large {
    font-size: 22px;
    line-height: 32px;
  }
  .cs-item__title {
    font-size: 58px;
    line-height: 66px;
  }
  .cs-stat__value {
    font-size: 30px;
    line-height: 38px;
  }
  .cs-stat__label {
    font-size: 18px;
    line-height: 26px;
  }
  .dna-card__title {
    font-size: 24px;
    line-height: 32px;
  }
  .dna-card__body {
    font-size: 17px;
    line-height: 26px;
  }
  .blog-card__title {
    font-size: 22px;
    line-height: 30px;
  }
  .blog-card__excerpt {
    font-size: 17px;
    line-height: 26px;
  }
  .next-case {
    max-width: 1000px;
    padding: 40px 48px;
    border-radius: 20px;
  }
  .next-case__title {
    font-size: 32px;
    line-height: 40px;
  }
  .next-case__img, picture.next-case__img {
    width: 275px;
    height: 220px;
  }
}

/* --- 4K / UHD Displays (3400px+) --- */
@media (min-width: 3400px) {
  :root {
    --nav-h: 110px;
  }
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 2360px;
  }
  .site-nav {
    padding: 16px 64px;
  }
  .site-nav .nav-link {
    font-size: 25px;
  }
  .site-nav .btn {
    font-size: 24px;
    padding: 18px 38px;
    border-radius: 16px;
  }
  .site-nav .logo__mark {
    transform: scale(1.65);
    transform-origin: left center;
  }
  .hero__content {
    padding-left: max(64px, calc(50% - 1180px));
    padding-right: max(64px, calc(50% - 1180px));
    padding-bottom: 140px;
  }
  .hero__title {
    font-size: 124px;
    line-height: 134px;
  }
  .hero__lead {
    font-size: 42px;
    line-height: 56px;
    margin-top: 36px;
  }
  .hero__tags {
    font-size: 26px;
    gap: 22px;
    margin-top: 36px;
  }
  .hero .cta-row {
    margin-top: 48px;
    gap: 24px;
  }
  .hero .cta-row .btn {
    font-size: 24px;
    padding: 20px 38px;
    border-radius: 16px;
  }
  .hero__card {
    right: max(64px, calc(50% - 1180px));
    bottom: 140px;
    width: 720px;
    padding: 12px 32px 12px 12px;
    border-radius: 30px;
  }
  .hero__card-media {
    width: 330px;
    height: 330px;
    border-radius: 24px;
  }
  .hero__card-stat-value {
    font-size: 50px;
    line-height: 60px;
  }
  .hero__card-stat-label {
    font-size: 22px;
    line-height: 30px;
    max-width: 280px;
  }
  .hero__card-cta {
    font-size: 22px;
    line-height: 30px;
    margin-top: 48px;
  }
  .hero__card-dots {
    left: 374px;
    bottom: 32px;
    gap: 14px;
  }
  .hero__card-dot-track {
    width: 11px;
    height: 11px;
  }
  .hero__card-dot.is-active .hero__card-dot-track {
    width: 50px;
  }
  
  /* Sections Scaling */
  .section {
    padding: 160px 0;
  }
  .sec-head h2, h2.word-reveal {
    font-size: 86px;
    line-height: 96px;
  }
  .sec-head__lead--large {
    font-size: 30px;
    line-height: 44px;
  }
  .cs-item__title {
    font-size: 78px;
    line-height: 88px;
  }
  .cs-stat__value {
    font-size: 40px;
    line-height: 50px;
  }
  .cs-stat__label {
    font-size: 24px;
    line-height: 34px;
  }
  .dna-bento {
    gap: 32px;
  }
  .dna-card {
    padding: 36px 30px;
    border-radius: 24px;
    min-height: 380px;
  }
  .dna-card__icon {
    width: 64px;
    height: 64px;
  }
  .dna-card__title {
    font-size: 32px;
    line-height: 42px;
  }
  .dna-card__body {
    font-size: 22px;
    line-height: 34px;
  }
  .blog-card__title {
    font-size: 28px;
    line-height: 38px;
  }
  .blog-card__excerpt {
    font-size: 22px;
    line-height: 34px;
  }
  .next-case {
    max-width: 1350px;
    padding: 56px 64px;
    border-radius: 28px;
  }
  .next-case__title {
    font-size: 44px;
    line-height: 54px;
  }
  .next-case__kicker {
    font-size: 20px;
    line-height: 26px;
  }
  .next-case__btn {
    font-size: 22px;
    padding: 18px 36px;
    border-radius: 14px;
  }
  .next-case__img, picture.next-case__img {
    width: 370px;
    height: 295px;
  }
}
