*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#9a70e9}body{font-family:Arial,sans-serif}.hero{height:auto;aspect-ratio:1 / 1.12;max-height:100svh;position:relative;overflow:hidden;isolation:isolate;background:#aa82ef url('assets/fundo.webp') center/cover no-repeat}.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(47,16,96,.18),transparent 30%);z-index:600}.scene-wrap{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-end}.scene{position:relative;width:1100px;height:1100px;flex:none;transform-origin:center bottom;transform:scale(var(--scale, .7))}.portrait{position:absolute;width:700px;height:auto;left:200px;top:100px;z-index:300;pointer-events:none}canvas{position:absolute;inset:0;width:1100px;height:1250px;pointer-events:none}#back{z-index:50}#front{z-index:400}#logos{display:contents}.logo{position:absolute;width:180px;height:100px;left:0;top:0;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 0 2px rgba(245,230,255,.45)) drop-shadow(0 0 7px rgba(199,158,255,.20));transform-origin:center;will-change:transform,filter;backface-visibility:visible}#motion{position:absolute;right:20px;bottom:20px;z-index:700;display:flex;align-items:center;gap:9px;border:1px solid #ffffff60;border-radius:30px;background:#fff9;color:#271041;padding:11px 16px;font-size:12px;cursor:pointer;backdrop-filter:blur(15px)}#motion:focus-visible{outline:3px solid #24103d;outline-offset:4px}.icon{font-size:14px}.button-label{letter-spacing:.03em}@media(min-width:800px){.hero{height:100svh;aspect-ratio:auto;min-height:700px}.scene-wrap{align-items:flex-end}#motion{bottom:28px;right:32px}}
/* Faixas invisÃveis; geometria e movimento dos logotipos preservados. */
#back,#front{visibility:hidden}
/* Fundo violeta profundo para contraste com os logotipos brancos. */
.hero{background-color:#32135e;background-image:linear-gradient(rgba(31,8,65,.73),rgba(36,10,76,.65)),url('assets/fundo.webp')}
#toggle-controls{position:absolute;left:20px;bottom:20px;z-index:701;border:1px solid #ffffff60;border-radius:30px;background:#fff9;color:#271041;padding:11px 16px;cursor:pointer;backdrop-filter:blur(15px)}#controls[hidden]{display:none}#controls{position:fixed;z-index:1000;right:16px;top:16px;width:min(350px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:20px;border:1px solid #ffffff35;border-radius:20px;background:rgba(29,15,49,.97);box-shadow:0 20px 80px #0007;color:#f8f1ff;font-size:13px;backdrop-filter:blur(20px);color-scheme:dark}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;font-size:17px}#controls button{cursor:pointer;color:inherit}#close-controls{border:0;background:transparent;font-size:28px;line-height:1;padding:0 4px}#controls label{display:block;margin:18px 0 8px;line-height:1.5}#controls output{float:right;color:#d3b6fa;font-variant-numeric:tabular-nums}#controls input[type=range]{display:block;width:100%;margin:10px 0 0;accent-color:#c7a1ff;cursor:pointer;min-height:24px}#controls select{width:100%;margin-top:8px;padding:10px;border:1px solid #ffffff35;border-radius:9px;background:#3b2752;color:#fff;font:inherit}#controls .hint{color:#c5b5d8;font-size:11px;line-height:1.6;margin:5px 0 12px}#controls hr{border:0;border-top:1px solid #ffffff25;margin:22px 0}#reset-controls{width:100%;padding:12px;margin-top:10px;border:1px solid #ffffff35;border-radius:10px;background:#ffffff0a}#controls :focus-visible,#toggle-controls:focus-visible{outline:2px solid #dbbeff;outline-offset:3px}@media(min-width:800px){#toggle-controls{left:32px;bottom:28px}}
/* Cylindrical logos replace the flat image planes; the ribbon remains absent. */
#back,#front{visibility:visible}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Art direction: diffuse light, precise type, transparent surfaces. */
html,body{background:#0a0a0b;color:#f5f5f7}html{scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.hero{background:#0a0a0b;background-image:radial-gradient(ellipse at 52% 78%,#25212e 0%,#131217 34%,#0a0a0b 70%)}
.hero:after{z-index:600;background:linear-gradient(0deg,#0a0a0b 0%,#0a0a0b99 5%,transparent 21%)}
.site-header{position:absolute;inset:0 0 auto;z-index:710;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{display:flex;align-items:center;color:#f5f5f7;text-decoration:none;font-size:18px;letter-spacing:-1px;font-weight:750}.wordmark span{font-weight:350}.wordmark i{display:none}.header-note{display:none;font-size:11px;color:#8e8e95}.edition{font-size:8px;letter-spacing:.12em;color:#c5c4ce;border:1px solid #ffffff36;border-radius:30px;padding:7px 10px;background:linear-gradient(120deg,#ffffff0c,transparent)}
.ambient{position:absolute;inset:0;pointer-events:none;overflow:hidden}.light-field{position:absolute;left:14%;right:9%;top:24%;bottom:0;background:radial-gradient(ellipse at 48% 80%,#b6a6ed32 0%,#927ad718 27%,transparent 64%)}.light-edge{position:absolute;left:18%;right:18%;height:44%;bottom:-23%;border-radius:50%;background:radial-gradient(ellipse at 50% 15%,#d7ddff7a 0%,#8a9bd646 15%,#7770b924 35%,transparent 67%);transform:scaleX(1.6)}
.scene-caption{position:absolute;z-index:705;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;color:#afabb8;font-size:7px;letter-spacing:.12em;padding:9px 13px;border:1px solid #ffffff18;border-radius:30px;background:linear-gradient(135deg,#ffffff09,#ffffff02)}.live-dot{width:3px;height:3px;border-radius:50%;background:#e1dbf5}
#toggle-controls{left:auto;right:18px;bottom:63px;font-size:10px;padding:9px 13px;color:#d9d6e1;border-color:#ffffff2a;background:linear-gradient(130deg,#ffffff12,#ffffff04);box-shadow:inset 0 1px 0 #ffffff0c;backdrop-filter:blur(10px)}
.intro{position:relative;background:#0a0a0b;padding:34px 24px 40px;z-index:705}.eyebrow{font-size:8px;letter-spacing:.16em;color:#8e8b96;margin:0 0 18px}.intro h1{font-size:clamp(52px,14vw,74px);line-height:.99;letter-spacing:-.065em;font-weight:600;margin:0;color:#f5f5f7}.intro h1 span{background:linear-gradient(110deg,#e5e4ed 0%,#b2a8d4 57%,#827c92 100%);background-clip:text;-webkit-background-clip:text;color:transparent}.intro-description{font-size:14px;line-height:1.6;letter-spacing:-.02em;color:#9a969f;margin:24px 0}#explore{display:inline-flex;align-items:center;gap:24px;border:1px solid #d4cde13d;border-radius:100px;padding:12px 18px;color:#e9e5f0;background:linear-gradient(145deg,#ffffff12,#ffffff03);box-shadow:inset 0 1px 0 #ffffff12;font:inherit;font-size:12px;cursor:pointer}#explore span{font-size:18px}#explore:hover{border-color:#ffffff80;background:#ffffff14}#explore:focus-visible{outline:2px solid #d8c7ff;outline-offset:4px}.intro-detail{display:flex;gap:10px;align-items:center;font-size:8px;color:#706d77;margin-top:42px}.detail-line{height:1px;width:20px;background:#57525f}.detail-index{margin-left:auto;font-size:7px;letter-spacing:.05em}
@media(min-width:800px){.site-header{padding:30px 42px}.header-note{display:block}.edition{font-size:9px}.wordmark{font-size:21px}.intro{position:absolute;left:42px;bottom:80px;width:clamp(240px,26vw,390px);padding:0;background:transparent;pointer-events:none}.intro-copy>*{pointer-events:auto}.intro h1{font-size:clamp(44px,4.6vw,80px)}.intro-description{font-size:14px;margin:24px 0}.eyebrow{font-size:9px}.intro-detail{margin-top:38px;font-size:8px}.scene-caption{left:auto;right:42px;bottom:30px;transform:none;font-size:8px}#toggle-controls{right:42px;left:auto;bottom:83px;font-size:11px}.light-edge{left:28%;right:14%;bottom:-25%;height:55%}.hero{min-height:700px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.light-edge{border-radius:0;background:radial-gradient(ellipse at 50% 50%,#e1d9ff50 0%,#b9a6e72c 16%,#8e7ab618 35%,transparent 66%);height:75%;bottom:-42%}
/* Reference composition: blue architectural light and diagonal glass ribbons. */
html,body{background:#080e20}.hero{height:100svh;min-height:0;max-height:none;aspect-ratio:auto;background:#111d39;background-image:linear-gradient(90deg,#040712 0%,#0a1732 17%,#294a82 26%,#b4c9e5 43%,#d9e4f2 82%,#92afd9 100%)}
.hero:after{display:none}.scene{height:800px}.portrait{left:200px;top:65px;width:700px}.window-light{position:absolute;inset:0;overflow:hidden;pointer-events:none}.window-pane{position:absolute;left:41%;top:-10%;width:47%;height:125%;background:linear-gradient(90deg,#dbe8f0c9,#e1ebf6b3);box-shadow:0 0 24px #a9d2ff88}.window-shadow{position:absolute;left:12%;right:-20%;height:28%;top:39%;transform:skewY(17deg);background:linear-gradient(90deg,#16306055,#112344d9 45%,#12264bd9 87%,transparent);filter:blur(3px)}.window-ribs{position:absolute;left:30%;top:0;height:100%;width:11%;background:repeating-linear-gradient(90deg,transparent 0,transparent 6px,#a4cfff30 8px,#578bca55 10px,transparent 13px);mask-image:linear-gradient(90deg,transparent,#000 40%,#000 80%,transparent);box-shadow:-35px 0 100px #0066ff66}
#toggle-controls{bottom:18px;right:18px;font-size:10px;color:#e6edff;background:#08152c55;border-color:#ffffff29;opacity:.65}#toggle-controls:hover{opacity:1}
@media(max-width:799px){.hero{height:auto;aspect-ratio:1 / 1.16;min-height:0}.window-pane{left:41%;width:55%}.window-shadow{height:26%;top:38%}.scene{height:800px}#toggle-controls{bottom:12px;right:12px;padding:8px 12px}}
/* Shared scene light on the cutout; its geometry and expression stay untouched. */
.portrait{filter:contrast(1.13) saturate(1.08) brightness(.96)}
.portrait-blue-light,.portrait-shadow{position:absolute;left:200px;top:65px;width:700px;height:1180px;pointer-events:none;-webkit-mask-image:url('assets/retrato.webp');mask-image:url('assets/retrato.webp');-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.portrait-blue-light{z-index:301;background:linear-gradient(100deg,#004dffb3 0%,#005eff75 15%,#207dff30 28%,transparent 48%);mix-blend-mode:screen}
.portrait-shadow{z-index:302;background:linear-gradient(105deg,#06153080 2%,transparent 47%,#06143117 100%);mix-blend-mode:multiply}
.hero{background:#101b32 url('assets/cena-azul-sem-sombra.webp') center/cover no-repeat}.window-light{display:none}
/* Diffused reflected light gives the right wall depth without a hard shadow. */
.hero{background-image:radial-gradient(ellipse at 91% 25%,rgba(148,186,235,.22) 0%,rgba(104,153,222,.10) 22%,transparent 45%),radial-gradient(ellipse at 78% 88%,rgba(136,140,207,.18) 0%,transparent 43%),linear-gradient(90deg,transparent 70%,rgba(129,172,228,.06) 86%,rgba(173,204,239,.13) 89%,transparent 94%),url('assets/cena-azul-sem-sombra.webp')}
/* Embedded client-facing composition. */
html,body{height:100%;overflow:hidden}.hero{height:100vh!important;min-height:0!important;aspect-ratio:auto!important}#toggle-controls,#controls{display:none!important}
.scene-wrap{align-items:flex-start!important}
/* Lilac environment; skin and original logo artwork are kept independent. */
.hero{background:#171027}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 91% 25%,rgba(148,186,235,.22),transparent 45%),radial-gradient(ellipse at 78% 88%,rgba(136,140,207,.18),transparent 43%),url('assets/cena-azul-sem-sombra.webp') center/cover no-repeat;filter:hue-rotate(42deg) saturate(.85)}
.portrait-blue-light{background:linear-gradient(100deg,#7538e9a3 0%,#8852ef65 15%,#aa80ef25 28%,transparent 48%)}
.portrait-shadow{background:linear-gradient(105deg,#190b3380 2%,transparent 47%,#180d2a17 100%)}
.scene{transform-origin:center top}
@media(max-width:799px){.scene-wrap{padding-top:82px}}
.portrait{-webkit-mask-image:linear-gradient(#000 0%,#000 68%,transparent 89%);mask-image:linear-gradient(#000 0%,#000 68%,transparent 89%)}
.portrait-blue-light,.portrait-shadow{-webkit-mask-image:url('assets/retrato.webp'),linear-gradient(#000 0%,#000 68%,transparent 89%);mask-image:url('assets/retrato.webp'),linear-gradient(#000 0%,#000 68%,transparent 89%);-webkit-mask-composite:source-in;mask-composite:intersect}
@media(min-width:901px){.scene-wrap{left:18vw;right:0}}
/* Align the portrait above the mobile copy; the background fills the whole opening. */
@media(max-width:600px){.scene-wrap{padding-top:80px!important}.scene{transform-origin:center top}.portrait{-webkit-mask-image:linear-gradient(#000 0%,#000 56%,transparent 78%);mask-image:linear-gradient(#000 0%,#000 56%,transparent 78%)}.portrait-blue-light,.portrait-shadow{-webkit-mask-image:url('assets/retrato.webp'),linear-gradient(#000 0%,#000 56%,transparent 78%);mask-image:url('assets/retrato.webp'),linear-gradient(#000 0%,#000 56%,transparent 78%);-webkit-mask-composite:source-in;mask-composite:intersect}}