#compatibility{padding:0;background:#069bd8;overflow:visible}
.compat-pin{position:relative}.compat-track{width:100%}
.compat-panel{min-height:100svh;padding:110px max(6vw,24px) 32px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;gap:25px 6vw;align-items:center;box-sizing:border-box;color:#142820}
.compat-blue{background:#069bd8}.compat-red{background:#ed6f4c}
.compat-copy h2{font-size:clamp(36px,4.4vw,62px);line-height:1.45;letter-spacing:-.04em;margin:0 0 32px}
.compat-copy h3{font-size:clamp(28px,3vw,44px);line-height:1.3;margin:0 0 16px;letter-spacing:-.03em}
.compat-copy p{font-size:17px;line-height:1.9;color:#142820}
.compat-photo{width:min(42vw,66svh,620px);justify-self:center;border-radius:50%;overflow:hidden;background:#f0f3f4;box-shadow:0 18px 60px #11282018}
.compat-photo img{display:block;width:100%;height:auto;transform:rotate(var(--compat-angle,-10deg));transition:none}
.compat-red .compat-photo img{transform:rotate(var(--compat-angle,10deg))}
.compat-note{grid-column:1/-1;font-size:13px;line-height:1.7;max-width:800px;margin:0;color:#142820}
#compatibility.horizontal-enabled{height:270svh}
.horizontal-enabled .compat-pin{position:sticky;top:0;height:100svh;overflow:hidden}
.horizontal-enabled .compat-track{display:flex;height:100%;transform:translate3d(calc(-100% * var(--compat-shift,0)),0,0);will-change:transform}
.horizontal-enabled .compat-panel{flex:0 0 100%;width:100%;height:100%;min-height:0}
@media(max-width:760px){.compat-panel{padding:85px 24px 24px;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;gap:18px;align-items:center}.compat-copy h2{font-size:30px;line-height:1.35;margin:0 0 16px}.compat-copy h3{font-size:26px;margin-bottom:8px}.compat-copy p{font-size:15px;line-height:1.6}.compat-copy p br{display:none}.compat-photo{width:min(76vw,38svh);max-width:370px}.compat-note{font-size:12px;line-height:1.6}.compat-panel:not(:first-child){scroll-margin-top:64px}}
@media(max-height:680px) and (min-width:761px){.compat-panel{padding-top:90px;gap:15px 5vw}.compat-copy h2{font-size:34px;margin-bottom:20px}.compat-photo{width:min(38vw,58svh)}}
@media(prefers-reduced-motion:reduce){.compat-photo img,.compat-red .compat-photo img{transform:none}}
