/* Landscape office comparison: preserve the full room and the original flip. */
#then-now .cf-inner{width:min(100%,1520px);padding:90px clamp(24px,6vw,100px) 65px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,5vw,80px)}
#then-now .cf-card{width:100%;aspect-ratio:4/3;perspective:1400px}
#then-now .cf-face{border:6px solid #fffdf5;border-radius:10px;box-shadow:0 24px 60px #4c401b26,0 2px 6px #0002}
#then-now .cf-face i{background-size:contain;background-repeat:no-repeat;background-color:#e6e1d5;filter:none}
#then-now .cf-copy h2{font-size:clamp(32px,3.6vw,58px);line-height:1.05;letter-spacing:-.045em;max-width:15ch}
#then-now .cf-lede{font-size:16px;line-height:1.75}
#then-now .cf-tag{color:#fffaf0;padding:30px 22px 18px;font-size:11px}
#then-now .cf-side{gap:12px}
#then-now .cf-side b{padding:10px 16px;border:1px solid #9c894b44;border-radius:24px}
#then-now .cf-side b.is-on{background:#292b22;color:#f2d333;border-color:#292b22}
@media(max-width:860px){#then-now .cf-inner{grid-template-columns:1fr;padding:76px 24px 55px;gap:20px}#then-now .cf-card{width:min(100%,520px,48svh)}#then-now .cf-copy h2{font-size:clamp(26px,6vw,38px);max-width:20ch}#then-now .cf-lede{font-size:14px;line-height:1.55;margin-top:12px}#then-now .cf-side{margin-top:12px}#then-now .cf-face{border-width:4px}}
