/* Ilustraciones en capas generadas (proceso + workflows) */
.il3{position:relative;width:100%;aspect-ratio:480/440;container-type:inline-size;overflow:visible}
.il3 .L{position:absolute;transform:translate(calc(var(--mx,0)*var(--d,0)*-.3px),calc(var(--my,0)*var(--d,0)*-.3px));transition:transform 1.1s cubic-bezier(.22,.61,.36,1);will-change:transform;pointer-events:none}
.il3 .L img{display:block;width:100%;height:auto;transform:rotate(var(--r,0deg));filter:drop-shadow(0 14px 18px #05081a66)}
.il3 .glow{position:absolute;aspect-ratio:1;border-radius:50%;filter:blur(46px);pointer-events:none}
.il3 .glow-lime{background:#b8ea11}.il3 .glow-violet{background:#7a64b3}
.il3 .eye span{display:block;position:relative;aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 0 40px #9d8ee855}
.il3 .eye img{position:absolute;max-width:none;width:520%;left:-345%;top:-96%;height:auto;filter:none;transform:none}
.il3 .t span{display:block;transform:rotate(var(--r,0deg));white-space:nowrap;line-height:1.05}
.il3 .serif{font-family:'Iowan Old Style',Palatino,Georgia,serif;font-style:italic}
.il3 .serif i{font-style:italic;display:block;line-height:.8}
.il3 .hand{font-family:'Bradley Hand','Segoe Script','Comic Sans MS',cursive;font-style:italic;color:#e8e0f6;opacity:.92}
.il3 .caps{font-weight:600;letter-spacing:.14em;line-height:1.5}
.il3 .dark{color:#171c2a}.il3 .sans{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif}.il3 .bold{font-weight:800;letter-spacing:-.02em}
.il3 .sp{aspect-ratio:1}.il3 .sp svg{display:block;width:100%;height:100%}.il3 .sp-lilac{color:#e6dcf6}.il3 .sp-lime{color:#b8ea11}
.il3 .stamp{aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 28%,#dcf86a,#b8ea11 60%,#7fa80a);box-shadow:0 0 22px #b8ea1166,0 8px 14px #05081a66;display:grid;place-items:center}
.il3 .stamp svg{width:62%;height:62%}
.il3 .spec span{display:block;transform:rotate(var(--r,0deg));padding:7cqw 4.5cqw 6cqw;border-radius:5px;background:linear-gradient(135deg,#f6efe2,#ddd1bb);box-shadow:0 16px 24px #05081a77,0 0 0 1px #fff3 inset;color:#171c2a}
.il3 .spec b{display:block;font-size:17cqw;line-height:.9;font-weight:400}
.il3 .spec i{display:block;height:1px;background:#171c2a88;margin:3cqw 0 2.4cqw}.il3 .spec em{display:block;font-style:normal;font-size:2.3cqw;letter-spacing:.12em;opacity:.78;line-height:1.55}
.il3 .chip span{display:block;transform:rotate(var(--r,0deg));padding:2.2cqw 3cqw;border-radius:2.6cqw;background:linear-gradient(135deg,#ffffff38,#cdbff01a 55%,#ffffff0d);border:1px solid #ffffff55;box-shadow:0 14px 24px #05081a77,inset 0 1px 0 #fff6;backdrop-filter:blur(8px);position:relative;color:#f1f4f7}
.il3 .chip u{position:absolute;left:3cqw;top:50%;width:2.4cqw;aspect-ratio:1;border-radius:50%;background:#b8ea11;transform:translateY(-50%);box-shadow:0 0 10px #b8ea11}
.il3 .chip u~b{margin-left:4.2cqw}.il3 .chip b{display:block;font-size:2.6cqw;letter-spacing:.1em}.il3 .chip small{display:block;margin-left:inherit;font-size:1.9cqw;letter-spacing:.14em;color:#c9b9e8}
.il3 .chip u~small{margin-left:4.2cqw}
.il3 .chip-lilac span{background:linear-gradient(135deg,#d9cdf3,#a893d8);color:#171c2a;border-color:#fff8}.il3 .chip-lilac b{font-size:3.2cqw;letter-spacing:0}.il3 .chip-lilac small{color:#3a2f66;font-size:2.6cqw;letter-spacing:0}
.pr-art{height:auto!important;aspect-ratio:480/440;perspective:none!important;transform-style:flat!important;isolation:auto!important}
.pr-art:after{display:none!important}
.workflow-infographic .flow-symbol{height:auto!important;aspect-ratio:480/440;overflow:visible}
.workflow-infographic .flow-symbol:before,.workflow-infographic .flow-symbol:after{display:none!important}

.il3 .hl{aspect-ratio:5/1;background:linear-gradient(90deg,#b8ea11,#dcf86a);border-radius:2px;transform:rotate(-3deg) translate(calc(var(--mx,0)*var(--d,0)*-.3px),calc(var(--my,0)*var(--d,0)*-.3px));filter:blur(.3px);box-shadow:0 0 18px #b8ea1166;opacity:.92}
.il3 .scr svg{display:block;width:100%;height:auto;filter:drop-shadow(0 0 8px #b8ea1166)}
.il3 .sk span{display:block;transform:rotate(var(--r,0deg))}
.il3 .sk .bar{display:block;height:2.6cqw;border-radius:1.4cqw;background:#171c2a;opacity:.85;margin-bottom:2.2cqw}
.il3 .sk .bar.s{width:62%;height:1.8cqw;opacity:.5}
.il3 .sk .blk{display:block;width:34%;height:6cqw;border-radius:1cqw;background:#b8ea11;margin-top:4cqw;box-shadow:0 0 14px #b8ea1166}
.il3 .spec span{padding:6cqw 5cqw 5cqw}
.il3 .spec i.g{display:block;width:9cqw;height:9cqw;border-radius:50%;border:2.2cqw solid #171c2a;border-right-color:transparent;transform:rotate(-30deg);margin-bottom:3cqw}
.il3 .spec b{display:block;height:2cqw;border-radius:1cqw;background:#171c2a;opacity:.82;margin-bottom:2cqw;font-size:0}
.il3 .spec b.s{width:70%;opacity:.5;height:1.4cqw}.il3 .spec b.s2{width:46%;opacity:.35;height:1.4cqw}
.il3 .spec em{display:block;width:40%;height:2.2cqw;border-radius:1cqw;background:#b8ea11;margin-top:3cqw}
.il3 .chip span{display:flex;flex-direction:column;gap:1.5cqw;padding:2.6cqw 3cqw 2.6cqw 8.4cqw}
.il3 .chip .bar{display:block;height:1.5cqw;border-radius:1cqw;background:#f1f4f7;opacity:.85}.il3 .chip .bar.s{width:56%;height:1.1cqw;background:#c9b9e8;opacity:.8}
.il3 .chip-lilac span{padding-left:3.4cqw}.il3 .chip-lilac .bar{background:#171c2a;opacity:.8}.il3 .chip-lilac .bar.s{background:#3a2f66;opacity:.6}

.contact-modal-shell{overflow:clip;border-radius:inherit;grid-template-columns:.95fr 1.05fr;gap:clamp(1.5rem,4vw,3.4rem);padding:clamp(1.8rem,4vw,3.4rem);align-items:stretch}
.contact-modal-aside{position:relative;display:flex;flex-direction:column;min-width:0;min-height:100%;padding:0;border:0;border-radius:0;background:none;overflow:visible}
.contact-modal-aside:before{content:"";position:absolute;inset:-6% -14% -2% -14%;z-index:0;pointer-events:none;background:radial-gradient(closest-side at 50% 46%,#3a3380a8,transparent),radial-gradient(closest-side at 62% 88%,#b8ea1118,transparent)}
.contact-modal-aside>*{position:relative;z-index:1}
.contact-modal-logo{display:block;width:118px;height:auto;position:relative;z-index:1}
.contact-modal-art{flex:1;min-height:0;display:grid;place-items:center}
.contact-modal-art .il3{width:min(112%,440px);margin-top:-1rem}
.contact-modal-main{display:flex;flex-direction:column;justify-content:center;min-width:0}
.contact-modal-main .contact-modal-copy{max-width:none;margin:0 0 1.6rem}
.contact-modal-main .contact-modal-copy h2{margin:.7rem 0 .7rem}
@media(max-width:860px){.contact-modal-shell{grid-template-columns:1fr}.contact-modal-aside{display:none}}
@media(hover:hover){.workflow-infographic .flow-stage:hover .il3{transform:translateY(-2px)}}
.il3{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
@media(max-width:640px){.pr-art{max-width:380px;margin:auto;width:100%}.creative-process,.workflow-infographic{overflow-x:clip}}
@media(prefers-reduced-motion:reduce){.il3 .L,.il3{transition:none;transform:none!important}}

/* v3: iridescent dark direction */
.il3 .glow-violet{background:#5b3fa0}.il3 .glow-lime{background:#b8ea11}

/* hero-mobile (phones only, up to 640px): one continuous scene. The lens sits behind and under the copy, fades into the dark page,
   and a left-to-right veil keeps the text readable. */
@media(max-width:640px){
 .hero{display:flex;justify-content:center;min-height:calc(100svh - 76px);padding:0;overflow:hidden;isolation:isolate}
 .hero-layout{position:relative;z-index:2;display:flex;align-items:flex-start;min-height:calc(100svh - 76px);padding:2.6rem var(--pad) 3rem}
 .hero-art{position:absolute;inset:0;z-index:-2;width:auto;height:auto;order:initial;background:#0b1422;overflow:hidden}
 .hero-art img,.hero-art video{position:absolute;right:-27vw;bottom:23vh;left:auto;top:auto;width:206vw;max-width:none;height:auto;object-fit:contain;filter:brightness(.9) saturate(1.05)!important;transform:none!important;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 26%),linear-gradient(0deg,transparent 0%,#000 30%),linear-gradient(90deg,transparent 0%,#000 26%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 0%,#000 26%),linear-gradient(0deg,transparent 0%,#000 30%),linear-gradient(90deg,transparent 0%,#000 26%);mask-composite:intersect}
 .hero:after{content:"";position:absolute;inset:0;height:auto;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(7,13,24,.82) 0%,rgba(7,13,24,.5) 42%,rgba(7,13,24,.12) 78%,transparent 100%),linear-gradient(0deg,#111822 0%,transparent 22%)}
 .hero h1,.hero-description,.hero-eyebrow{text-shadow:0 2px 16px rgba(5,10,20,.75)}
}
