/* Live collaboration: three independent product cards. */
.redlining-intro { padding-bottom:45px; }
.collaborative-redlining { margin-top:58px; --ink:1; }
.redlining-card-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 3px 26px; }
.redlining-card-header>div>span,.redline-ai-explanation>span { font-size:12px; color:#66816c; }
.redlining-card-header h3 { font-size:clamp(26px,2.7vw,38px); letter-spacing:-1.25px; line-height:1.15; margin:10px 0 0; }
.redline-live-badge { display:flex; align-items:center; gap:8px; flex-shrink:0; border:1px solid #d5e1d8; background:#f9fcf7; border-radius:30px; font-size:11px; padding:10px 14px; }
.redline-live-badge i,.redline-device-caption i,.ai-live i { height:6px; width:6px; border-radius:50%; background:#60bd9d; display:inline-block; }
.redline-device-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.redline-device-column { min-width:0; height:590px; position:relative; isolation:isolate; overflow:hidden; border-radius:24px; background:#edf3f1; display:flex; flex-direction:column; box-shadow:0 1px 0 #fff inset; }
.redline-environment { position:absolute; inset:-14px; width:calc(100% + 28px); height:calc(100% + 28px); object-fit:cover; filter:blur(4px) saturate(.9); opacity:1; z-index:-2; }
.device-phone .redline-environment { object-position:37% center; }
.device-tablet .redline-environment { object-position:42% center; }
.device-macbook .redline-environment { object-position:55% center; filter:blur(3px) saturate(.9); opacity:1; }
.redline-device-column:after { display:none; }
.redline-device-copy { background:#f6f8f5; text-align:center; padding:31px 15px 10px; }
.redline-device-copy p { font-size:10px; letter-spacing:.2px; color:#5e7167; margin:0 0 10px; }
.redline-device-copy h4 { font-size:clamp(22px,2vw,29px); letter-spacing:-.85px; line-height:1.14; font-weight:600; margin:0 0 10px; color:#20372e; }
.redline-device-copy>span { font-size:12px; line-height:1.4; color:#64776c; }
.redline-product-stage { display:flex; align-items:center; justify-content:center; flex:1; min-height:0; padding:13px 20px 17px; }
.redline-product { position:relative; width:100%; display:flex; flex-direction:column; align-items:center; }
.redline-device { position:relative; flex-shrink:0; background:linear-gradient(110deg,#b5bcbf 0%,#f4f5f6 15%,#b0b7bb 46%,#e3e6e8 85%,#9ba4aa 100%); border:1px solid #8e999f; box-shadow:0 24px 36px -16px #14282170,0 2px 2px #fff inset,0 0 0 1px #eff2f4; }
.redline-device-screen { position:relative; overflow:hidden; background:#fffefb; border:5px solid #18201f; box-shadow:0 0 0 1px #738078; }
.redline-device.phone { width:184px; border-radius:34px; padding:3px; }
.phone .redline-device-screen { height:369px; border-radius:30px; }
.phone .redline-device-camera { position:absolute; top:13px; left:50%; transform:translateX(-50%); width:55px; height:15px; border-radius:20px; background:#111917; z-index:3; box-shadow:0 1px 1px #ffffff30; }
.phone .redline-device-camera:after { content:''; position:absolute; top:5px; right:7px; width:5px; height:5px; background:radial-gradient(circle at 40% 30%,#203d48,#101c22); border-radius:50%; }
.redline-device.phone:before { content:''; position:absolute; left:-3px; top:85px; width:2px; height:48px; background:linear-gradient(#b4bdc4,#eef1f3,#959ea4); border-radius:2px; box-shadow:0 -23px 0 -0.3px #b5bec4; }
.redline-device.phone:after { content:''; position:absolute; right:-3px; top:105px; width:2px; height:37px; border-radius:2px; background:#aab4bc; }
.phone .redline-device-screen:after { content:''; position:absolute; bottom:5px; left:50%; transform:translateX(-50%); width:65px; height:3px; border-radius:5px; background:#253b32; }
/* Landscape iPad: thin aluminium edge, continuous black bezel and Pencil. */
.redline-device.tablet { width:96%; max-width:320px; padding:2px; border-radius:17px; border-color:#757c81; background:#a4aaaf; box-shadow:0 22px 34px -16px #14282175,0 0 0 1px #d6d9dc; }
.tablet .redline-device-screen { height:auto; aspect-ratio:4/3; border:9px solid #151719; border-radius:14px; box-shadow:none; }
.tablet .redline-device-camera { position:absolute; top:50%; left:6px; width:3px; height:3px; border-radius:50%; background:#34444e; z-index:3; box-shadow:0 0 0 1px #080a0d; }
.redline-device.tablet:before { content:''; position:absolute; right:33px; top:-2px; width:28px; height:2px; background:#62686d; border-radius:2px; }
.device-tablet .redline-product:after { content:''; position:absolute; top:-8px; left:50%; transform:translateX(-50%); width:68%; height:5px; border:1px solid #c9cece; border-radius:5px; background:#f8f9f7; box-shadow:0 2px 3px #18282133; }
/* Internet-sourced 14-inch MacBook Pro bezel; the drawing stays live beneath it.
   Source: jamesjingyi/mockup-device-frames, credited to Apple Design Resources.
   Original screen: x=400, y=300, 3024×1964 in a 3824×2564 image.
   CSS removes the 240px transparent top margin without altering the asset. */
.device-macbook .redline-product { filter:drop-shadow(0 17px 12px #17252035); }
.redline-device.macbook { width:100%; aspect-ratio:3824/2324; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.macbook-product-frame { position:absolute; z-index:2; top:-10.327%; left:0; width:100%; height:auto; max-width:none; pointer-events:none; }
.redline-scroll-story .macbook .redline-device-screen { position:absolute; z-index:1; left:10.46%; top:2.582%; width:79.08%; height:84.51%; aspect-ratio:auto; border:0; border-radius:2.5% 2.5% 0 0; box-shadow:none; container-type:inline-size; }
.redline-screen-title { display:flex; align-items:center; gap:7px; padding:8px 12px; border-bottom:1px solid #e5ebe3; background:#fffefb; }
.redline-screen-title strong { font-size:8px; font-weight:500; color:#3f594a; }
.redline-screen-title>span { font-size:6px; color:#809184; }
.redline-screen-title>i { font-style:normal; font-size:7px; letter-spacing:1px; margin-left:auto; color:#687c70; }
.phone .redline-screen-title { flex-wrap:wrap; gap:5px; padding-top:34px; min-height:66px; }
.phone .redline-screen-title>span { width:100%; order:1; }
.phone .redline-screen-title>i { position:absolute; top:40px; right:12px; }
.redline-drawing { position:absolute; inset:28px 0 34px; overflow:hidden; display:grid; place-items:center; background-color:#fffefb; background-image:radial-gradient(#80928a29 .5px,transparent .5px); background-size:9px 9px; }
.redline-drawing svg { display:block; width:100%; }
.phone .redline-drawing { inset:66px 0 40px; }
.phone .redline-drawing svg { width:430px; max-width:none; position:absolute; left:50%; top:50%; transform:translate(-54%,-50%); }
.tablet .redline-drawing svg { width:100%; height:100%; object-fit:contain; }
.redline-device-tools { position:absolute; left:0; right:0; bottom:0; display:flex; align-items:center; gap:18px; height:33px; padding:6px 12px; border-top:1px solid #e1e9dc; background:#f7faf6; font-size:13px; color:#748a78; }
.phone .redline-device-tools { padding-bottom:13px; height:39px; }
.redline-device-tools .active-pen { display:grid; place-items:center; border-radius:5px; background:#fae8e3; width:19px; height:19px; color:#c44d43; }
.device-save { font-size:6px; margin-left:auto; color:#61816d; white-space:nowrap; }
.device-save i { font-style:normal; margin-right:2px; }
.redline-location { background:#f6f8f5; position:relative; display:flex; align-items:center; gap:9px; padding:16px 23px 22px; margin:0; }
.redline-person { display:grid; place-items:center; flex-shrink:0; height:29px; width:29px; border-radius:50%; background:#e2ece5; color:#4b6652; font-size:11px; border:1px solid #fff; }
.device-macbook .redline-person { background:#e0e9ef; color:#486a81; }
.device-tablet .redline-person { background:#eee6da; color:#736b51; }
.redline-location>div { display:flex; flex-direction:column; gap:4px; }
.redline-location strong { font-size:11px; font-weight:500; color:#2f4d3e; }
.redline-location>div>span { font-size:9px; color:#6c8174; }
.redline-device-caption { display:flex; align-items:center; gap:5px; margin-left:auto; font-size:8px; color:#56765f; }
.redline-device-caption i { width:5px; height:5px; }
.shared-red-ink { stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--ink)); }
.shared-red-note,.shared-live-cursor { opacity:clamp(0,calc(var(--ink)*3 - .2),1); }
.redline-shared-event { display:flex; align-items:center; justify-content:center; gap:9px; padding:26px 12px 23px; font-size:12px; flex-wrap:wrap; color:#627b67; }
.redline-shared-event strong { font-weight:500; color:#324f3c; }
.redline-event-dot { display:inline-block; flex-shrink:0; width:6px; height:6px; border-radius:50%; background:#d45d50; }
.redline-animation-footer { display:flex; justify-content:space-between; gap:15px; align-items:center; padding:15px 3px; border-top:1px solid #d7e0d4; font-size:10px; color:#79917b; }
.redline-animation-footer button,.redline-ai-explanation button { border:0; background:transparent; color:#3c654c; padding:5px 0; font:inherit; font-size:11px; cursor:pointer; }
.redline-animation-footer button:hover,.redline-ai-explanation button:hover { text-decoration:underline; }
.redline-animation-footer button span,.redline-ai-explanation button span { margin-left:14px; }
.redline-animation-footer button:focus-visible,.redline-ai-explanation button:focus-visible { outline:2px solid #60bd9d; outline-offset:7px; }

.redline-ai-section{padding-top:55px}.redline-ai-demo{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(250px,1fr);gap:45px;align-items:center;margin-top:55px}.redline-ai-canvas{min-width:0;background:#fffefb;border:1px solid #d8e3d6;border-radius:20px;overflow:hidden;box-shadow:0 20px 70px #1e3c2e0d}.redline-ai-toolbar{display:flex;align-items:center;justify-content:space-between;padding:17px 21px;gap:20px;border-bottom:1px solid #e1e9dc;background:#f8fbf3}.redline-ai-toolbar strong{font-size:13px;font-weight:500;white-space:nowrap}.redline-ai-toolbar strong>span{font-weight:400;font-size:10px;margin-left:15px;color:#78917c}.redline-ai-toolbar>div{display:flex;align-items:center;gap:15px;font-size:9px;color:#78917c}.ai-revision{border-radius:20px;padding:5px 8px;background:#e7efdf}.ai-live{white-space:nowrap}.ai-drawing-stage{position:relative;overflow:hidden;min-height:0;display:grid;place-items:center;background:#f0f3ea}.ai-drawing-stage>svg{width:100%;height:auto;display:block}.ai-drawing-stage>.ai-edit-overlay{position:absolute;inset:0;height:100%;pointer-events:none}.ai-selected-equipment{fill:#60bd9d0c;stroke:#60bd9d;stroke-width:1.7;stroke-dasharray:4 3;opacity:0}.ai-gate-valve,.ai-added-valve,.ai-missing-selection{opacity:0}.ai-missing-selection{fill:#89c2ff16;stroke:#89b8d0;stroke-dasharray:5 4}.ai-asset-hotspot{position:absolute;left:48%;top:38%;width:10%;height:17%;border:0;background:transparent;cursor:context-menu}.ai-asset-hotspot:focus-visible{outline:2px solid #60bd9d;border-radius:5px}.ai-context-menu{position:absolute;left:56%;top:27%;min-width:190px;padding:13px;background:#fffef9;border:1px solid #cbdac8;border-radius:11px;box-shadow:0 12px 30px #1a3a2926;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .25s,transform .25s}.ai-context-menu>span{font-size:9px;color:#809282;display:block;border-bottom:1px solid #e4eadf;padding-bottom:9px;margin-bottom:9px}.ai-context-menu strong{font-size:12px;display:block;font-weight:500;color:#37795f}.ai-spark{font-size:17px;margin-right:8px}.ai-context-menu p{font-size:10px;line-height:2;color:#7c8b7d;margin:7px 0 0}.ai-redline-prompt{position:absolute;left:8%;right:8%;bottom:24px;padding:14px 35px 16px 17px;border:1px solid #c9dec9;border-radius:12px;background:#fffffff2;box-shadow:0 10px 30px #244e3215;opacity:0;transition:opacity .25s}.ai-redline-prompt>span{display:block;color:#509473;font-size:9px;margin-bottom:6px}.ai-redline-prompt p{font-size:14px;margin:0;color:#375844;font-weight:500;min-height:19px}.ai-redline-prompt i{position:absolute;right:16px;top:40px;background:#60bd9d;height:16px;width:1px}.redline-ai-status{display:flex;align-items:center;gap:9px;min-height:55px;padding:12px 18px;font-size:10px;color:#6b866e;background:#f8fbf3;border-top:1px solid #e1e9dc}.redline-ai-status>i{font-style:normal;width:17px;height:17px;display:grid;place-items:center;border-radius:50%;background:#dceee0;color:#4a8a65}.ai-change-badge{margin-left:auto;background:#e7f2e5;padding:5px 8px;border-radius:8px;white-space:nowrap;opacity:0}.redline-ai-demo[data-ai-step='menu'] .ai-context-menu{opacity:1;transform:none}.redline-ai-demo[data-ai-step='menu'] .ai-selected-equipment,.redline-ai-demo[data-ai-step='type'] .ai-selected-equipment{opacity:1}.redline-ai-demo[data-ai-step='type'] .ai-redline-prompt,.redline-ai-demo[data-ai-step='insert'] .ai-redline-prompt{opacity:1}.redline-ai-demo[data-ai-step='changed'] .ai-gate-valve,.redline-ai-demo[data-ai-step='insert'] .ai-gate-valve,.redline-ai-demo[data-ai-step='complete'] .ai-gate-valve{opacity:1}.redline-ai-demo[data-ai-step='insert'] .ai-missing-selection{opacity:1}.redline-ai-demo[data-ai-step='complete'] .ai-added-valve{opacity:1}.redline-ai-demo[data-ai-step='changed'] .ai-change-badge,.redline-ai-demo[data-ai-step='insert'] .ai-change-badge,.redline-ai-demo[data-ai-step='complete'] .ai-change-badge{opacity:1}.redline-ai-explanation{padding-right:20px}.redline-ai-explanation h3{font-size:clamp(29px,3vw,43px);line-height:1.1;letter-spacing:-1.5px;margin:14px 0 28px}.redline-ai-explanation ol{list-style:none;padding:0;margin:0;counter-reset:redline}.redline-ai-explanation li{position:relative;padding:0 0 21px 34px;counter-increment:redline}.redline-ai-explanation li:before{content:counter(redline);position:absolute;left:0;top:1px;width:20px;height:20px;border:1px solid #bfd5bd;border-radius:50%;display:grid;place-items:center;font-size:10px;color:#71936f}.redline-ai-explanation li>strong{font-size:14px;font-weight:500}.redline-ai-explanation li p{font-size:13px;line-height:1.55;color:#7b8b79;margin:6px 0 0;max-width:285px}.redline-ai-explanation button{margin-top:4px}.redline-demo-note{font-size:10px;color:#8b9b85;margin-top:20px}.cross-redlining{padding-top:40px}.cross-redline-card{border-radius:24px;background:#e5eee1;display:grid;grid-template-columns:1fr 1.4fr;align-items:center;overflow:hidden}.cross-redline-copy{padding:45px 40px 45px 45px}.cross-redline-copy h2{font-size:clamp(32px,3.8vw,52px);letter-spacing:-2px;line-height:1.05;margin:17px 0 25px}.cross-redline-copy>p:not(.eyebrow){font-size:15px;color:#6d8168;line-height:1.6;margin-bottom:15px}.cross-redline-facts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px;padding-top:24px;border-top:1px solid #c4d6be}.cross-redline-facts strong{display:block;font-size:12px;font-weight:500}.cross-redline-facts span{display:block;font-size:11px;line-height:1.5;color:#809377;margin-top:7px}.cross-redline-visual{position:relative;margin:0;min-height:450px;overflow:hidden;align-self:stretch;background:#f7faf2;display:grid;align-content:center}.cross-redline-visual img{width:100%;height:100%;min-height:450px;object-fit:cover;object-position:center;opacity:.88;display:block}.cross-redline-visual>svg{position:absolute;inset:0;width:100%;height:calc(100% - 45px);fill:none;stroke:#ce5c51;stroke-width:2.8;pointer-events:none}.cross-redline-visual svg rect{fill:#fffaf4;stroke:#d9877e;stroke-width:1}.cross-redline-visual svg text{fill:#b5554a;stroke:none;font-size:13px;font-family:var(--font-sans)}.cross-redline-visual figcaption{position:absolute;bottom:0;left:0;right:0;padding:16px 24px;background:#f8fcf3ed;font-size:11px;color:#7c9075;display:flex;align-items:center;gap:8px}.cross-redline-stroke{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--cross-ink,1))}

@media(max-width:1100px){
  .redline-device-column{height:550px}
  .redline-device-copy{padding:27px 12px 8px}
  .redline-device-copy>span{font-size:11px}
  .redline-product-stage{padding:12px 17px}
  .redline-device.phone{width:166px}
  .phone .redline-device-screen{height:336px}
  .redline-location{padding:15px 17px 20px;gap:7px}
  .redline-device-caption{font-size:7px}
  .redline-ai-demo{gap:27px;grid-template-columns:1.5fr 1fr}.redline-ai-explanation{padding:0}.ai-context-menu{left:52%;min-width:160px}.redline-ai-toolbar strong>span,.ai-live{display:none}.cross-redline-copy{padding:32px}.cross-redline-card{grid-template-columns:1fr 1.1fr}
}
@media(max-width:900px){
  .redline-device-grid{gap:10px}
  .redline-device-column{height:520px;border-radius:20px}
  .redline-device-copy h4{font-size:23px}
  .redline-device-copy>span{display:block;min-height:30px;max-width:170px;margin:auto}
  .redline-product-stage{padding:8px 12px}
  .redline-device.phone{width:146px;border-radius:29px}
  .phone .redline-device-screen{height:299px;border-radius:26px}
  .redline-location{padding:14px}
  .redline-location>div>span{font-size:8px}
  .redline-device-caption{font-size:0;gap:0}
  .redlining-card-header{align-items:end}
  .redline-live-badge{font-size:9px;padding:9px 11px}
}
@media(max-width:760px){
  .collaborative-redlining{margin-top:35px}
  .redlining-card-header{padding:0 0 22px;display:block}
  .redlining-card-header h3{max-width:350px;font-size:30px}
  .redline-live-badge{width:max-content;margin-top:17px;font-size:10px}
  .redline-device-grid{grid-template-columns:1fr;gap:16px}
  .redline-device-column{height:580px;border-radius:24px}
  .redline-device-copy{padding:30px 20px 8px}
  .redline-device-copy p{font-size:11px}
  .redline-device-copy h4{font-size:29px}
  .redline-device-copy>span{font-size:12px;min-height:0;max-width:none}
  .redline-product-stage{padding:12px 28px}
  .redline-device.phone{width:182px;border-radius:34px}
  .phone .redline-device-screen{height:369px;border-radius:30px}
  .redline-location{padding:16px 25px 22px;gap:9px}
  .redline-location>div>span{font-size:9px}
  .redline-device-caption{font-size:8px;gap:5px}
  .redline-shared-event{padding:23px 4px;justify-content:start;font-size:11px}
  .redline-shared-event strong{display:block;width:100%;margin-left:15px}
  .redline-animation-footer{font-size:9px;align-items:start}
  .redline-animation-footer button{font-size:10px}
  .redline-ai-demo{grid-template-columns:1fr}.redline-ai-explanation{padding:20px 5px 0}.redline-ai-explanation ol{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.redline-ai-explanation li{padding:0}.redline-ai-explanation li:before{position:static;margin-bottom:13px}.redline-ai-explanation li p{font-size:12px}.ai-drawing-stage{min-height:0}.cross-redline-card{grid-template-columns:1fr}.cross-redline-copy{padding:30px}.cross-redline-visual{min-height:350px}.cross-redline-visual img{min-height:350px;max-height:500px}.cross-redline-copy h2{font-size:40px}.redline-demo-note{line-height:1.5}.redline-ai-status{font-size:9px}.redline-ai-toolbar{padding:15px}
}
@media(max-width:480px){
  .redline-device-column{height:555px}
  .redline-device-copy h4{font-size:28px}
  .redline-device.phone{width:169px}
  .phone .redline-device-screen{height:344px}
  .redline-location{padding:15px 22px 21px}
  .redline-product-stage{padding:10px 23px}
  .redline-ai-explanation ol{grid-template-columns:1fr;gap:5px}.redline-ai-explanation li{padding-left:33px}.redline-ai-explanation li:before{position:absolute}.redline-ai-explanation li p{max-width:none}.ai-context-menu{font-size:9px;min-width:148px;left:auto;right:10px;top:12%;padding:10px}.ai-context-menu p{font-size:9px}.ai-redline-prompt{left:5%;right:5%;bottom:10px;padding:10px 15px}.ai-redline-prompt p{font-size:11px;min-height:15px}.ai-redline-prompt i{top:30px;right:12px}.redline-ai-status{padding:12px;gap:6px}.ai-change-badge{display:none}.cross-redline-copy h2{font-size:36px}.cross-redline-copy{padding:28px 24px}.cross-redline-facts{gap:16px}.cross-redline-visual figcaption{font-size:10px;padding:15px}.redline-ai-section{padding-top:35px}
}
@media(prefers-reduced-motion:reduce){.ai-context-menu,.ai-redline-prompt{transition:none}}

/* Keep the shared edit together for a full scroll, then hold its synced state. */
.redline-scroll-story { margin-top:58px; height:calc(100svh + 120svh); }
.redline-scroll-story .collaborative-redlining { position:sticky; top:calc(var(--header) + 12px); margin-top:0; height:min(810px,calc(100svh - var(--header) - 24px)); display:flex; flex-direction:column; --ink:1; }
.redline-scroll-story .redlining-card-header { padding-bottom:18px; flex-shrink:0; }
.redline-scroll-story .redline-device-grid { flex:1; min-height:0; }
.redline-scroll-story .redline-device-column { height:100%; min-height:0; }
.redline-scroll-story .redline-device-copy { padding:20px 12px 12px; }
.redline-scroll-story .redline-device-copy h4 { font-size:clamp(20px,2vw,29px); }
.redline-scroll-story .redline-product-stage { container-type:size; }
.redline-scroll-story .redline-product { max-width:min(100%,calc(100cqh * 1.2)); }
.redline-scroll-story .redline-device.phone { width:min(184px,45cqh); }
.redline-scroll-story .phone .redline-device-screen { height:auto; aspect-ratio:.49; }
.redline-scroll-story .redline-location { padding:12px 16px; }
.redline-scroll-story .redline-device-caption { font-size:9px; font-weight:600; gap:5px; padding:6px 8px; border-radius:20px; background:#e5eee7; }
.redline-scroll-story .redline-shared-event { padding:18px 4px; flex-shrink:0; }
.redline-scroll-story .redline-animation-footer { flex-shrink:0; padding:12px 3px; }
.redline-scroll-track { width:140px; height:4px; border-radius:4px; background:#d4dfd6; overflow:hidden; }
.redline-scroll-track i { display:block; height:100%; background:#3e9c7c; transform-origin:left; transform:scaleX(var(--scroll-progress,0)); }
.redline-scroll-story .shared-red-ink { stroke-width:4; }
[data-sync-state='drawing'] .redline-device-caption { background:#fbe7e1; color:#ab453c; }
[data-sync-state='drawing'] .redline-device-caption i { background:#d45d50; }
[data-sync-state='synced'] .redline-live-badge { background:#dff1e7; border-color:#81bea4; color:#205e45; }
[data-sync-state='synced'] .redline-event-dot { background:#3e9c7c; }
[data-sync-state='synced'] .redline-device-caption { color:#205e45; background:#dff1e7; }
@media(max-width:900px) {
  .redline-scroll-story .redline-location { padding:10px; gap:6px; flex-wrap:wrap; }
  .redline-scroll-story .redline-person { width:23px; height:23px; }
  .redline-scroll-story .redline-location>div>span { display:none; }
}
@media(max-width:760px) {
  .redline-scroll-story { margin-top:35px; height:200svh; }
  .redline-scroll-story .redlining-card-header { padding-bottom:14px; }
  .redline-scroll-story .redlining-card-header h3 { font-size:26px; max-width:none; }
  .redline-scroll-story .redline-live-badge { margin-top:12px; }
  .redline-scroll-story .redline-device-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; max-height:460px; }
  .redline-scroll-story .redline-device-column { border-radius:14px; }
  .redline-scroll-story .redline-device-copy { padding:14px 5px 8px; }
  .redline-scroll-story .redline-device-copy p { font-size:9px; margin-bottom:5px; min-height:22px; display:flex; align-items:center; justify-content:center; }
  .redline-scroll-story .redline-device-copy h4 { font-size:15px; letter-spacing:-.4px; margin:0; }
  .redline-scroll-story .redline-device-copy>span { display:none; }
  .redline-scroll-story .redline-product-stage { padding:12px 6px; }
  .redline-scroll-story .redline-product { max-width:100%; }
  .redline-scroll-story .redline-device.phone { width:min(140px,100%); padding:2px; border-radius:20px; }
  .redline-scroll-story .phone .redline-device-screen { border-width:3px; border-radius:17px; }
  .redline-scroll-story .phone .redline-device-camera { top:8px; width:34px; height:9px; }
  .redline-scroll-story .phone .redline-screen-title { padding:22px 5px 4px; min-height:42px; }
  .redline-scroll-story .phone .redline-screen-title>i { top:24px; right:5px; }
  .redline-scroll-story .phone .redline-drawing { inset:42px 0 25px; }
  .redline-scroll-story .phone .redline-drawing svg { width:300px; }
  .redline-scroll-story .phone .redline-device-tools { height:25px; padding:3px 5px 7px; gap:5px; }
  .redline-scroll-story .phone .redline-device-screen:after { width:38px; bottom:3px; height:2px; }
  .redline-scroll-story .tablet .redline-device-screen { border-width:4px; border-radius:8px; }
  .redline-scroll-story .redline-device.tablet { border-radius:11px; }
  .redline-scroll-story .redline-screen-title { padding:4px; }
  .redline-scroll-story .redline-screen-title strong { font-size:5px; }
  .redline-scroll-story .redline-screen-title>span,.redline-scroll-story .device-save { display:none; }
  .redline-scroll-story .redline-device-tools { height:14px; padding:2px 4px; font-size:8px; gap:6px; }
  .redline-scroll-story .active-pen { width:10px; height:10px; }
  .redline-scroll-story .redline-drawing { inset:16px 0 14px; }
  .redline-scroll-story .redline-location { padding:10px 5px; justify-content:center; gap:4px; }
  .redline-scroll-story .redline-person { display:none; }
  .redline-scroll-story .redline-location strong { font-size:10px; }
  .redline-scroll-story .redline-device-caption { width:100%; justify-content:center; margin-left:0; padding:5px 2px; font-size:9px; }
  .redline-scroll-story .redline-shared-event { font-size:11px; padding:14px 2px; gap:6px; }
  .redline-scroll-story .redline-shared-event strong { margin-left:12px; }
}
@media(prefers-reduced-motion:reduce) {
  .redline-scroll-story { height:auto; }
  .redline-scroll-story .collaborative-redlining { position:relative; top:auto; height:min(810px,calc(100svh - var(--header) - 24px)); }
  .redline-scroll-story .redline-animation-footer { display:none; }
}

/* Both source sheets stay fully visible; annotations share their coordinates. */
.cross-redline-card { grid-template-columns:1fr; }
.cross-redline-copy { display:grid; grid-template-columns:1fr 1fr; gap:0 65px; padding:40px 44px; }
.cross-redline-copy .eyebrow { grid-column:1/-1; }
.cross-redline-copy h2 { grid-column:1; grid-row:2/4; margin:15px 0 0; }
.cross-redline-copy>p:not(.eyebrow) { grid-column:2; }
.cross-redline-facts { grid-column:1/-1; margin-top:24px; padding-top:20px; }
.cross-redline-visual { display:block; min-height:0; background:#f3f5f4; }
.cross-map-header { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:20px 28px; border-bottom:1px solid #dce4df; font-size:12px; color:#526b5e; background:#fafcf8; }
.cross-map-header>span:first-child { display:flex; align-items:center; gap:8px; }
.cross-map-header strong { font-size:14px; font-weight:600; color:#203c2e; }
.cross-redline-map { position:relative; aspect-ratio:2048/1007; }
.cross-redline-map img { width:100%; height:100%; min-height:0; max-height:none; object-fit:contain; opacity:1; }
.cross-redline-map>svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.cross-redline-map .cross-redline-reveal { opacity:clamp(0,calc(var(--cross-ink,1)*3 - 1),1); }
.cross-redline-visual figcaption { position:static; flex-wrap:wrap; padding:19px 28px; background:#fafcf8; border-top:1px solid #dce4df; color:#56735e; font-size:12px; }
.cross-redline-visual figcaption strong { font-weight:600; color:#2d503c; }
@media(max-width:760px) {
  .cross-redline-copy { display:block; padding:28px 24px; }
  .cross-redline-copy h2 { margin:17px 0 25px; }
  .cross-map-header { padding:15px; font-size:10px; gap:8px; }
  .cross-map-header>span:last-child { display:none; }
  .cross-map-header strong { font-size:12px; }
  .cross-redline-visual figcaption { padding:15px; font-size:10px; gap:7px; }
  .cross-redline-visual figcaption>span:last-child { width:100%; margin-left:13px; }
}

/* Scale the engineering UI with the actual display, including narrow layouts. */
.redline-scroll-story .macbook .redline-screen-title { min-height:9%; padding:2cqw 4cqw; gap:2cqw; }
.redline-scroll-story .macbook .redline-screen-title strong { font-size:2.7cqw; }
.redline-scroll-story .macbook .redline-screen-title>span { display:inline; font-size:2.1cqw; }
.redline-scroll-story .macbook .redline-screen-title>i { font-size:2.3cqw; }
.redline-scroll-story .macbook .redline-drawing { inset:9% 0 10%; }
.redline-scroll-story .macbook .redline-drawing svg { width:100%; height:100%; }
.redline-scroll-story .macbook .redline-device-tools { height:10%; padding:1cqw 4cqw; gap:5cqw; font-size:4.3cqw; }
.redline-scroll-story .macbook .active-pen { width:6cqw; height:6cqw; border-radius:1.5cqw; }
.redline-scroll-story .macbook .device-save { display:inline; font-size:2.1cqw; }