/* Resource entrance only; article and FAQ layouts remain independent. */
.resource-banner{--rb-green:#0b5a33;--rb-ink:#0b2636;--rb-soft:#edf4ee;--rb-line:#cbd9d0;margin:0!important;padding:0!important;background:var(--rb-soft);border-bottom:1px solid var(--rb-line);isolation:isolate;overflow:hidden}
.resource-banner .rb-stage{display:grid;width:100%;max-width:1920px;margin-inline:auto}
.resource-banner .resource-case-study{margin:0!important;padding:46px clamp(24px,5vw,80px) 70px!important;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,5vw,80px);min-height:460px;align-items:center;background:transparent;border:0;border-radius:0;box-shadow:none}
.resource-banner[data-banner-ready] .resource-case-study{grid-area:1/1;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 360ms ease}
.resource-banner[data-banner-ready] .resource-case-study.is-active{opacity:1;visibility:visible;pointer-events:auto}
.resource-banner .resource-case-study>div{max-width:660px;width:100%;justify-self:start}
.resource-banner .resource-case-study .eyebrow{margin:0 0 16px;color:var(--rb-green);font-size:12px;font-weight:700;letter-spacing:.1em}
.resource-banner .resource-case-study h2{max-width:23ch;margin:0 0 22px;color:var(--rb-ink);font-family:inherit;font-size:clamp(30px,3.2vw,48px);font-weight:600;letter-spacing:-.035em;line-height:1.13;text-wrap:balance}
.resource-banner .resource-case-study>div>p:not(.eyebrow){max-width:56ch;margin:0 0 22px;color:#4c6256;font-size:16px;line-height:1.7}
.resource-banner .resource-case-study a{display:inline-flex;align-items:center;gap:20px;min-height:46px;margin:4px 0 0;padding:12px 22px;border-radius:5px;background:var(--rb-green);color:#fff;text-decoration:none;font-size:14px;font-weight:650}
.resource-banner .resource-case-study img{display:block;width:100%;height:350px;max-height:none;aspect-ratio:auto;object-fit:contain;background:#fff;border-radius:8px;box-shadow:none}
.resource-banner{position:relative}
.resource-banner .rb-pagination{position:absolute;left:clamp(24px,5vw,80px);bottom:14px;display:flex;align-items:center;gap:7px;z-index:2}
.resource-banner .rb-pagination button{display:grid;width:44px;height:44px;padding:0;place-items:center;border:0;background:transparent;cursor:pointer}
.resource-banner .rb-pagination button span{display:block;width:24px;height:7px;border-radius:999px;background:#acc4b5;transform:scaleX(.3);transition:transform 180ms ease,background 180ms ease}
.resource-banner .rb-pagination button[aria-selected="true"] span{background:var(--rb-green);transform:scaleX(1)}
.resource-banner button:focus-visible,.resource-banner a:focus-visible{outline:3px solid #c08032;outline-offset:3px}
.resource-banner:not([data-banner-ready]) .rb-pagination{display:none}
.resource-banner .rb-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* The stage owns the desktop width cap; never apply viewport-based padding inside it. */
@media(min-width:1500px){.resource-banner .resource-case-study{padding-inline:76px!important}.resource-banner .resource-case-study img{max-width:660px;height:clamp(350px,24vw,460px);justify-self:end}.resource-banner .rb-pagination{left:max(76px,calc((100% - 1920px)/2 + 76px))}}
@media(max-width:820px){.resource-banner .resource-case-study{grid-template-columns:1fr 0.8fr;gap:24px;padding:32px 24px 64px!important;min-height:430px}.resource-banner .resource-case-study img{height:290px}.resource-banner .resource-case-study h2{font-size:32px}}
@media(max-width:600px){.resource-banner .resource-case-study{grid-template-columns:1fr;gap:24px;padding:28px 20px 62px!important;min-height:0;align-content:start}.resource-banner .resource-case-study h2{font-size:29px;max-width:none;margin-bottom:15px}.resource-banner .resource-case-study>div>p:not(.eyebrow){font-size:14px;line-height:1.65;margin-bottom:14px}.resource-banner .resource-case-study img{height:230px}.resource-banner .resource-case-study a{font-size:13px}.resource-banner .rb-pagination{left:20px;bottom:8px}}
@media(prefers-reduced-motion:reduce){.resource-banner .resource-case-study,.resource-banner .rb-pagination span{transition:none!important}}

/* Keep the umbrella types guide reachable while another banner slide is shown. */
.resource-banner .rb-types-shortcut{position:absolute;right:clamp(24px,5vw,80px);bottom:20px;z-index:3;display:inline-flex;align-items:center;min-height:30px;color:var(--rb-green);font-size:13px;font-weight:700;line-height:1.2;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
@media(min-width:1500px){.resource-banner .rb-types-shortcut{right:max(76px,calc((100% - 1920px)/2 + 76px))}}
@media(max-width:600px){.resource-banner .rb-types-shortcut{right:20px;bottom:14px;font-size:12px}}

/* Before carousel enhancement, keep one stable row with native access to all guides.
   The same four cards determine the stage height before and after enhancement. */
.resource-banner:not([data-banner-ready]) .rb-stage{display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none}
.resource-banner:not([data-banner-ready]) .rb-stage::-webkit-scrollbar{display:none}
.resource-banner:not([data-banner-ready]) .resource-case-study{box-sizing:border-box;flex:0 0 100%;min-width:0;scroll-snap-align:start}