/* Lightweight illustrations shared by the offers and licences heroes. */
.sim-intro .sim-intro-row{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,1fr);gap:40px}
.licences-illustrated .inner{max-width:1200px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(330px,1fr);align-items:center;gap:42px}
.licences-hero-copy{min-width:0}.licences-illustrated h1{font-size:clamp(2rem,3.4vw,2.85rem)}
.proposal-scene{position:relative;height:310px;max-width:440px;width:100%;justify-self:center;font-family:Manrope,sans-serif;isolation:isolate}
.proposal-scene:before{content:'';position:absolute;inset:25px 0;border-radius:50%;background:radial-gradient(ellipse,rgba(74,187,234,.2),transparent 70%)}
.need-sheet{position:absolute;left:0;top:66px;width:145px;height:191px;padding:20px;background:#eaf1fc;border:1px solid #fff;border-radius:14px;transform:rotate(-10deg);box-shadow:0 20px 45px #06182c40;color:#183354}
.scene-eyebrow{font-size:9px;font-weight:800;letter-spacing:.08em}.need-symbol{display:block;font-size:36px;font-weight:800;color:#8155cf;margin:8px 0}.need-sheet i{display:block;background:#c4d4e8;border-radius:4px;height:5px;margin:10px 0}.need-sheet i:last-child{width:65%}
.proposal-flow{position:absolute;left:29%;top:139px;font-size:34px;color:#78d5ff;z-index:3;text-shadow:0 2px 8px #0b2240}
.proposal-scene .proposal-sheet{position:absolute;right:0;top:15px;width:235px;padding:21px;background:#fff;border:1px solid #dce7f2;border-radius:16px;transform:rotate(5deg);box-shadow:0 24px 55px #06182c55;color:#123055}
.proposal-sheet-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:13px;border-bottom:2px solid #a3c48b;margin-bottom:14px}.proposal-sheet-top img{object-fit:contain}.proposal-sheet-top span{font-size:8px;font-weight:800;letter-spacing:.05em}.proposal-scene .proposal-sheet>strong{display:block;font-size:17px;margin-bottom:14px}.proposal-line{font-size:10px;margin:10px 0;white-space:nowrap}.proposal-line b{color:#60944c;margin-right:5px}.proposal-budget{background:#edf4e8;border-radius:8px;padding:11px;margin-top:15px}.proposal-budget>span{font-size:8px;letter-spacing:.08em;font-weight:800}.proposal-budget strong{display:flex;align-items:center;gap:10px;font-size:23px}.proposal-budget i{display:block;width:80px;height:7px;background:#b8cca6;border-radius:4px}.proposal-pdf{display:block;font-size:9px;margin-top:13px;color:#536b87}
.tools-stack{position:relative;height:390px;width:100%;max-width:425px;justify-self:center;isolation:isolate}.stack-halo{position:absolute;inset:10px -10px 40px;border-radius:50%;background:radial-gradient(ellipse,rgba(134,98,228,.3),transparent 70%)}
.tool-brick{position:absolute;width:176px;height:76px;background:linear-gradient(135deg,#fff,#e9effa);border:1px solid #ffffff;border-bottom:5px solid #b5c7df;border-radius:17px;box-shadow:0 18px 30px #04162c45;display:flex;align-items:center;gap:12px;padding:14px 18px;color:#153353;transform:rotate(var(--tilt));animation:tool-stack-arrive 850ms cubic-bezier(.2,.8,.3,1) both;animation-delay:var(--delay)}
.tool-brick img{width:42px;height:42px;object-fit:contain}.tool-brick strong{font-size:13px}.brick-1{left:8%;top:248px;--tilt:-12deg;--delay:0ms;z-index:1}.brick-2{right:0;top:230px;--tilt:12deg;--delay:140ms;z-index:2}.brick-3{left:3%;top:164px;--tilt:-7deg;--delay:280ms;z-index:3}.brick-4{right:2%;top:145px;--tilt:10deg;--delay:420ms;z-index:4}.brick-5{left:18%;top:85px;--tilt:-10deg;--delay:560ms;z-index:5}.brick-6{right:10%;top:20px;--tilt:8deg;--delay:700ms;z-index:6}.stack-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;color:#bdd8f2;font-size:12px;letter-spacing:.02em}
@keyframes tool-stack-arrive{from{opacity:0;transform:translateY(-100px) rotate(calc(var(--tilt) - 14deg))}to{opacity:1;transform:translateY(0) rotate(var(--tilt))}}
@media(max-width:1000px){.sim-intro .sim-intro-row,.licences-illustrated .inner{grid-template-columns:minmax(0,1fr) 300px;gap:24px}.tool-brick{width:155px;padding:12px;gap:8px}.proposal-scene .proposal-sheet{width:205px;padding:16px}.need-sheet{width:120px;padding:15px}.proposal-line{font-size:9px}}
@media(max-width:760px){.sim-intro .sim-intro-row,.licences-illustrated .inner{grid-template-columns:1fr;gap:20px}.proposal-scene{height:200px;max-width:340px;transform:scale(.76);transform-origin:top center;margin-bottom:22px}.proposal-scene .proposal-sheet{width:220px;top:0}.need-sheet{top:35px}.proposal-flow{top:105px}.tools-stack{height:280px;max-width:340px;margin:6px auto 0}.tool-brick{width:145px;height:59px;border-radius:13px;border-bottom-width:4px}.tool-brick img{width:32px;height:32px}.tool-brick strong{font-size:11px}.brick-1{top:173px}.brick-2{top:163px}.brick-3{top:114px}.brick-4{top:104px}.brick-5{top:59px}.brick-6{top:7px}.stack-caption{font-size:11px}.licences-illustrated .hero-cta{display:flex;gap:12px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.tool-brick{animation:none}}
@media print{.proposal-scene,.tools-stack{display:none!important}}

.proposal-scene{height:370px}@media(max-width:760px){.proposal-scene{height:230px}}
/* The final composition is the default, including when scripts or motion are disabled. */
.tools-story{width:100%;max-width:425px;justify-self:center}.tools-stage{height:375px;position:relative;isolation:isolate}.copilot-hub{position:absolute;top:8px;left:12%;width:76%;padding:17px;background:linear-gradient(120deg,#fff,#e9edff);border:1px solid white;border-radius:20px;box-shadow:0 16px 45px #06182c45;text-align:center;color:#153353}.copilot-hub>img{display:block;margin:0 auto 8px;object-fit:contain}.copilot-hub>strong{font-size:15px}.model-pair{display:flex;gap:10px;justify-content:center;margin-top:12px}.model-pair span{display:flex;align-items:center;gap:6px;border:1px solid #d7deee;border-radius:20px;background:white;padding:5px 10px;font-size:11px}.model-pair img{object-fit:contain}
.office-tile{position:absolute;top:211px;left:0;width:23%;height:63px;border-radius:12px;background:#f5f8ff;border:1px solid white;box-shadow:0 8px 18px #06182c35;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#173456}.office-tile img{width:29px;height:29px;object-fit:contain}.office-tile strong{font-size:9px}.office-1{left:25.66%}.office-2{left:51.33%}.office-3{left:77%}.office-4{top:285px;left:12.8%}.office-5{top:285px;left:38.5%}.office-6{top:285px;left:64.2%}.loose-model{position:absolute;top:160px;left:5%;background:#fff;border-radius:13px;padding:12px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#153353;opacity:0;pointer-events:none}.loose-model img{object-fit:contain}.loose-claude{left:auto;right:5%;top:115px}.story-before,.story-after{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:12px;color:#c8e6ff}.story-before{opacity:0}.story-controls{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-top:16px}.story-controls small{color:#adc5df;font-size:10px;line-height:1.5;max-width:260px}.hero-replay{display:none;background:transparent;border:1px solid #ffffff40;border-radius:20px;color:#c9e7ff;font:inherit;font-size:11px;padding:7px 12px;cursor:pointer;white-space:nowrap}.hero-replay:hover{background:#ffffff15}.hero-replay:focus-visible{outline:2px solid #82d8fb;outline-offset:3px}.motion-ready .hero-replay{display:inline-block}.proposal-story{width:100%;position:relative;justify-self:center}.proposal-story>.hero-replay{position:absolute;right:8px;bottom:0}.proposal-scene{perspective:800px}.proposal-scene .proposal-sheet{transform-origin:50% 85%}
@media(prefers-reduced-motion:no-preference){
.is-playing .office-tile{animation:office-organize 4.6s cubic-bezier(.4,0,.2,1) both}
.is-playing .copilot-hub{animation:hub-organize 4.6s ease both}.is-playing .model-pair{animation:models-reveal 4.6s ease both}
.is-playing .loose-model{animation:models-absorb 4.6s ease both}.is-playing .story-before{animation:before-caption 4.6s ease both}.is-playing .story-after{animation:models-reveal 4.6s ease both}
.is-playing .need-sheet{animation:need-arrive .7s ease both}.is-playing .proposal-flow{animation:proposal-reveal .6s .5s ease both}.is-playing .proposal-scene .proposal-sheet{animation:proposal-popup 1.15s .7s cubic-bezier(.2,.8,.2,1) both}.is-playing .proposal-line{animation:proposal-reveal .5s 1.6s ease both}.is-playing .proposal-line+.proposal-line{animation-delay:1.9s}.is-playing .proposal-budget{animation:proposal-reveal .6s 2.2s ease both}.is-playing .proposal-pdf{animation:proposal-reveal .5s 2.6s ease both}
}
@keyframes office-organize{0%{opacity:0;transform:translate(var(--dx),calc(var(--dy) - 130px)) rotate(var(--r))}22%,48%{opacity:1;transform:translate(var(--dx),var(--dy)) rotate(var(--r))}85%,100%{opacity:1;transform:translate(0,0) rotate(0)}}
@keyframes hub-organize{0%,45%{opacity:0;transform:translateY(90px) scale(.65)}80%,100%{opacity:1;transform:none}}
@keyframes models-absorb{0%{opacity:0;transform:translateY(-80px) rotate(-22deg)}20%,48%{opacity:1;transform:rotate(-15deg)}76%,100%{opacity:0;transform:translate(30px,-35px) scale(.35)}}
@keyframes models-reveal{0%,73%{opacity:0}95%,100%{opacity:1}}
@keyframes before-caption{0%,10%{opacity:0}20%,50%{opacity:1}70%,100%{opacity:0}}
@keyframes need-arrive{from{opacity:0;transform:translateY(25px) rotate(-18deg)}to{opacity:1;transform:rotate(-10deg)}}
@keyframes proposal-popup{0%{opacity:0;transform:translate(-35px,55px) rotateY(-25deg) rotate(0) scale(.5)}70%{opacity:1;transform:translateY(-7px) rotate(6deg) scale(1.03)}100%{opacity:1;transform:rotate(5deg)}}
@keyframes proposal-reveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@media(max-width:760px){.tools-story{max-width:345px}.tools-stage{height:365px}.proposal-story{height:270px}.proposal-story>.hero-replay{bottom:0;right:12px}.proposal-story .proposal-scene{margin:0 auto}.copilot-hub>strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.hero-replay{display:none!important}}

.proposal-story{padding-bottom:22px}.proposal-story>.hero-replay{right:auto;left:0;bottom:0}.sim-intro .hero-replay{font-size:11px;padding:7px 12px;background:#143354;color:#c9e7ff}@media(max-width:760px){.proposal-story{height:292px}.proposal-story>.hero-replay{left:20px;bottom:0}}
/* Build a readable pile one brick at a time, then connect the final ecosystem. */
.proposal-story{padding-bottom:0}@media(max-width:760px){.proposal-story{height:260px}}
.office-links{position:absolute;inset:0;width:100%;height:375px;z-index:-1;pointer-events:none}
.office-tile{--pile-x:0%;--pile-y:0px;--pile-angle:0deg}
.office-0{--pile-x:12%;--pile-y:70px;--pile-angle:-6deg}
.office-1{--pile-x:6%;--pile-y:65px;--pile-angle:4deg}
.office-2{--pile-x:0%;--pile-y:70px;--pile-angle:-4deg}
.office-3{--pile-x:-6%;--pile-y:65px;--pile-angle:6deg}
.office-4{--pile-x:0%;--pile-y:-64px;--pile-angle:-5deg}
.office-5{--pile-x:0%;--pile-y:-66px;--pile-angle:5deg}
.office-6{--pile-x:0%;--pile-y:-64px;--pile-angle:-4deg}
.loose-gpt{left:18%;top:152px}.loose-claude{right:15%;top:148px}
@media(prefers-reduced-motion:no-preference){
.is-playing .office-tile{animation:brick-place .44s calc(var(--i)*.22s) cubic-bezier(.2,.8,.3,1) both,brick-align 1.15s 3.15s ease-in-out forwards}
.is-playing .loose-gpt{animation:assistant-place .45s 1.55s ease-out both,assistant-integrate .8s 3.15s ease-in forwards}
.is-playing .loose-claude{animation:assistant-place .45s 1.8s ease-out both,assistant-integrate .8s 3.15s ease-in forwards}
.is-playing .copilot-hub{animation:hub-organize 4.9s ease both}.is-playing .model-pair,.is-playing .story-after{animation:models-reveal 4.9s ease both}.is-playing .story-before{animation:before-caption 4.9s ease both}
.is-playing .office-links{animation:connections-appear .6s 4.2s ease both}
}
@keyframes brick-place{from{opacity:0;transform:translate(var(--pile-x),calc(var(--pile-y) - 110px)) rotate(var(--pile-angle))}to{opacity:1;transform:translate(var(--pile-x),var(--pile-y)) rotate(var(--pile-angle))}}
@keyframes brick-align{from{transform:translate(var(--pile-x),var(--pile-y)) rotate(var(--pile-angle))}to{transform:none}}
@keyframes assistant-place{from{opacity:0;transform:translateY(-110px) rotate(-8deg)}to{opacity:1;transform:rotate(-5deg)}}
@keyframes assistant-integrate{from{opacity:1;transform:rotate(-5deg)}to{opacity:0;transform:translateY(-45px) scale(.35)}}
@keyframes connections-appear{from{opacity:0;stroke-dasharray:500;stroke-dashoffset:500}to{opacity:.85;stroke-dasharray:500;stroke-dashoffset:0}}
@media(max-width:760px){.office-links{height:375px}}
/* Keep the arrow in the actual gap between the two sheets at every width. */
.proposal-scene .need-sheet{width:30%}.proposal-scene .proposal-sheet{width:53%}
.proposal-scene .proposal-flow{left:calc(38.5% - 16px);top:150px;width:32px;text-align:center;line-height:1;font-size:30px}
@media(max-width:1000px){.proposal-scene .proposal-sheet{padding:13px}.proposal-scene .proposal-sheet>strong{font-size:15px}.proposal-line{font-size:8px}.proposal-sheet-top span{font-size:7px}}
@media(max-width:760px){.proposal-scene .proposal-flow{top:125px}.proposal-scene .need-sheet{padding:12px}.proposal-scene .proposal-sheet{width:53%}}
/* A heavier pile, a pause, then a calm transition into the connected layout. */
.office-0{--pile-x:18%;--pile-y:76px;--pile-angle:-14deg}
.office-1{--pile-x:3%;--pile-y:80px;--pile-angle:10deg}
.office-2{--pile-x:-7%;--pile-y:78px;--pile-angle:-11deg}
.office-3{--pile-x:-18%;--pile-y:75px;--pile-angle:17deg}
.office-4{--pile-x:9%;--pile-y:-43px;--pile-angle:-15deg}
.office-5{--pile-x:-5%;--pile-y:-39px;--pile-angle:12deg}
.office-6{--pile-x:-14%;--pile-y:-46px;--pile-angle:-12deg}
.loose-gpt{top:174px;left:17%}.loose-claude{top:166px;right:17%}
@media(prefers-reduced-motion:no-preference){
.is-playing .office-tile{animation:brick-heavy-land .6s calc(var(--i)*.32s) cubic-bezier(.2,.7,.3,1) both,brick-settle .75s 2.95s ease-in-out forwards,brick-calm-align 2.8s 5.5s cubic-bezier(.4,0,.2,1) forwards}
.is-playing .loose-gpt{animation:assistant-place .6s 2.3s ease-out both,assistant-integrate 1.8s 5.5s ease-in-out forwards}
.is-playing .loose-claude{animation:assistant-place .6s 2.65s ease-out both,assistant-integrate 1.8s 5.5s ease-in-out forwards}
.is-playing .copilot-hub{animation:hub-serene 3s 5.5s cubic-bezier(.4,0,.2,1) both}
.is-playing .model-pair,.is-playing .story-after{animation:proposal-reveal 1.5s 7.1s ease both}
.is-playing .story-before{animation:pile-caption 8s ease both}
.is-playing .office-links{animation:connections-appear 1.5s 7.5s ease both}
}
@keyframes brick-heavy-land{0%{opacity:0;transform:translate(var(--pile-x),calc(var(--pile-y) - 100px)) rotate(calc(var(--pile-angle) - 8deg))}75%{opacity:1;transform:translate(var(--pile-x),calc(var(--pile-y) + 4px)) rotate(var(--pile-angle))}100%{opacity:1;transform:translate(var(--pile-x),var(--pile-y)) rotate(var(--pile-angle))}}
@keyframes brick-settle{from{transform:translate(var(--pile-x),var(--pile-y)) rotate(var(--pile-angle))}to{transform:translate(var(--pile-x),calc(var(--pile-y) + 7px)) rotate(calc(var(--pile-angle) + 4deg))}}
@keyframes brick-calm-align{from{transform:translate(var(--pile-x),calc(var(--pile-y) + 7px)) rotate(calc(var(--pile-angle) + 4deg))}to{transform:none}}
@keyframes hub-serene{from{opacity:0;transform:translateY(40px) scale(.9)}to{opacity:1;transform:none}}
@keyframes pile-caption{0%{opacity:0}12%,68%{opacity:1}86%,100%{opacity:0}}

.tools-story .tools-stage{height:400px}

/* Deliberately uneven pile before the calm, connected arrangement. */
.office-0{--pile-x:36%;--pile-y:70px;--pile-angle:-25deg}
.office-1{--pile-x:8%;--pile-y:84px;--pile-angle:19deg}
.office-2{--pile-x:-20%;--pile-y:57px;--pile-angle:-18deg}
.office-3{--pile-x:-33%;--pile-y:79px;--pile-angle:29deg}
.office-4{--pile-x:27%;--pile-y:-58px;--pile-angle:-28deg}
.office-5{--pile-x:-9%;--pile-y:-34px;--pile-angle:24deg}
.office-6{--pile-x:-30%;--pile-y:-79px;--pile-angle:-17deg}
.loose-gpt{left:20%;top:183px;--assistant-angle:-19deg}
.loose-claude{right:12%;top:155px;--assistant-angle:16deg}
@keyframes assistant-place{from{opacity:0;transform:translateY(-110px) rotate(calc(var(--assistant-angle) - 10deg))}to{opacity:1;transform:rotate(var(--assistant-angle))}}
@keyframes assistant-integrate{from{opacity:1;transform:rotate(var(--assistant-angle))}to{opacity:0;transform:translateY(-45px) scale(.35)}}
/* Raised offer button on pointer hover and keyboard focus. */
.licences-hero-copy .hero-cta .btn-ghost{transition:transform .2s ease,box-shadow .2s ease}
.licences-hero-copy .hero-cta .btn-ghost:focus-visible{transform:translateY(-3px);box-shadow:0 9px 20px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.28);outline:2px solid #82d8fb;outline-offset:4px}
@media(hover:hover){.licences-hero-copy .hero-cta .btn-ghost:hover{transform:translateY(-3px);box-shadow:0 9px 20px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.28)}}
.licences-hero-copy .hero-cta .btn-ghost:active{transform:translateY(0);box-shadow:0 3px 8px rgba(0,0,0,.2)}
@media(prefers-reduced-motion:reduce){.licences-hero-copy .hero-cta .btn-ghost{transition:none}}
/* Useful actions on the two illustrated sheets. */
.sim-intro .sheet-hit{position:absolute;inset:0;z-index:5;display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;box-shadow:none}
.sim-intro .sheet-hit:hover{background:rgba(106,161,225,.07)}.sim-intro .sheet-hit:focus-visible{outline:3px solid #27b7ff;outline-offset:4px}
#simulator{scroll-margin-top:95px}
.proposal-preview{box-sizing:border-box;width:min(600px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #dce5ef;border-radius:22px;padding:34px;color:#123055;background:#fff;box-shadow:0 24px 80px #00152a50}
.proposal-preview::backdrop{background:rgba(6,22,44,.65)}.proposal-preview .preview-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#294666;font-size:28px;width:40px;height:40px;cursor:pointer}.preview-kicker{font-size:11px;letter-spacing:.1em;color:#657c94;font-weight:800;margin:0 35px 12px 0}.proposal-preview h2{font-size:25px;line-height:1.25;margin:0 0 14px}.proposal-preview p{line-height:1.6;font-size:14px}.preview-sections{list-style:none;counter-reset:preview;display:grid;gap:16px;padding:0;margin:24px 0}.preview-sections li{position:relative;padding-left:44px;counter-increment:preview}.preview-sections li:before{content:'0' counter(preview);position:absolute;left:0;top:0;color:#66884d;background:#edf4e8;border-radius:9px;padding:7px;font-size:12px;font-weight:800}.preview-sections strong,.preview-sections span{display:block}.preview-sections strong{font-size:15px}.preview-sections span{font-size:13px;line-height:1.5;margin-top:4px;color:#526982}.proposal-preview .preview-note{font-size:12px;color:#63758b}.proposal-preview .preview-start{display:flex;justify-content:center;text-align:center;white-space:normal;margin-top:22px;font-size:14px}
@media(max-width:480px){.proposal-preview{padding:28px 22px}.proposal-preview h2{font-size:22px}}

.proposal-preview{margin:auto;inset:0}
/* Independent translate preserves the rotation and entrance animations. */
.proposal-scene .need-sheet,.proposal-scene .proposal-sheet{transition:translate .22s ease,box-shadow .22s ease}
@media(hover:hover){.proposal-scene .need-sheet:hover,.proposal-scene .proposal-sheet:hover{translate:0 -7px;box-shadow:0 30px 55px rgba(0,10,30,.5),0 0 0 2px rgba(130,216,251,.5)}}
.proposal-scene .need-sheet:focus-within,.proposal-scene .proposal-sheet:focus-within{translate:0 -7px;box-shadow:0 30px 55px rgba(0,10,30,.5),0 0 0 2px rgba(130,216,251,.5)}
@media(prefers-reduced-motion:reduce){.proposal-scene .need-sheet,.proposal-scene .proposal-sheet{transition:none}}