.generic-content{background:#fffefa;padding:5rem 1.5rem}.cms-article{max-width:860px;margin:auto;color:#262c2b;font:500 1rem/1.7 Poppins,sans-serif}.cms-article h2,.cms-article h3{margin:2.2rem 0 .8rem;line-height:1.25}.cms-article p,.cms-article ul{margin:0 0 1.2rem}.cms-article img{display:block;max-width:100%;height:auto;margin:2rem auto;border-radius:1rem}.cms-article a{text-decoration:underline}.cms-article h1{font-size:2rem}
@media (max-width:1200px){body[data-page="article"] main{padding-top:4.0625rem}}

/* The seasonal pages use the shared overlay header. Keep their introduction
   clear of it, and place the supplied banner above the text where present. */
body[data-page="article"] .gbg-seasonal > .wrap:first-child{padding-top:8rem}
body[data-page="article"] .gbg-seasonal:has(> .hero-image){display:flex;flex-direction:column}
body[data-page="article"] .gbg-seasonal:has(> .hero-image) > .hero-image{order:-1;width:100%;height:30rem;aspect-ratio:auto;object-fit:cover;object-position:center}
body[data-page="article"] .gbg-seasonal:has(> .hero-image) > .wrap{width:100%}
body[data-page="article"] .gbg-seasonal:has(> .hero-image) > .wrap:first-child{padding-top:3.5rem}
body[data-page="article"]:has(.gbg-seasonal > .hero-image) .site-header:not(.is-sticky){background:rgb(0 0 0 / 40%)}
@media (max-width:1200px){
  body[data-page="article"] .gbg-seasonal > .wrap:first-child{padding-top:4rem}
  body[data-page="article"]:has(.gbg-seasonal > .hero-image) main{padding-top:0}
}
@media (max-width:680px){
  body[data-page="article"] .gbg-seasonal:has(> .hero-image) > .hero-image{height:22rem}
  body[data-page="article"] .gbg-seasonal:has(> .hero-image) > .wrap:first-child{padding-top:2.375rem}
}

/* Bring CMS articles into the same type and spacing system as the designed pages. */
body[data-page="article"]:not([data-seasonal-layout]) .hero{
  background-color:#292824;
}
body[data-page="article"]:not([data-seasonal-layout]) .hero:before{
  background:linear-gradient(90deg,rgba(22,22,20,.72),rgba(22,22,20,.32) 72%,rgba(22,22,20,.2));
}
body[data-page="article"]:not([data-seasonal-layout]) .generic-content{
  background:#f7f4ed;
  padding:clamp(64px,7vw,100px) 24px;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article{
  max-width:920px;
  font-size:16px;
  font-weight:400;
  line-height:1.75;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article h2{
  margin:52px 0 20px;
  font:700 clamp(28px,3vw,36px)/1.22 Poppins,sans-serif;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article h2:first-child{
  margin-top:0;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article h3{
  margin:34px 0 14px;
  font:700 clamp(21px,2.2vw,25px)/1.3 Poppins,sans-serif;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article p,
body[data-page="article"]:not([data-seasonal-layout]) .cms-article ul,
body[data-page="article"]:not([data-seasonal-layout]) .cms-article ol{
  max-width:800px;
  margin-bottom:20px;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article > h2:first-child + p{
  font-size:18px;
  line-height:1.65;
}
body[data-page="article"]:not([data-seasonal-layout]) .cms-article img{
  border-radius:18px;
}
body[data-page="article"]:not([data-seasonal-layout]) .seo-supplement .gbg-faq details{
  margin-bottom:10px;
  padding:18px 22px;
  border:1px solid #dedbd4;
  border-radius:12px;
  background:#fff;
}
body[data-page="article"]:not([data-seasonal-layout]) .seo-supplement .gbg-faq summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  list-style:none;
}
body[data-page="article"]:not([data-seasonal-layout]) .seo-supplement .gbg-faq summary::-webkit-details-marker{
  display:none;
}
body[data-page="article"]:not([data-seasonal-layout]) .seo-supplement .gbg-faq summary:after{
  content:"+";
  flex:none;
  font-size:25px;
  font-weight:400;
  line-height:1;
}
body[data-page="article"]:not([data-seasonal-layout]) .seo-supplement .gbg-faq details[open] summary:after{
  content:"−";
}
@media (max-width:680px){
  body[data-page="article"]:not([data-seasonal-layout]) .generic-content{padding:60px 20px}
  body[data-page="article"]:not([data-seasonal-layout]) .cms-article{font-size:15px}
}
