/* =====================================================
   R1 ReadyFirst – Blog Index Layout
   v48 – Minimal editorial list with images
   Requires: shared.css
   ===================================================== */

/* HERO */
.blog-hero{background:var(--g-deep);padding:var(--xxl) var(--md) var(--xl);position:relative;overflow:hidden;color:var(--white)}
.blog-hero::before{content:'';position:absolute;top:-100px;right:-80px;width:360px;height:360px;border-radius:50%;background:rgba(var(--jade-lt-rgb),.04)}
.blog-hero__inner{position:relative;z-index:1;max-width:680px;margin:0 auto;text-align:center}
.blog-hero .section-eyebrow{color:var(--eyebrow-dark)}
.blog-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,2.75rem);font-weight:700;line-height:1.15;margin-bottom:var(--sm);color:var(--white)}
.blog-hero__sub{font-family:var(--font-prose);font-size:clamp(1.0625rem,2vw,1.1875rem);line-height:1.7;color:rgba(var(--sand-rgb),.75);max-width:560px;margin:0 auto}

/* ARTICLE LIST – minimal editorial style */
.blog-list{padding:var(--xl) var(--md) var(--xxl);background:var(--sand)}
.blog-list__inner{max-width:1060px;margin:0 auto}

/* ARTICLE ITEM */
.blog-item{display:grid;grid-template-columns:380px 1fr;gap:var(--lg);align-items:start;text-decoration:none;color:var(--char);padding:var(--lg) 0;border-bottom:1px solid var(--sand-dk)}
.blog-item:first-child{padding-top:0}
.blog-item:last-child{border-bottom:none}

/* Image */
.blog-item__img-wrap{overflow:hidden;border-radius:10px;aspect-ratio:16/11}
.blog-item__img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.blog-item:hover .blog-item__img{transform:scale(1.03)}

/* Text */
.blog-item__text{display:flex;flex-direction:column}
.blog-item__series{font-family:var(--font-ui);font-size:.6875rem;font-weight:600;color:var(--jade);background:rgba(var(--jade-rgb),.08);padding:.25rem .625rem;border-radius:100px;display:inline-block;margin-bottom:.625rem;width:fit-content}
.blog-item__meta{font-family:var(--font-ui);font-size:.75rem;color:var(--wgray);display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.blog-item__title{font-family:var(--font-display);font-size:clamp(1.125rem,2vw,1.375rem);font-weight:600;line-height:1.3;color:var(--char);margin-bottom:.5rem;transition:color .2s}
.blog-item:hover .blog-item__title{color:var(--jade)}
.blog-item__excerpt{font-family:var(--font-prose);font-size:1rem;line-height:1.65;color:var(--char);flex:1}
.blog-item__read{font-family:var(--font-ui);font-size:.875rem;font-weight:600;color:var(--jade);margin-top:var(--sm);display:inline-flex;align-items:center;gap:.375rem}
.blog-item__read .arrow{transition:transform .3s}
.blog-item:hover .blog-item__read .arrow{transform:translateX(3px)}

/* RESPONSIVE */
@media(max-width:1024px){
  .blog-item{grid-template-columns:280px 1fr}
}
@media(max-width:767px){
  .blog-hero{padding:var(--xl) 20px var(--lg)}
  .blog-list{padding:var(--lg) 20px var(--xl)}
  .blog-item{grid-template-columns:1fr;gap:var(--sm);padding:var(--md) 0}
  .blog-item__img-wrap{aspect-ratio:16/9;max-height:220px}
}

/* CTA */
.blog-cta{padding:var(--xl) var(--md);background:var(--g-forest);text-align:center}
.blog-cta__inner{max-width:620px;margin:0 auto}
.blog-cta h2{color:var(--white);margin-bottom:var(--sm)}
.blog-cta p{color:rgba(var(--sand-rgb),.8);font-size:1.0625rem;margin-bottom:var(--lg)}
.blog-cta__actions{display:flex;justify-content:center;gap:var(--sm);flex-wrap:wrap}

/* INSIGHTS HERO v2 – split layout: ways in + featured info pack */
.blog-hero--split{padding:var(--xl) var(--md) var(--lg)}
.blog-hero__grid{position:relative;z-index:1;max-width:1060px;margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;gap:var(--lg);align-items:center}
.blog-hero--split .blog-hero__copy{text-align:left}
.blog-hero--split h1{font-size:clamp(2rem,4vw,2.75rem)}
.blog-hero--split .blog-hero__sub{margin:0 0 var(--md);max-width:520px}
.blog-ways{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.625rem;max-width:460px}
.blog-ways__link{display:grid;grid-template-columns:5.5rem 1fr auto;align-items:center;gap:var(--sm);padding:.875rem 1.125rem;border:1.5px solid rgba(var(--sand-rgb),.25);border-radius:8px;color:var(--white);text-decoration:none;font-family:var(--font-ui);transition:background .2s ease,border-color .2s ease}
.blog-ways__link:hover{background:rgba(var(--white-rgb),.1);border-color:rgba(var(--sand-rgb),.5)}
.blog-ways__label{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--jade-lt)}
.blog-ways__text{font-size:.9375rem;font-weight:600}
.blog-pack{background:var(--sand);color:var(--char);border-radius:12px;padding:var(--md);box-shadow:var(--sh2)}
.blog-pack__tag{display:block;font-family:var(--font-ui);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--jade);margin-bottom:var(--sm)}
.blog-pack__body{display:grid;grid-template-columns:42% 1fr;gap:var(--sm);align-items:start}
.blog-pack__cover{width:100%;height:auto;display:block;border-radius:6px;border:1px solid var(--sand-dk);box-shadow:var(--sh)}
.blog-pack__title{font-family:var(--font-display);font-size:1.25rem;font-weight:700;line-height:1.25;color:var(--char);margin-bottom:.5rem}
.blog-pack__text p{font-family:var(--font-prose);font-size:.875rem;line-height:1.6;color:var(--wgray);margin-bottom:.5rem}
.blog-pack__meta{display:block;font-family:var(--font-ui);font-size:.8125rem;color:var(--wgray);margin-bottom:var(--sm)}
.blog-pack__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sm)}
.blog-pack .btn--hero{background:var(--jade);color:var(--white);padding:.75rem 1.5rem;font-size:.9375rem}
.blog-pack__all{font-family:var(--font-ui);font-size:.875rem;font-weight:600;color:var(--jade);text-decoration:none}
.blog-hero__scroll{position:relative;z-index:1;display:block;width:max-content;margin:var(--lg) auto 0;font-family:var(--font-ui);font-size:.875rem;font-weight:600;color:rgba(var(--sand-rgb),.8);text-decoration:none}
.blog-hero__scroll:hover{color:var(--white)}
.blog-list__title{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:var(--char);margin-bottom:var(--md);scroll-margin-top:6rem}
.blog-list__title + .blog-item{padding-top:0}
@media(max-width:1024px){
  .blog-hero__grid{grid-template-columns:1fr;gap:var(--md)}
  .blog-ways{max-width:none}
}
@media(max-width:767px){
  .blog-hero--split{padding:var(--lg) 20px var(--md)}
  .blog-ways__link{grid-template-columns:1fr auto;padding:.75rem .875rem;gap:.125rem .5rem}.blog-ways__label{grid-column:1}.blog-ways__text{grid-column:1}.blog-ways__link .arrow{grid-column:2;grid-row:1/3}
  .blog-pack{padding:var(--sm)}
  .blog-pack__body{grid-template-columns:1fr}
  .blog-pack__cover{max-width:220px}
  .blog-pack__actions{flex-direction:column;align-items:stretch}
  .blog-pack .btn--hero{width:100%;min-height:52px;font-size:1rem;text-align:center}
  .blog-pack__all{text-align:center}
}

/* INSIGHTS HERO v3 – arrow chips + featured-pack button hover */
.blog-arrow{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;font-size:0;line-height:0;border:1.5px solid rgba(var(--sand-rgb),.35);color:var(--white);transition:background .2s ease,border-color .2s ease,color .2s ease,transform .25s ease}
.blog-arrow::before{content:'';width:1rem;height:1rem;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
.blog-arrow--down{transform:rotate(90deg)}
.blog-ways__link:hover .blog-arrow{background:var(--jade-lt);border-color:var(--jade-lt);color:var(--jade-deep)}
.blog-ways__link:hover .blog-arrow:not(.blog-arrow--down){transform:translateX(3px)}
.blog-ways__link:hover .blog-arrow--down{transform:rotate(90deg) translateX(3px)}
.blog-hero__scroll{display:flex;flex-direction:column;align-items:center;gap:.5rem}
.blog-hero__scroll:hover .blog-arrow{background:var(--jade-lt);border-color:var(--jade-lt);color:var(--jade-deep);transform:rotate(90deg) translateX(3px)}
.blog-pack__all{display:inline-flex;align-items:center;gap:.5rem}
.blog-pack__all .blog-arrow{width:1.75rem;height:1.75rem;border-color:var(--jade);color:var(--jade)}
.blog-pack__all .blog-arrow::before{width:.875rem;height:.875rem}
.blog-pack__all:hover .blog-arrow{background:var(--jade);color:var(--white);transform:translateX(3px)}
.blog-pack .btn--hero,.blog-pack .btn--hero:hover,.blog-pack .btn--hero:focus-visible{color:var(--white)}
.blog-pack .btn--hero:hover{background:var(--jade-dk)}
@media(max-width:767px){
  .blog-pack__all{justify-content:center}
}
.blog-ways__link:hover,.blog-ways__link:focus-visible{color:var(--white)}
.blog-ways__link:hover .blog-ways__label{color:var(--jade-lt)}
.blog-ways__link:focus-visible{outline:2px solid var(--jade-lt);outline-offset:2px}
.blog-hero__scroll:hover,.blog-hero__scroll:focus-visible{color:var(--white)}
.blog-pack__all:hover{color:var(--jade-dk)}

/* INSIGHTS HERO – R1 character beside the featured pack (unlabelled link, no hover cue) */
.blog-hero__r1{position:relative;isolation:isolate;display:block;width:min(143px,60%);margin:var(--md) auto 0;cursor:default;border-radius:12px;-webkit-tap-highlight-color:transparent}
.blog-hero__r1::before{content:'';position:absolute;z-index:-1;left:50%;top:52%;width:122%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:rgba(var(--jade-lt-rgb),.14)}
.blog-hero__r1:focus-visible{outline:2px solid var(--jade-lt);outline-offset:4px}
@media(min-width:1360px){
  .blog-hero__grid{max-width:1340px;grid-template-columns:1.05fr 1.5fr}
  .blog-hero__pack-wrap{display:flex;align-items:flex-end;gap:var(--md)}
  .blog-hero__pack-wrap .blog-pack{flex:1 1 0;min-width:0}
  .blog-hero__r1{flex:0 0 auto;width:206px;margin:0}
}