.promo-translation-demo { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(24px, 4vw, 70px); padding: clamp(38px, 6vw, 88px) max(24px, calc((100vw - 1460px)/2)); background: #153b2e; color: #f7f2e8; }
.promo-translation-demo .demo-kicker { margin: 0 0 12px; color: #d8f06b; font: 800 12px/1.3 ui-monospace, Consolas, monospace; letter-spacing: .11em; text-transform: uppercase; }
.promo-translation-demo h2 { margin: 0 0 17px; max-width: 16ch; font: 800 clamp(30px, 3.3vw, 56px)/1.07 "Bricolage Grotesque", Inter, sans-serif; }
.promo-translation-demo .demo-intro { margin: 0; max-width: 44ch; color: #c4ddcf; font: 18px/1.55 Inter, sans-serif; }
.promo-translation-demo .demo-card { padding: clamp(17px, 2.5vw, 28px); border: 1px solid #4a7660; border-radius: 20px; background: #f9f6ed; color: #183c2e; box-shadow: 0 16px 42px #081f1866; }
.promo-translation-demo .demo-original { padding: 8px 10px 20px; }
.promo-translation-demo .demo-translation { padding: 16px 18px; border: 1px solid #a8d1c2; border-inline-start: 5px solid #438f75; border-radius: 12px; background: #e2f1ed; }
.promo-translation-demo .demo-card strong { display: block; margin-bottom: 9px; color: #2e725b; font: 850 11px/1.3 ui-monospace, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.promo-translation-demo .demo-card p { margin: 0; color: #1c352a; font: 600 20px/1.5 Inter, sans-serif; }
.promo-translation-demo .demo-note { display: block; margin-top: 13px; color: #607269; font: 12px/1.4 Inter, sans-serif; }
@media(max-width:760px) { .promo-translation-demo { grid-template-columns: 1fr; } .promo-translation-demo h2 { max-width: none; } }