/* V4.18: contain every tool illustration within its own reserved area. */
.knowledgeTools .knowledgeCard{min-width:0}
.knowledgeTools .guideIllustration{display:flex;align-items:center;justify-content:center;overflow:hidden;min-width:0;min-height:0;isolation:isolate}
.knowledgeTools .guideIllustration img{display:block;flex:0 1 auto;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;object-position:center;filter:drop-shadow(0 7px 9px rgba(49,60,47,.10))}
.knowledgePage .knowledgeHero{isolation:isolate}
.knowledgePage .knowledgeHero > :is(.layoutKicker,h1,p){position:relative;z-index:2}
[data-theme="meadow"] .knowledgePage .knowledgeHero::after{content:none}
@media(max-width:760px){.knowledgeTools .guideIllustration{height:clamp(164px,48vw,230px)}}
/* The guide illustrations sit within the hero, leaving the actual heading and introduction readable. */
.knowledgePage .knowledgeHero{min-height:312px;display:flex;flex-direction:column;justify-content:center;padding-right:clamp(330px,42%,570px)}
.knowledgePage .knowledgeHero .knowledgeHeroScene{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:right center;pointer-events:none}
.knowledgePage .knowledgeHero{--guide-veil-rgb:246,237,220}
[data-theme="natural"] .knowledgePage .knowledgeHero{--guide-veil-rgb:239,246,242}
[data-theme="meadow"] .knowledgePage .knowledgeHero{--guide-veil-rgb:250,247,234}
.knowledgePage .knowledgeHero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(var(--guide-veil-rgb),.96) 0%,rgba(var(--guide-veil-rgb),.91) 27%,rgba(var(--guide-veil-rgb),.77) 45%,rgba(var(--guide-veil-rgb),.32) 58%,transparent 73%)}
.knowledgePage .knowledgeHero h1{max-width:13ch;line-height:1.1}
.knowledgePage .knowledgeHero p{max-width:47ch}
[data-theme="earth"] .knowledgeHero .knowledgeHeroScene{opacity:.84}
[data-theme="natural"] .knowledgeHero .knowledgeHeroScene{opacity:.80}
[data-theme="meadow"] .knowledgeHero .knowledgeHeroScene{opacity:1}
@media(max-width:760px){.knowledgePage .knowledgeHero{min-height:355px;justify-content:flex-start;padding-right:clamp(22px,6vw,36px);padding-bottom:155px}.knowledgePage .knowledgeHero h1{max-width:18ch}.knowledgePage .knowledgeHero p{max-width:42ch}.knowledgePage .knowledgeHero .knowledgeHeroScene{object-position:73% center}.knowledgePage .knowledgeHero::before{background:linear-gradient(180deg,rgba(var(--guide-veil-rgb),.97) 0%,rgba(var(--guide-veil-rgb),.94) 29%,rgba(var(--guide-veil-rgb),.78) 45%,rgba(var(--guide-veil-rgb),.26) 62%,transparent 79%)}}
@media(max-width:450px){.knowledgePage .knowledgeHero{min-height:385px;padding-bottom:142px}}