/* Editorial annotations sit above the original, unmodified product screenshots. */
.scheduling-comparison { border-block:1px solid var(--line); background:rgba(255,255,255,.28); }
.comparison-screens { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:36px; }
.comparison-screen { min-width:0; margin:0; padding:18px; border:1px solid var(--line); border-radius:18px; background:var(--paper); }
.comparison-screen--redesign { border-color:#b9caff; }
.comparison-label { display:block; margin-bottom:12px; color:var(--muted); font:500 11px/1.5 var(--portfolio-mono); letter-spacing:.08em; text-transform:uppercase; }
.comparison-screen--redesign .comparison-label { color:var(--blue); }
.comparison-screen h3 { font-size:26px; line-height:1.15; }
.comparison-screen figcaption p { min-height:3.1em; margin-bottom:20px; font-size:15px; color:var(--muted); }
.comparison-screen a { display:block; color:var(--blue); text-decoration:none; }
.comparison-screen img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; background:#eeede8; border:1px solid var(--line); border-radius:8px; }
.comparison-open { display:block; padding-top:12px; font-size:13px; font-weight:600; }
.comparison-note { max-width:850px; margin:18px 0 36px; color:var(--muted); font-size:13px; }
.comparison-note a,.comparison-benefit a { color:var(--blue); text-underline-offset:3px; }
.comparison-change { padding:30px 0; border-top:1px solid var(--line); }
.comparison-change h3 { display:flex; gap:14px; align-items:baseline; font-size:clamp(24px,2.5vw,30px); }
.comparison-change h3 > span { color:var(--blue); font:500 12px var(--portfolio-mono); }
.comparison-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; margin-top:20px; }
.comparison-pair h4 { margin:0 0 8px; font:600 12px var(--portfolio-sans); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.comparison-pair > div:last-child h4 { color:var(--blue); }
.comparison-pair p { margin:0; color:var(--muted); font-size:16px; }
.comparison-benefit { margin:20px 0 0; padding:14px 18px; background:var(--blue-soft); border-radius:8px; color:var(--ink); font-size:15px; }
.scheduling-comparison a:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
@media(max-width:760px) {
  .comparison-screens,.comparison-pair { grid-template-columns:1fr; gap:22px; }
  .comparison-screen figcaption p { min-height:0; }
  .comparison-change h3 { align-items:flex-start; }
  .comparison-change h3 > span { padding-top:6px; }
}
.case-scheduling-page .scheduling-orientation { max-width:900px; margin:0 0 32px; }
.scheduling-orientation > p { max-width:760px; font-size:18px; color:var(--muted); }
.scheduling-roles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin:22px 0 0; padding:22px 0; border-block:1px solid var(--line); }
.scheduling-roles dt { margin-bottom:6px; font-weight:600; color:var(--ink); }
.scheduling-roles dd { margin:0; color:var(--muted); font-size:15px; line-height:1.55; }
.case-scheduling-page .annotated-decision .decision-intro { max-width:800px; }
.case-scheduling-page .annotation-figure { width:100%; max-width:none; margin:32px 0 0; padding:clamp(8px,1.3vw,16px); border:1px solid var(--line); border-radius:20px; background:var(--paper); box-shadow:var(--shadow); }
.annotation-stage { position:relative; isolation:isolate; }
.annotation-stage img { display:block; width:100%; height:auto; border-radius:10px; }
.annotation-region { position:absolute; left:var(--x); top:var(--y); width:var(--w); height:var(--h); border:2px solid #1855ef; border-radius:5px; pointer-events:none; }
.annotation-region > span { position:absolute; top:0; left:0; transform:translate(-35%,-55%); display:grid; place-items:center; width:32px; height:32px; border:2px solid white; border-radius:50%; background:#1855ef; color:white; font:600 13px/1 var(--portfolio-sans); box-shadow:0 2px 8px #0b102626; }
.annotation-figure > figcaption { padding:22px 8px 8px; }
.annotation-guide { margin:0 0 18px; color:var(--muted); font-size:13px; }
.annotation-key { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 32px; padding:0; margin:0; }
.annotation-key li { display:grid; grid-template-columns:28px minmax(0,1fr); align-items:start; gap:10px; }
.annotation-key .key-number { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--blue-soft); color:#1855ef; font:600 12px/26px var(--portfolio-sans); }
.annotation-key strong { display:block; margin-bottom:5px; font-size:16px; line-height:1.35; color:var(--ink); }
.annotation-key p { margin:0; font-size:15px; line-height:1.55; color:var(--muted); }
.annotation-context { max-width:800px; margin:20px 0 0; padding-left:16px; border-left:2px solid var(--blue); font-size:15px; color:var(--muted); }
.annotation-source { display:inline-block; margin-top:22px; color:var(--blue); font-size:13px; font-weight:600; text-underline-offset:4px; }
.annotation-source:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
@media(max-width:680px) {
  .scheduling-roles { grid-template-columns:1fr; gap:18px; }
  .annotation-key { grid-template-columns:1fr; gap:18px; }
  .annotation-region { border-width:1px; border-radius:3px; }
  .annotation-region > span { width:23px; height:23px; font-size:10px; }
  .annotation-figure > figcaption { padding:22px 4px 8px; }
}
