
/* the form panel and the agenda carry their own ink rule: no chapter rule above them */
.ent-demo-page .ent-chapter{border-top:0;padding-top:0}

/* h1: the break after "data" is forced from 640px (a one-word second line reads as an accident), except in the 900-959
   window: the title steps up to 61px there and its first line (about 784px) is as wide as the 11 columns it may use at
   900-930px, so "data" would drop alone onto a line. In that window the title wraps by itself (two lines at any width) */
.ent-demo-l1{display:inline}
@media(min-width:640px){.ent-demo-l1{display:block}}
@media(min-width:900px) and (max-width:959px){.ent-demo-l1{display:inline}}

/* the left column: the lead sentence, what happens in the call, the questions */
.ent-demo-lead{margin:0;max-width:34em;text-wrap:pretty}
.ent-demo-agenda{padding-bottom:48px}
.ent-demo-h{margin:0 0 16px;color:var(--ink)}
.ent-demo-agenda .ent-steps{margin-top:0}
.ent-demo-faq .ent-acc{margin-top:0;border-top:1px solid var(--ink)}
.ent-demo-agenda .ent-step{padding-top:16px;padding-bottom:24px}
.ent-demo-agenda .ent-step-t{font-size:20px;line-height:1.25;word-spacing:.08em}
.ent-demo-agenda .ent-step-b{margin-top:8px}
.ent-demo-agenda .ent-step-n{padding-top:3px}

/* the form */
.ent-demo-intro{margin:0 0 24px;max-width:44ch;font-size:15px;line-height:1.5;color:var(--ink-2)}
.ent-demo-cap{display:grid;gap:8px;justify-items:start}
.ent-demo-cap .ent-small{margin:0}
.ent-demo-act{display:grid;gap:16px}

/* a focused control is never left under the sticky header (the first invalid field takes focus on submit) */
.ent-demo-panel :is(input,select),.ent-demo-panel .ent-fs-msg{scroll-margin-top:96px;scroll-margin-bottom:24px}
/* the two optional selects have long labels ("How do you plan to integrate? Optional" is about 245px): side by side only
   where the panel is wide enough (from the wide step), and bottom-aligned, so a label that wraps (a fallback font, a
   zoomed page) pushes its own label up and never its control down */
@media(min-width:900px) and (max-width:1199px){.ent-demo-panel .ent-demo-row-opt{grid-template-columns:minmax(0,1fr)}}
.ent-demo-panel .ent-demo-row-opt{align-items:end}

/* after sending: the status, then the booking frame (Cal.com, light theme) */
.ent-demo-cal{display:block;width:100%;min-height:580px;margin-top:24px;border:1px solid var(--rule-1);border-radius:2px;background:var(--white)}


              @keyframes shimmer {
                0% { left: -100%; }
                100% { left: 100%; }
              }
            