/* A stable frame. Colour changes never change layout or scroll position. */
:root{--scene-colour:#91aef7;--frame-gap:clamp(24px,4.8vw,80px)}
body{background:var(--scene-colour);transition:background-color 1s ease}
#site-stage{width:100%;margin:0;transform-origin:50% 0;filter:none;will-change:transform;background:#fff;overflow:clip;border-radius:0;overflow-anchor:none;position:relative}
#camera-viewport{position:fixed;inset:0;overflow:clip;background:#fff;transform-origin:50% 50%;will-change:transform;border-radius:0;isolation:isolate}
#camera-scroll-space{width:1px;pointer-events:none;overflow-anchor:none}
/* The approved opening screen stays full bleed; only later scenes are framed. */
main>section:not(.hero){width:100%;margin-inline:auto}
#scroll-frame{position:fixed;inset:20px var(--frame-gap);border-radius:36px;box-shadow:0 0 0 100vmax var(--scene-colour);pointer-events:none;z-index:100;opacity:0;transition:opacity .45s,box-shadow 1s}
#scroll-frame.visible{opacity:1}
#scroll-frame{display:none}
footer{width:100%;margin-inline:auto;flex-wrap:wrap;border-radius:0;margin-bottom:0}
footer>.footer-pages{width:100%;margin:0;padding:18px 0 0;background:transparent;flex-basis:100%;order:10}
main>section:last-child{border-radius:0}
.back-to-top{position:fixed;right:20px;bottom:20px;z-index:20001;padding:12px 16px;border:1px solid #d4dcec;border-radius:24px;background:#fff;color:#263a6d;font-size:12px;box-shadow:0 6px 24px #17234c20}
.back-to-top[hidden]{display:none}
.motion-controls{display:none!important}
@media(max-width:760px){
 :root{--frame-gap:20px}
 #site-stage{border-radius:0}
 #scroll-frame{inset:18px var(--frame-gap);border-radius:24px}
 .nav{padding-inline:14px}.nav-actions .whatsapp-button{display:none!important}.nav-actions{gap:6px}.nav .button,.site-menu{padding:10px 9px;font-size:11px}
 .skills{padding:60px 20px}.skills>h2{font-size:34px;line-height:1.12}.journey-lead{font-size:14px!important;line-height:1.6;margin:20px auto 28px!important;max-width:100%}
 .skills-layout{display:flex;flex-direction:column;gap:14px;width:100%;max-width:460px;margin-inline:auto;text-align:left}
 .statements{display:block;width:100%;padding:0}
 .statements .statement{display:none;margin:0;padding:14px 18px;background:#edf2ff;border:1px solid #d4ddfa;border-radius:12px;min-height:54px}
 .statements .statement.active{display:flex;align-items:center;gap:12px;transform:none}
 .statement small{font-size:12px;line-height:1;color:#3458ed}.statement h3{font-size:17px;line-height:1.3;margin:0;color:#22355c}
 .skills-art{width:100%;height:auto;min-height:0;padding:0}
 .skills-profile{position:relative!important;inset:auto!important;width:100%!important;min-height:0;height:auto;transform:none!important;padding:22px;border-radius:18px}
 .skills-profile h3{font-size:25px;line-height:1.18;min-height:2.4em}.skills-profile .role{font-size:12px;line-height:1.5;min-height:3em;margin-bottom:20px}
 .skills-profile .phase-content{min-height:270px}.phase-content small{font-size:11px;letter-spacing:.06em;line-height:1.5}.phase-content p{font-size:15px;line-height:1.55;padding-right:18px;margin:8px 0 20px}
 .skills-profile .panel-top{font-size:10px;letter-spacing:.1em}.panel-top span{font-size:8px}.panel-bottom{font-size:11px;line-height:1.5}
 .back-to-top{right:14px;bottom:14px;font-size:11px;padding:11px 13px}
}
@media(prefers-reduced-motion:reduce){body,#scroll-frame{transition:none}}

/* Visual polish only: preserve approved camera architecture and all content. */
.adventure{padding:72px 5% 80px}
.adventure>.intro{margin:22px auto 34px;line-height:1.6;font-size:16px}
.cards{width:min(1120px,100%);margin-inline:auto;gap:22px;align-items:stretch}
.adventure-card{min-height:0;padding:28px;border:1px solid #e1e7f3;border-radius:24px;background:linear-gradient(145deg,#f4f7ff,#edf2fc);box-shadow:0 16px 40px #26386508}
.adventure-card.business{background:linear-gradient(145deg,#f7f8fc,#eef1f7)}
.card-copy h3{font-size:30px;margin-bottom:14px;letter-spacing:-.04em}
.card-copy p,.card-copy ul{font-size:14px;line-height:1.65}
.card-copy ul{margin-bottom:24px}.card-copy li{margin:9px 0}
.code-art,.cube-art{overflow:visible}
.tile-screen,.professional-mini{border-radius:16px;box-shadow:0 12px 30px #23375b0a}
.skills{padding:72px 5% 80px}
.skills-layout{width:min(1080px,94%);grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr);gap:44px;margin:34px auto 0;align-items:center}
.skills-art{height:auto;min-height:0;padding:0}
.skills-profile{padding:28px;width:100%;height:auto;min-height:0;border-radius:24px}
.skills-profile h3{font-size:28px;line-height:1.15;min-height:2.3em}
.skills-profile .role{font-size:13px;line-height:1.5;min-height:2.4em;margin-bottom:20px}
.skills-profile .phase-content{min-height:225px}
.statements .statement{display:flex;gap:14px;align-items:center;margin-bottom:20px;padding:10px 12px;border-radius:12px;transition:background .45s,color .45s,transform .45s}
.statements .statement.active{background:#edf2ff;transform:none}
.statement h3{font-size:20px;line-height:1.25;margin:0}.statement small{font-size:11px;min-width:22px}
.journey-lead{max-width:680px;padding:0;font-size:15px;margin-top:20px}
.restored-section{padding-top:76px;padding-bottom:76px}
.restored-split{gap:clamp(28px,4vw,64px)}
@media(min-width:1200px){
 .adventure-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center}
 .code-art,.cube-art{margin-top:0;min-width:0}
 .tile-screen,.professional-mini{padding:18px}
 .tile-title strong,.work-row strong{font-size:18px}
 .work-row{flex-wrap:wrap;gap:10px}.professional-mini .work-confirmed{margin:18px 0;padding:12px}
 .tile-assignment{padding-top:16px;margin-top:16px;font-size:12px}
 .tile-proofs{gap:6px}.tile-proof{font-size:10px;padding:7px 8px}
 .card-copy .button{margin-top:0}
}
@media(min-width:761px) and (max-width:1199px){
 .skills-layout{width:96%;gap:28px}.skills-profile{padding:24px}
 .adventure-card{padding:24px}.card-copy p,.card-copy ul{font-size:14px}
 .card-copy{flex:none;min-height:300px}.card-copy .button{margin-top:auto}
 .statement h3{font-size:18px}
}
@media(max-width:760px){
 .adventure{padding:54px 16px 60px}.adventure>.intro{font-size:14px;margin:18px auto 28px}
 .cards{width:100%;gap:20px}.adventure-card{padding:22px;border-radius:20px}
 .card-copy h3{font-size:28px}.card-copy p,.card-copy ul{font-size:14px}
 .code-art,.cube-art{margin-top:24px}.tile-screen,.professional-mini{padding:18px}
 .skills{padding:54px 16px 60px}.skills>h2{font-size:32px}
 .skills-layout{display:flex;width:100%;max-width:460px;gap:12px;margin:0 auto}
 .journey-lead{font-size:14px;margin:18px auto 26px!important;max-width:100%}
 .statements .statement{display:none;margin:0;padding:12px 16px}
 .statements .statement.active{display:flex}.statement h3{font-size:17px}
 .skills-art{width:100%;min-height:0;height:auto}
 .skills-profile{padding:20px;border-radius:20px}
 .skills-profile h3{font-size:25px}.skills-profile .phase-content{min-height:270px}
 .skills-profile .role{min-height:1.5em}
 .restored-section{padding:60px 20px}.restored-section h2{font-size:34px;line-height:1.15}
 #being-away{padding:60px 20px}
 .genai{padding:60px 20px}.genai-inner{width:100%;min-height:0;display:flex;flex-direction:column}
 .genai-copy{position:relative;padding:0;width:100%}.genai-copy h2{font-size:34px;line-height:1.15}
 .genai-copy p{max-width:none;line-height:1.65;margin-top:20px}
 .genai-art.live-art{position:relative;inset:auto;width:100%;height:820px;margin-top:28px;transform:none}
 .family-screen{position:relative;inset:auto;width:100%;min-height:490px;padding:24px;border-radius:24px}
 .family-screen h3{font-size:30px;margin-top:24px}.family-message p{font-size:14px}
 .family-message small,.family-note{font-size:11px;line-height:1.55}
 .backlog{left:0;top:540px;width:45%}.delegated{left:51%;top:585px;width:49%}
 .flying-task{left:1.5%;top:574px;width:44%}
 footer{padding:28px 24px 64px}
}

/* Benchmark scene: layered product screens, not a grid of flat form panels. */
#adventure{background:#fff;padding:64px 5% 76px}
#adventure>h2{font-size:clamp(36px,4.1vw,60px);letter-spacing:-.055em;line-height:1.08}
#adventure>.intro{margin:20px auto 36px;color:#657187}
#adventure .cards{gap:26px;max-width:1120px}
#adventure .adventure-card{display:flex;flex-direction:column;position:relative;isolation:isolate;padding:34px 34px 0;border-radius:28px;border:1px solid #dce6ef;background:linear-gradient(150deg,#f1f8f8 0%,#e7f1f5 58%,#dce8f9 100%);overflow:hidden;box-shadow:0 20px 50px #1f39560a;min-height:0}
#adventure .adventure-card.business{background:linear-gradient(150deg,#f5f6fc,#e9edf8 65%,#dde3f2)}
#adventure .card-copy{flex:none;width:100%;min-height:0;position:relative;z-index:3}
#adventure .card-copy h3{font-size:32px;margin-bottom:12px;letter-spacing:-.045em}
#adventure .card-copy p{font-size:15px;line-height:1.55;max-width:360px;margin-bottom:20px}
#adventure .card-copy ul{font-size:13px;line-height:1.6;margin:0 0 22px;max-width:390px}
#adventure .card-copy li{margin:7px 0}
#adventure .card-copy .button{margin:0;font-size:13px;padding:12px 20px;border-radius:9px}
#adventure .code-art,#adventure .cube-art{position:relative;inset:auto;width:100%;height:340px;margin:28px 0 0;perspective:1000px;overflow:visible;flex:none;isolation:isolate}
#adventure .code-art:before,#adventure .cube-art:before{content:'';position:absolute;left:3%;right:3%;bottom:20px;height:45px;background:radial-gradient(ellipse,#365b8f25,transparent 70%);filter:blur(10px);z-index:-1}
#adventure .tile-screen,#adventure .professional-mini{position:absolute;top:8px;left:5%;width:82%;padding:20px 22px;border:1px solid #fff;border-radius:18px;background:#ffffffed;box-shadow:0 2px 0 #ccd8e9,0 8px 0 -3px #dce5f2,0 22px 48px #23446b22;transform:rotate(-2deg);transform-origin:50% 90%;animation:none;transition:transform .8s cubic-bezier(.2,.75,.2,1)}
#adventure .professional-mini{top:22px;left:9%;width:78%;transform:rotate(2deg);padding-bottom:26px}
#adventure .screen-chrome{display:flex;gap:5px;margin:-1px 0 15px;padding-bottom:13px;border-bottom:1px solid #e8edf4}
#adventure .screen-chrome i{width:5px;height:5px;background:#ced8e6;border-radius:50%}
#adventure .tile-screen>small,#adventure .professional-mini>small{font-size:9px;letter-spacing:.12em;margin-bottom:17px}
#adventure .tile-title strong{font-size:20px}
#adventure .tile-assignment{margin-top:17px;padding-top:17px;font-size:13px}
#adventure .tile-schedule{font-size:12px;margin:10px 0 18px}
#adventure .code-response{margin:0;padding:11px 12px;font-size:12px;background:#eaf2ff}
#adventure .tile-proofs{position:absolute;left:0;right:-4%;bottom:22px;z-index:4;display:grid;grid-template-columns:1fr;gap:8px;pointer-events:none;align-items:start}
#adventure .tile-proof{width:max-content;max-width:100%;padding:10px 15px;border:1px solid #e2eaf5;background:#fff;color:#425773;box-shadow:0 9px 24px #29426416;border-radius:10px;font-size:12px}
#adventure .tile-proof:before{content:'✓';display:inline-grid;place-items:center;width:18px;height:18px;margin-right:9px;background:#e8f3f1;color:#228673;border-radius:50%;font-size:10px}
#adventure .tile-proof:nth-child(2){justify-self:end;margin-right:0;transform:translateY(-5px)}
#adventure .tile-proof:nth-child(3){justify-self:start;margin-left:20px;transform:translateY(-9px)}
#adventure .professional-mini .work-row{display:flex;flex-wrap:wrap;gap:12px;background:none}
#adventure .work-row strong{font-size:24px}.adventure .work-row p{font-size:13px}
#adventure .professional-mini .work-confirmed{padding:13px 15px;margin:20px 0 0;border-radius:10px;background:#edf2ff;font-size:12px}
#adventure .cube-art>.work-row{position:absolute;left:18%;right:-2%;bottom:43px;z-index:4;padding:22px 24px;background:#fff!important;border:1px solid #e3e9f3;border-radius:16px;box-shadow:0 18px 38px #263d6520;transform:rotate(-2deg);display:flex;gap:16px}
#adventure .cube-art>.work-row>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#eaf0ff;color:#3458ed}
#adventure.motion-active .tile-screen{animation:careSceneFloat 7s ease-in-out infinite}
#adventure.motion-active .professional-mini{animation:workSceneFloat 7s .6s ease-in-out infinite}
#adventure.motion-active .tile-proof{animation:proofSceneFloat 7s ease-in-out infinite}
#adventure.motion-active .tile-proof:nth-child(2){animation-delay:.8s!important}
#adventure.motion-active .tile-proof:nth-child(3){animation-delay:1.6s!important}
#adventure.motion-active .cube-art>.work-row{animation:earningsSceneFloat 7s 1.3s ease-in-out infinite}
@keyframes careSceneFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(-.5deg)}}
@keyframes workSceneFloat{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-8px) rotate(.5deg)}}
@keyframes proofSceneFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes earningsSceneFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(-.5deg)}}
@media(min-width:1100px){#adventure .card-copy{min-height:280px}}
@media(min-width:761px) and (max-width:1099px){#adventure .adventure-card{padding:26px 24px 0}#adventure .card-copy{min-height:300px}#adventure .code-art,#adventure .cube-art{height:350px}#adventure .tile-screen,#adventure .professional-mini{left:0;width:95%;padding:18px}#adventure .tile-proof{font-size:11px;padding:9px 12px}#adventure .tile-title strong{font-size:18px}#adventure .cube-art>.work-row{left:8%;right:0;padding:20px}}
@media(max-width:760px){#adventure{padding:54px 16px 60px}#adventure .adventure-card{padding:26px 22px 0;border-radius:24px}#adventure .card-copy h3{font-size:29px}#adventure .card-copy p{font-size:14px}#adventure .card-copy ul{font-size:13px}#adventure .code-art,#adventure .cube-art{height:340px;margin-top:30px}#adventure .tile-screen,#adventure .professional-mini{left:0;width:97%;padding:18px}#adventure .tile-title strong{font-size:19px}#adventure .tile-proofs{right:0;bottom:18px}#adventure .tile-proof{font-size:11px;padding:9px 12px}#adventure .cube-art>.work-row{left:5%;right:-1%;bottom:45px;padding:20px}#adventure .professional-mini{top:22px;width:94%;left:3%}}
@media(prefers-reduced-motion:reduce){#adventure .tile-screen,#adventure .professional-mini,#adventure .tile-proof,#adventure .cube-art>.work-row{animation:none!important;transform:none;translate:none}}
/* Layer card edges and shadows, never readable rows. */
#adventure .code-art,#adventure .cube-art{height:390px}
#adventure .tile-proofs{grid-template-columns:1fr 1fr;left:0;right:0;bottom:18px;gap:8px}
#adventure .tile-proof{padding:9px 12px;font-size:11px}
#adventure .tile-proof:nth-child(2){transform:none;justify-self:end}
#adventure .tile-proof:nth-child(3){grid-column:1/-1;justify-self:center;margin-left:0;transform:none}
#adventure .cube-art>.work-row{bottom:18px}
@media(min-width:761px) and (max-width:1099px){#adventure .code-art,#adventure .cube-art{height:410px}}
@media(max-width:760px){#adventure .code-art,#adventure .cube-art{height:400px}#adventure .tile-proof{padding:8px 10px;font-size:10px}#adventure .tile-proof:before{margin-right:6px;width:16px;height:16px}}
#adventure .code-art,#adventure .cube-art{opacity:0;transform:translateY(28px);transition:opacity .8s .25s,transform 1.1s .25s cubic-bezier(.2,.75,.2,1)}
#adventure .cube-art{transition-delay:.45s}
#adventure.is-visible .code-art,#adventure.is-visible .cube-art{opacity:1;transform:none}
#adventure .tile-proofs{opacity:0;transform:translateY(18px);transition:opacity .7s 1s,transform .9s 1s}
#adventure.is-visible .tile-proofs{opacity:1;transform:none}
#adventure .cube-art>.work-row{opacity:0;transition:opacity .8s 1.1s}
#adventure.is-visible .cube-art>.work-row{opacity:1}
@media(prefers-reduced-motion:reduce){#adventure .code-art,#adventure .cube-art,#adventure .tile-proofs,#adventure .cube-art>.work-row{opacity:1;transform:none;transition:none}}

/* Reference-style entrance choreography. Travel is tied to scroll, then settles;
   no perpetual bobbing, layout animation, or changes to the whole-screen camera. */
#adventure .adventure-card.reveal-motion{
 opacity:var(--card-opacity,1)!important;
 transform:translateY(calc((1 - var(--card-arrival,1))*150px)) scale(calc(.96 + var(--card-arrival,1)*.04))!important;
 transform-origin:50% 15%;transition:none!important;
}
#adventure .code-art,#adventure .cube-art{opacity:var(--panel-opacity,1)!important;transform:none!important;transition:none!important}
#adventure .tile-screen,#adventure .professional-mini{animation:none!important;transition:none!important;opacity:var(--panel-opacity,1);scale:calc(.93 + var(--panel-arrival,1)*.07);translate:calc((1 - var(--panel-arrival,1))*-28px) calc((1 - var(--panel-arrival,1))*125px)}
#adventure .professional-mini{translate:calc((1 - var(--panel-arrival,1))*28px) calc((1 - var(--panel-arrival,1))*125px)}
#adventure .tile-proofs{opacity:1!important;transform:none!important;transition:none!important}
#adventure .tile-proof{animation:none!important;opacity:var(--detail-arrival,1);translate:calc((1 - var(--detail-arrival,1))*-34px) calc((1 - var(--detail-arrival,1))*70px)}
#adventure .tile-proof:nth-child(2){translate:calc((1 - var(--detail-arrival,1))*34px) calc((1 - var(--detail-arrival,1))*90px)}
#adventure .tile-proof:nth-child(3){translate:0 calc((1 - var(--detail-arrival,1))*110px)}
#adventure .cube-art>.work-row{animation:none!important;transition:none!important;opacity:var(--detail-arrival,1)!important;translate:calc((1 - var(--detail-arrival,1))*35px) calc((1 - var(--detail-arrival,1))*105px)}
@media(prefers-reduced-motion:reduce){#adventure .adventure-card.reveal-motion,#adventure .tile-screen,#adventure .professional-mini,#adventure .tile-proof,#adventure .cube-art>.work-row{opacity:1!important;transform:none!important;translate:none!important;scale:none!important}}