:root{
  --red:#E4181B;
  --red-deep:#B30E12;
  --red-glow:rgba(228,24,27,.42);
  --ink:#16110F;
  --ink-soft:#4a4543;
  --paper:#fff;
  --grey:#ECEBEA;
  --grey-line:#E2E0DE;
  --beige:#EFEBE6;
  --nav-h:78px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --bezier-out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{font-family:'Archivo',system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
.wrap{width:min(1320px,92vw);margin-inline:auto;}
.pad{padding-block:clamp(5rem,9vw,8rem);}
.eyebrow{font-weight:700;font-size:.72rem;text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:.7em;letter-spacing:.18em;}
.eyebrow:before{content:"";width:26px;height:2px;background:var(--red);display:inline-block;}
.eyebrow.light{color:#fff;}
.eyebrow.light:before{background:#fff;}

.resources-hero{
  padding-top:calc(var(--nav-h) + 4rem);
  padding-bottom:clamp(3.5rem,7vw,6rem);
  background:var(--paper);
}
.resources-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.65fr);
  gap:clamp(2.5rem,7vw,6rem);
  align-items:end;
}
.resources-hero h1,
.article-hero h1{
  font-family:'Jost';
  font-weight:700;
  text-transform:uppercase;
  font-size:clamp(3.2rem,8vw,7.4rem);
  line-height:.9;
  margin-top:1.2rem;
}
.resources-hero h1 span,
.article-hero h1 span{color:var(--red);}
.resources-intro{
  color:var(--ink-soft);
  font-size:1.08rem;
  max-width:42ch;
}
.resource-mosaic{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:clamp(62px,5vw,86px);
  gap:.7rem;
  margin-top:1.35rem;
}
.resource-mosaic figure{
  overflow:hidden;
  background:var(--grey);
  border:1px solid var(--grey-line);
}
.resource-mosaic figure:nth-child(2){grid-column:4/7;grid-row:1/3;}
.resource-mosaic figure:nth-child(3){grid-column:1/3;grid-row:3/5;}
.resource-mosaic .mosaic-large{grid-column:1/4;grid-row:1/3;}
.resource-mosaic .mosaic-wide{grid-column:3/7;grid-row:3/5;}
.resource-mosaic img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.resources-index{background:var(--beige);padding-block:clamp(3.25rem,6vw,5rem);}
.resources-section + .resources-section{margin-top:clamp(2.4rem,4.5vw,4rem);}
.resources-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,36ch);
  gap:clamp(2rem,5vw,4rem);
  align-items:end;
  margin-bottom:2rem;
}
.resources-head h2{
  font-family:'Jost';
  font-weight:700;
  text-transform:uppercase;
  font-size:clamp(2.2rem,5vw,4.6rem);
  line-height:.92;
  margin-top:.8rem;
}
.resources-head p{color:var(--ink-soft);}
.resource-tag-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.6rem;
}
.resource-tag-list span,
.resource-category{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--grey-line);
  background:#fff;
  color:var(--red);
  padding:.55rem .75rem;
  font-size:.64rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.14em;
  line-height:1;
}
.resource-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.3rem;
  background:none;
  border:0;
}
.resource-card{
  min-height:430px;
  background:#fff;
  padding:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  border:1px solid var(--grey-line);
  transition:transform .35s var(--bezier-out),box-shadow .35s var(--ease);
}
.resource-card:hover{
  transform:translateY(-4px);
  box-shadow:0 28px 70px -54px rgba(22,17,15,.65);
}
.resource-card-figure{
  aspect-ratio:4/3;
  overflow:hidden;
  background:var(--grey);
}
.resource-card-figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .8s var(--bezier-out);
}
.resource-card:hover .resource-card-figure img{transform:scale(1.04);}
.resource-card > div:not(.resource-card-bottom){
  padding:1.45rem 1.45rem 0;
}
.resource-card-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  margin-bottom:1.15rem;
}
.resource-type,
.resource-read{
  font-size:.66rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.resource-type{display:block;color:var(--ink-soft);margin-bottom:.65rem;}
.resource-read{color:var(--ink-soft);}
.resource-card h3{
  font-family:'Jost';
  font-size:1.55rem;
  line-height:1;
  text-transform:uppercase;
  margin-bottom:.9rem;
}
.resource-card p{color:var(--ink-soft);}
.resource-card-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  border-top:1px solid var(--grey-line);
  padding-top:1rem;
  margin:auto 1.45rem 1.45rem;
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.resource-card-bottom span:last-child{
  color:var(--red);
  font-size:1rem;
  letter-spacing:0;
}
.resources-note{
  background:var(--ink);
  color:#fff;
}
.resources-note-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.8fr);
  gap:clamp(2.5rem,6vw,5rem);
  align-items:start;
}
.resources-note h2{
  font-family:'Jost';
  font-weight:700;
  text-transform:uppercase;
  font-size:clamp(2.4rem,5.5vw,5rem);
  line-height:1;
  margin-top:1rem;
}
.resources-note h2 span{
  color:var(--red);
  display:inline-block;
  margin-top:.08em;
}
.resource-checks{
  display:grid;
  gap:1px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.16);
}
.resource-check{
  background:#fff;
  color:var(--ink);
  padding:1.35rem;
}
.resource-check b{
  display:block;
  font-family:'Jost';
  text-transform:uppercase;
  font-size:1.15rem;
  line-height:1;
  margin-bottom:.45rem;
}
.resource-check p{color:var(--ink-soft);}
.article-hero{
  padding-top:calc(var(--nav-h) + 4rem);
  padding-bottom:clamp(3rem,6vw,5rem);
  background:var(--beige);
}
.article-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(340px,.72fr);
  gap:clamp(2rem,6vw,5rem);
  align-items:end;
}
.article-hero-grid > *,
.article-layout > *{
  min-width:0;
}
.article-image{
  overflow:hidden;
  background:#fff;
  border:1px solid var(--grey-line);
}
.article-image img{
  width:100%;
  height:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.article-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  margin-top:1.4rem;
}
.article-meta span{
  border:1px solid var(--grey-line);
  background:#fff;
  padding:.65rem .9rem;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.article-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:1rem;
}
.article-tags span{
  display:inline-flex;
  background:#fff;
  border:1px solid var(--grey-line);
  color:var(--red);
  padding:.55rem .75rem;
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.article-body{background:#fff;}
.article-layout{
  display:grid;
  grid-template-columns:minmax(220px,.35fr) minmax(0,.75fr);
  gap:clamp(2rem,6vw,5rem);
}
.article-sidebar{
  position:sticky;
  top:calc(var(--nav-h) + 1rem);
  align-self:start;
}
.article-sidebar a{
  display:inline-flex;
  color:var(--red);
  font-weight:800;
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.article-content .lede{
  font-size:1.28rem;
  color:var(--ink);
  margin-bottom:2.6rem;
}
.article-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin:0 0 2.4rem;
}
.article-gallery figure{
  border:1px solid var(--grey-line);
  background:#fff;
}
.article-gallery img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.article-gallery figcaption{
  padding:1rem;
  color:var(--ink-soft);
  font-size:.9rem;
}
.article-section-figure{
  margin:1.8rem 0 .4rem;
  border:1px solid var(--grey-line);
  background:#fff;
}
.article-section-figure img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.article-section-figure.contain img{
  aspect-ratio:1149/1369;
  object-fit:contain;
}
.article-section-figure figcaption{
  padding:1rem;
  color:var(--ink-soft);
  font-size:.9rem;
}
.article-section{
  border-top:1px solid var(--grey-line);
  padding-top:1.8rem;
  margin-top:1.8rem;
}
.article-section h2{
  font-family:'Jost';
  text-transform:uppercase;
  font-size:2rem;
  line-height:1;
  margin-bottom:.8rem;
}
.article-section p{color:var(--ink-soft);margin-top:.9rem;}
.article-section a,
.article-links a{
  color:var(--red);
  font-weight:700;
}
.article-info-graphic,
.article-related,
.article-links{
  border-top:1px solid var(--grey-line);
  margin-top:2.4rem;
  padding-top:2rem;
}
.article-info-graphic h2,
.article-related h2,
.article-links h2{
  font-family:'Jost';
  text-transform:uppercase;
  font-size:2rem;
  line-height:1;
}
.info-loop{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--grey-line);
  border:1px solid var(--grey-line);
  margin-top:1.4rem;
}
.info-step{
  background:var(--beige);
  padding:1.2rem;
}
.info-step span{
  display:block;
  font-family:'Jost';
  font-weight:300;
  font-size:2rem;
  color:var(--red);
  line-height:1;
}
.info-step b{
  display:block;
  font-family:'Jost';
  text-transform:uppercase;
  line-height:1;
  margin:.8rem 0 .55rem;
}
.info-step p{color:var(--ink-soft);}
.related-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--grey-line);
  border:1px solid var(--grey-line);
  margin-top:1.4rem;
}
.related-card{
  background:#fff;
  padding:1.3rem;
}
.related-card.addon{background:var(--beige);}
.related-card span{
  color:var(--red);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.related-card b{
  display:block;
  font-family:'Jost';
  text-transform:uppercase;
  font-size:1.35rem;
  line-height:1;
  margin:.6rem 0;
}
.related-card p{color:var(--ink-soft);}
.article-links a{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  border-top:1px solid var(--grey-line);
  padding:1rem 0;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.82rem;
}
.article-links h2{margin-bottom:.8rem;}

@media(max-width:1000px){
  .resource-grid{grid-template-columns:repeat(2,1fr);}
  .info-loop{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:900px){
  .resources-hero-grid,
  .resources-head,
  .resources-note-grid,
  .article-hero-grid,
  .article-layout{
    grid-template-columns:1fr;
  }
  .article-sidebar{position:static;}
  .article-gallery,.related-grid{grid-template-columns:1fr;}
}

@media(max-width:620px){
  .resources-hero .wrap{
    width:min(350px,calc(100vw - 40px));
    margin-left:20px;
    margin-right:auto;
  }
  .resources-hero h1{
    max-width:100%;
    font-size:clamp(2.35rem,11vw,3rem);
    line-height:.95;
    overflow-wrap:anywhere;
    word-break:break-word;
    text-wrap:balance;
  }
  html[lang="es-ES"] .resources-hero h1{
    font-size:clamp(2.05rem,9.4vw,2.35rem);
  }
  html[lang="fr-FR"] .resources-hero h1{
    font-size:clamp(2rem,9.2vw,2.35rem);
  }
  html[lang="de-DE"] .resources-hero h1{
    font-size:clamp(2rem,9.2vw,2.35rem);
  }
  html[lang="ko-KR"] .resources-hero h1{
    font-size:clamp(2.05rem,9.5vw,2.45rem);
    word-break:keep-all;
  }
  html[lang="ru-RU"] .resources-hero h1{
    font-size:clamp(1.95rem,8.8vw,2.3rem);
    line-height:1;
  }
  .article-hero .wrap,
  .article-body .wrap{
    width:min(350px,calc(100vw - 40px));
    margin-left:20px;
    margin-right:auto;
  }
  .article-hero h1{
    max-width:10ch;
    font-size:clamp(2.4rem,10vw,3rem);
    line-height:.92;
    text-wrap:balance;
    overflow-wrap:break-word;
  }
  .article-meta span,
  .article-tags span{
    font-size:.6rem;
    letter-spacing:.08em;
  }
  .article-tags{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .article-tags span{
    display:block;
    width:100%;
    text-align:center;
    overflow-wrap:anywhere;
    word-break:break-word;
    white-space:normal;
    min-width:0;
  }
  .article-content .lede,
  .article-section p{
    overflow-wrap:break-word;
  }
  .resource-grid{
    grid-template-columns:1fr;
  }
  .resource-mosaic{grid-auto-rows:70px;gap:.5rem;}
}
