/* V45 — one physical board, independent generated cutouts, DOM copy. */
.story45{background:#fff;border-block:1px solid #e1e7f0;overflow:clip}
.story45-intro{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.76fr);gap:clamp(35px,7vw,120px);align-items:center;padding-block:75px 58px}
.story45-intro .eyebrow{margin:0 0 20px}
.story45-intro h2{font-size:clamp(43px,5.7vw,76px);line-height:1.02;max-width:13ch;margin:0 0 22px}
.story45-intro p:not(.eyebrow){font-size:15px;line-height:1.7;color:var(--muted);max-width:54ch;margin:0}
.story45-proof{display:grid;grid-template-columns:130px 1fr;gap:20px;align-items:center;padding:16px;border:1px solid #dae2f0;border-radius:10px;background:#f7faff;color:#1e335c;text-decoration:none;box-shadow:0 8px 30px #1223500a}
.story45-proof:hover{border-color:#7890f1;box-shadow:0 13px 40px #12235014}
.story45-proof img{display:block;width:130px;height:102px;object-fit:cover;background:#eaf1e8}
.story45-proof span{display:grid;gap:10px}
.story45-proof small{font:700 10px/1.4 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:#657184}
.story45-proof strong{font:600 15px/1.35 var(--sans);color:#294be8}
.story45-proof:focus-visible,.story45-topnav a:focus-visible,.story45-real-link:focus-visible{outline:3px solid #294be8;outline-offset:3px}
.story45-topnav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 0 18px;border-top:1px solid #dce3ee}
.story45-topnav>span{font:700 11px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#304264;margin-right:auto}
.story45-topnav a{display:inline-flex;align-items:center;min-height:44px;padding:7px 11px;border-radius:5px;font:600 12px/1.2 var(--sans);color:#506176}
.story45-topnav a:hover,.story45-topnav a[aria-current="step"]{background:#eaf0ff;color:#294be8}
.story45-live,.story45-spacers{display:none}
.story45-fallback{display:grid;gap:22px}
.story45-panel{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);align-items:center;gap:0;background:#edf1f8;overflow:hidden}
.story45-panel-art{position:relative;height:420px;overflow:hidden;isolation:isolate}
.story45-panel-board,.story45-live-board{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.story45-panel-art img:not(.story45-panel-board),.story45-art img:not(.story45-live-board){position:absolute;display:block;height:auto;pointer-events:none;user-select:none}
.story45-panel-card{z-index:3;left:8%;top:33%;width:31%}
.story45-panel-note,.story45-live-note{position:absolute;z-index:4;width:20%;pointer-events:none}
.story45-panel-note-1{left:27%;top:8%}.story45-panel-note-2{left:47%;top:12%}.story45-panel-note-3{left:57%;top:46%}
.story45-note-image{position:relative!important;display:block;width:100%;height:auto!important}
.story45-panel-note span,.story45-live-note span{position:absolute;z-index:2;top:43%;left:25%;right:13%;font:700 clamp(8px,.9vw,13px)/1.18 var(--sans);color:#1d356a;transform:rotate(-12deg);text-align:left}
.story45-live-pencil{z-index:5}
.story45-panel-pencil{left:61%;top:49%;width:27%;z-index:5}
.story45-route{position:absolute;z-index:3;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.story45-route path{fill:none;stroke:#2e59e9;stroke-width:4;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:8 8;opacity:.85}
.story45-panel-wire-desktop{z-index:6;left:25%;top:12%;width:43%}
.story45-panel-wire-mobile{z-index:7;left:49%;top:6%;width:23%}
.story45-panel:nth-child(n+4) .story45-panel-note{opacity:.55;transform:translateY(-35px) scale(.78)}
.story45-panel:nth-child(n+4) .story45-panel-pencil,.story45-panel:nth-child(n+4) .story45-route{opacity:.3}
.story45-panel-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:center;background:#10204c;color:white;padding:35px clamp(24px,4vw,52px)}
.story45-phase{display:block;color:#a9bdff;font:700 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.story45-panel-copy h3,.story45-copy h3{font:400 clamp(32px,3.2vw,44px)/1.08 var(--serif);letter-spacing:-.035em;margin:0 0 18px}
.story45-panel-copy p,.story45-copy p{font:400 15px/1.6 var(--sans);color:#e6ebfb;margin:0;max-width:43ch}
.story45-callouts{position:absolute;z-index:8;left:25%;top:22%;width:44%;height:62%;pointer-events:none}
.story45-callouts span{position:absolute;display:inline-block;padding:7px 10px;border:1px solid #bbc9ee;border-radius:3px;background:#ffffffef;color:#2547bb;box-shadow:0 3px 12px #14264e1a;font:700 11px/1.2 var(--sans);white-space:nowrap}
.story45-callouts span:nth-child(1){left:7%;top:14%}.story45-callouts span:nth-child(2){left:57%;top:14%}.story45-callouts span:nth-child(3){left:37%;top:66%}
.story45-callouts span::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:72px;background:#2e59e9;transform-origin:top;transform:rotate(-20deg)}
.story45-callouts span:nth-child(3)::after{left:100%;top:50%;height:70px;transform:rotate(-73deg)}
.story45-end{padding-block:27px 42px;display:flex;justify-content:flex-end}
.story45 + .work{padding-top:65px}
@media(min-width:901px) and (min-height:650px){
  .story45-ready .story45-fallback{display:none}
  .story45-ready .story45-live{display:block;position:sticky;top:var(--header);height:calc(100svh - var(--header));min-height:560px;overflow:hidden;background:#e8edf5;isolation:isolate}
  .story45-ready .story45-stage{position:absolute;inset:0}
  .story45-ready .story45-art{position:absolute;inset:0;overflow:hidden;pointer-events:none}
  .story45-ready .story45-live-card{z-index:4;left:7%;top:32%;width:25%}
  .story45-ready .story45-live-note{width:18%}
  .story45-ready .story45-live-note-1{left:26%;top:25%}.story45-ready .story45-live-note-2{left:42%;top:25%}.story45-ready .story45-live-note-3{left:58%;top:25%}
  .story45-ready .story45-live-pencil{z-index:6;left:55%;top:55%;width:19%}
  .story45-ready .story45-route{inset:0;width:100%;height:100%;opacity:0}
  .story45-ready .story45-route path{stroke-dasharray:1;stroke-dashoffset:1;pathLength:1}
  .story45-ready .story45-live-wire-desktop{z-index:7;left:26%;top:22%;width:38%}
  .story45-ready .story45-live-wire-mobile{z-index:8;left:51%;top:12%;width:18%}
  .story45-ready .story45-callouts{left:27%;top:26%;width:40%;height:56%;opacity:0;z-index:9}
  .story45-ready .story45-badge{position:absolute;z-index:12;top:25px;left:4.5%;display:inline-flex;align-items:center;padding:10px 13px;border:1px solid #d8e1f3;border-radius:5px;background:#ffffffed;color:#26365e;box-shadow:0 4px 20px #14264e0e;font:700 10px/1.3 var(--sans);letter-spacing:.07em;text-transform:uppercase}
  .story45-ready .story45-copy-stack{position:absolute;z-index:11;right:4.5%;bottom:7%;display:grid;grid-template-columns:1fr;width:clamp(290px,29vw,350px);padding:26px 28px 23px;border:1px solid #b7c8f44d;border-radius:9px;background:#0d1d48ef;box-shadow:0 20px 54px #07183d30;color:#fff}
  .story45-ready .story45-copy{position:static;grid-column:1;grid-row:1;opacity:0;pointer-events:none}
  .story45-ready .story45-copy:first-child{opacity:1}
  .story45-ready .story45-copy h3{font-size:clamp(30px,2.65vw,39px)}
  .story45-ready .story45-copy p{font-size:13px}
  .story45-ready .story45-real-link{position:static;grid-column:1;grid-row:2;margin-top:18px;border-top:1px solid #ffffff38;padding-top:13px;color:#b8c9ff;font:700 12px/1.3 var(--sans);text-decoration:underline;text-underline-offset:3px}
  .story45-ready .story45-real-link:hover{color:#fff}
  .story45-ready .story45-rail{position:absolute;z-index:11;left:4.5%;bottom:7%;display:flex;align-items:center;gap:13px;color:#173463;font:700 12px/1 var(--sans);font-variant-numeric:tabular-nums}
  .story45-ready .story45-rail-track{width:125px;height:3px;border-radius:3px;overflow:hidden;background:#aebddd}
  .story45-ready .story45-rail-track i{display:block;width:100%;height:100%;background:#294be8;transform:scaleX(var(--story45-progress,0));transform-origin:left}
  .story45-ready .story45-hint{margin-left:10px;font-size:11px;font-weight:600;color:#344a70}
  .story45-ready .story45-spacers{display:block;pointer-events:none}
  .story45-ready .story45-spacers>span{display:block;height:50svh}
  .story45-ready .story45-spacers:after{content:"";display:block;height:28svh}
  .story45-ready .story45-end{display:none}
  .story45-near .story45-art>img:not(.story45-live-board),.story45-near .story45-live-note,.story45-near .story45-copy,.story45-near .story45-route{will-change:transform,opacity}
}
@media(max-width:900px),(max-height:649px){
  .story45-intro{grid-template-columns:1fr;padding-block:56px 34px;gap:25px}
  .story45-intro h2{max-width:13ch}
  .story45-proof{max-width:550px}
  .story45-topnav{gap:3px 8px}
  .story45-topnav>span{width:100%;margin-bottom:3px}
  .story45-panel{width:min(100%,900px);margin-inline:auto}
  .story45-panel-art{height:360px}
}
@media(max-width:650px){
  .story45-intro{padding-block:50px 29px}
  .story45-intro h2{font-size:clamp(40px,10.5vw,55px);margin-bottom:19px}
  .story45-intro p:not(.eyebrow){font-size:14px}
  .story45-proof{grid-template-columns:94px 1fr;gap:13px;padding:11px}
  .story45-proof img{width:94px;height:78px}
  .story45-proof strong{font-size:13px}
  .story45-topnav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-block:8px 15px;gap:7px}
  .story45-topnav>span{grid-column:1/-1}
  .story45-topnav a{justify-content:center;text-align:center;font-size:clamp(10px,3vw,12px);padding:7px 4px;min-height:44px;border:1px solid #dce5f4;background:#f7f9fd}
  .story45-fallback{gap:14px}
  .story45-panel{display:block}
  .story45-panel-art{height:min(70vw,310px)}
  .story45-panel-board{transform:scale(1.2);transform-origin:45% 50%}
  .story45-panel-card{left:5%;top:27%;width:45%}
  .story45-panel-note{width:29%}
  .story45-panel-note-1{left:25%;top:4%}.story45-panel-note-2{left:54%;top:6%}.story45-panel-note-3{left:45%;top:46%}
  .story45-panel-note span{font-size:clamp(6px,2.2vw,9px)}
  .story45-panel-pencil{left:66%;top:48%;width:31%}
  .story45-panel-wire-desktop{left:15%;top:18%;width:68%}
  .story45-panel-wire-mobile{left:52%;top:6%;width:32%}
  .story45-panel:nth-child(5) .story45-callouts{left:2%;top:0;width:96%;height:100%}
  .story45-panel:nth-child(5) .story45-callouts span{top:auto;bottom:7%;padding:6px 7px;font-size:clamp(8px,2.5vw,10px)}
  .story45-panel:nth-child(5) .story45-callouts span:nth-child(1){left:4%}
  .story45-panel:nth-child(5) .story45-callouts span:nth-child(2){left:32%}
  .story45-panel:nth-child(5) .story45-callouts span:nth-child(3){left:55%}
  .story45-panel:nth-child(5) .story45-callouts span::after{display:none}
  .story45-panel:nth-child(n+4) .story45-panel-note{transform:translateY(-22px) scale(.66)}
  .story45-panel-copy{padding:22px 20px 27px;min-height:0}
  .story45-panel-copy h3{font-size:31px;margin-bottom:11px}
  .story45-panel-copy p{font-size:14px}
  .story45-end{padding-block:23px 40px}
  .story45 + .work{padding-top:47px}
}
@media(prefers-reduced-motion:no-preference){
  .story45-enhanced .story45-panel:not(.is-visible) .story45-panel-art img:not(.story45-panel-board),.story45-enhanced .story45-panel:not(.is-visible) .story45-panel-note{opacity:0;transform:translate3d(0,18px,0)}
  .story45-enhanced .story45-panel .story45-panel-art img:not(.story45-panel-board),.story45-enhanced .story45-panel .story45-panel-note{transition:opacity .45s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
}
@media(prefers-reduced-motion:reduce){.story45 *{animation:none!important;transition:none!important;will-change:auto!important}}
.motion-reduced .story45 *{animation:none!important;transition:none!important;will-change:auto!important}
@media print{.story45-live,.story45-spacers{display:none!important}.story45-fallback{display:block!important}.story45-panel{break-inside:avoid;display:grid!important}.story45-panel-copy{background:#fff!important;color:#111!important}.story45-panel-copy p{color:#333!important}.story45-topnav{display:none!important}}

/* V46 — the same cut-out objects now assemble on one board on touch screens too. */
.story45-ready .story45-fallback{display:none}
.story45-ready .story45-live-card,.story45-ready .story45-live-note,.story45-ready .story45-live-pencil,
.story45-ready .story45-live-wire-desktop,.story45-ready .story45-live-wire-mobile,.story45-ready .story46-live-variant{
  transform-origin:50% 50%;backface-visibility:hidden
}
.story45-ready .story46-live-variant{position:absolute;display:block;left:26%;top:22%;width:38%;height:auto;z-index:6;opacity:0;pointer-events:none;filter:saturate(.7) brightness(1.03)}
.story45-ready .story45-callouts span{opacity:0}
.story45-ready .story45-art{touch-action:pan-y}
@media(min-width:901px) and (min-height:650px){
  .story45-ready .story45-live-note-3{left:45%;top:42%}
  .story45-ready .story45-live-pencil{left:51%;top:57%;width:17%}
  .story45-ready .story45-live-wire-mobile{left:46%;top:10%;width:17%}
}
@media(max-width:900px) and (min-height:650px){
  .story45{--story46-nav:56px}
  .story45-ready .story45-topnav{position:sticky;top:var(--header);z-index:20;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:4px;height:var(--story46-nav);padding:5px 8px;border-block:1px solid #dce3ee;background:#fff;box-shadow:0 6px 18px #10204c0d}
  .story45-ready .story45-topnav>span{display:none}
  .story45-ready .story45-topnav a{min-height:42px;padding:4px 2px;font-size:clamp(9px,2.6vw,11px);line-height:1.1;border:0;background:transparent}
  .story45-ready .story45-topnav a[aria-current="step"]{background:#eaf0ff;color:#294be8}
  .story45-ready .story45-live{display:block;position:sticky;top:calc(var(--header) + var(--story46-nav));height:calc(100svh - var(--header) - var(--story46-nav));min-height:520px;overflow:hidden;background:#e8edf5;isolation:isolate}
  .story45-ready .story45-stage{position:absolute;inset:0}
  .story45-ready .story45-art{position:absolute;inset:0 0 34%;overflow:hidden;pointer-events:none}
  .story45-ready .story45-live-board{object-fit:cover;object-position:52% 48%}
  .story45-ready .story45-live-card{z-index:4;left:5%;top:36%;width:45%}
  .story45-ready .story45-live-note{width:32%}
  .story45-ready .story45-live-note-1{left:16%;top:16%}
  .story45-ready .story45-live-note-2{left:42%;top:14%}
  .story45-ready .story45-live-note-3{left:53%;top:42%}
  .story45-ready .story45-live-note span{font-size:clamp(6px,2.3vw,10px)}
  .story45-ready .story45-live-pencil{z-index:6;left:59%;top:51%;width:36%}
  .story45-ready .story45-route{inset:0;width:100%;height:100%;opacity:0}
  .story45-ready .story45-route path{stroke-dasharray:1;stroke-dashoffset:1;pathLength:1;stroke-width:2.5}
  .story45-ready .story45-live-wire-desktop{z-index:7;left:17%;top:24%;width:58%}
  .story45-ready .story45-live-wire-mobile{z-index:8;left:52%;top:16%;width:29%}
  .story45-ready .story46-live-variant{left:17%;top:24%;width:58%}
  .story45-ready .story45-callouts{left:8%;top:23%;width:84%;height:58%;z-index:9}
  .story45-ready .story45-callouts span{padding:5px 6px;font-size:clamp(8px,2.1vw,10px)}
  .story45-ready .story45-callouts span:nth-child(1){left:3%;top:6%}
  .story45-ready .story45-callouts span:nth-child(2){left:57%;top:1%}
  .story45-ready .story45-callouts span:nth-child(3){left:25%;top:76%}
  .story45-ready .story45-callouts span::after{height:32px}
  .story45-ready .story45-badge{position:absolute;z-index:12;top:10px;left:10px;right:10px;width:max-content;max-width:calc(100% - 20px);padding:7px 8px;border-radius:4px;background:#ffffffed;color:#26365e;font:700 8px/1.3 var(--sans);letter-spacing:.04em;text-transform:uppercase}
  .story45-ready .story45-copy-stack{position:absolute;z-index:11;inset:auto 0 0;display:grid;grid-template-columns:1fr;min-height:34%;padding:18px 20px 20px;background:#10204c;color:#fff}
  .story45-ready .story45-copy{grid-column:1;grid-row:1;opacity:0;pointer-events:none}
  .story45-ready .story45-copy:first-child{opacity:1}
  .story45-ready .story45-copy h3{font-size:clamp(27px,7.3vw,34px);margin:0 0 8px}
  .story45-ready .story45-copy p{font-size:13px;line-height:1.43;max-width:48ch}
  .story45-ready .story45-phase{font-size:10px;margin-bottom:8px}
  .story45-ready .story45-real-link{grid-column:1;grid-row:2;margin-top:12px;padding-top:9px;border-top:1px solid #ffffff38;color:#b8c9ff;font:700 11px/1.3 var(--sans);text-decoration:underline;text-underline-offset:3px}
  .story45-ready .story45-rail{position:absolute;z-index:11;left:12px;right:12px;bottom:calc(34% + 8px);display:flex;align-items:center;gap:8px;color:#173463;font:700 10px/1 var(--sans);font-variant-numeric:tabular-nums}
  .story45-ready .story45-rail-track{width:74px;height:3px;border-radius:3px;overflow:hidden;background:#aebddd}
  .story45-ready .story45-rail-track i{display:block;width:100%;height:100%;background:#294be8;transform:scaleX(var(--story45-progress,0));transform-origin:left}
  .story45-ready .story45-hint{margin-left:3px;font-size:10px;font-weight:600;color:#344a70}
  .story45-ready .story45-spacers{display:block;pointer-events:none}
  .story45-ready .story45-spacers>span{display:block;height:45svh}
  .story45-ready .story45-spacers:after{content:"";display:block;height:12svh}
  .story45-ready .story45-end{display:none}
  .story45-near .story45-art>img:not(.story45-live-board),.story45-near .story45-live-note,.story45-near .story45-copy,.story45-near .story45-route{will-change:transform,opacity}
}
