/* Product recordings retain their full screen ratio: never crop the interface. */
.btn.btn--robin { background: #397f73; border-color: #397f73; color: #fff; }
.btn.btn--robin:hover { background: #2c6b5e; border-color: #2c6b5e; color: #fff; }
.link--robin { color: #397f73; }
.link--robin:hover { color: #2c6b5e; }
.robin-feature { border-top: 1px solid var(--rule); }
.robin-feature-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.4fr); align-items: center; gap: clamp(30px,5vw,72px); }
.robin-feature-copy .eyebrow { color: var(--blue); margin-bottom: 22px; }
.robin-feature-copy .headline { font-size: clamp(34px,3.5vw,52px); }
.robin-feature-copy p:not(.eyebrow) { color: var(--ink-2); margin-top: 22px; max-width: 49ch; }
.robin-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 26px; margin-top: 28px; }
.robin-recording { min-width: 0; }
.robin-recording video { width: 100%; height: auto; object-fit: contain; border: 1px solid var(--rule); border-radius: 10px; background: #f6f4ef; }
.robin-page-hero .page-hero-title { grid-column: 1/7; }
.robin-page-hero .page-hero-aside { grid-column: 8/13; align-self: center; }
.robin-page-hero .page-hero-aside .t-body { max-width: 48ch; }
.robin-demos { padding-block: 52px 72px; }
.robin-demo + .robin-demo { margin-top: 56px; }
.robin-demo-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.robin-demo-heading h2 { font-size: clamp(27px,3vw,40px); }
.robin-demo-heading p { max-width: 46ch; color: var(--ink-2); font-size: 14px; }
.robin-demo .robin-recording { max-width: 1080px; margin-inline: auto; }
.robin-closing { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 42px; padding-top: 30px; border-top: 1px solid var(--rule); }
.robin-closing p { color: var(--ink-2); max-width: 56ch; }
@media(max-width:800px) {
 .robin-feature-grid { grid-template-columns: 1fr; }
 .robin-page-hero .page-hero-title,.robin-page-hero .page-hero-aside { grid-column: 1/-1; }
 .robin-page-hero .page-hero-aside { margin-top: 28px; }
 .robin-demo-heading { display: block; }
 .robin-demo-heading p { margin-top: 14px; }
 .robin-demos { padding-block: 36px 48px; }
 .robin-demo + .robin-demo { margin-top: 38px; }
}