/* Graphgo: the circular g is part of the composition, never a reading layer. */
#presenca,#historia,#contato{position:relative;isolation:isolate;overflow:clip}
#presenca::before,#historia::before,#contato::before,.routine-stage::before{content:"";position:absolute;z-index:-1;pointer-events:none;aspect-ratio:1;background:var(--fg,var(--ink));-webkit-mask:url('graphgo-g.svg') center/contain no-repeat;mask:url('graphgo-g.svg') center/contain no-repeat}
#presenca::before{width:clamp(680px,88vw,1400px);right:-35%;top:-140px;transform:rotate(20deg);opacity:.075}
#historia::before{width:clamp(660px,94vw,1500px);left:-42%;top:-130px;transform:rotate(-23deg);opacity:.085}
#contato::before{width:clamp(740px,88vw,1450px);right:-32%;bottom:-300px;transform:rotate(17deg);opacity:.10}
.routine-stage{isolation:isolate}
.routine-stage::before{width:95vw;right:-39%;top:-28%;transform:rotate(-16deg);opacity:.06}
#contato{padding-bottom:155px}

/* One accessible link: Lupo is decorative; the WhatsApp label is always readable. */
.lupo-contact{position:fixed;z-index:40;right:max(22px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));width:278px;height:138px;color:#f4f0e7;text-decoration:none;isolation:isolate;-webkit-tap-highlight-color:transparent}
.lupo-contact__label{position:absolute;right:98px;bottom:9px;display:flex;flex-direction:column;justify-content:center;min-height:62px;padding:12px 24px 12px 18px;border:1px solid #f4f0e740;border-radius:18px 5px 18px 18px;background:#171717;box-shadow:0 8px 28px #0002;white-space:nowrap;transition:transform .2s ease,background .2s ease}
.lupo-contact__label small{font:600 10px/1.4 'DM Sans',sans-serif;letter-spacing:.06em;color:#ddfb91}
.lupo-contact__label strong{font:700 14px/1.5 'DM Sans',sans-serif}
.lupo-contact__character{position:absolute;right:0;bottom:0;width:124px;aspect-ratio:1236/1272;transform-origin:50% 94%;animation:lupo-contact-wave 12s ease-in-out infinite;filter:drop-shadow(0 6px 5px #0002);pointer-events:none}
.lupo-contact__character img{display:block;width:100%;height:100%;object-fit:contain}
.lupo-contact__screen{position:absolute;left:28%;top:19.8%;width:40.6%;height:40.7%;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:radial-gradient(ellipse at 30% 20%,#44e47d,#18b657 80%);box-shadow:inset 0 0 0 1px #f4fff7b3,inset -2px -3px 4px #00662e66;transform:rotate(-11deg);animation:lupo-contact-screen 12s ease-in-out infinite}
.lupo-contact__screen::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 10%,#fff4 34%,transparent 45%);border-radius:inherit;pointer-events:none}
.lupo-contact__screen svg{width:65%;height:65%;fill:white;filter:drop-shadow(0 1px 1px #00632730)}
.lupo-contact:hover .lupo-contact__label{background:#253421;transform:translateX(-4px)}
.lupo-contact:focus-visible{outline:3px solid #ff751c;outline-offset:5px;border-radius:20px}
.lupo-contact.is-still .lupo-contact__character,.lupo-contact.is-still .lupo-contact__screen{animation:none}
.lupo-contact.is-still .lupo-contact__screen{opacity:1}
.lupo-contact.is-input-active,body:has(dialog[open]) .lupo-contact{visibility:hidden;pointer-events:none}
@keyframes lupo-contact-wave{0%,8%,25%,100%{transform:translateY(0) rotate(0)}12%,20%{transform:translateY(-5px) rotate(-4deg)}16%{transform:translateY(-3px) rotate(3deg)}}
@keyframes lupo-contact-screen{0%,5%,94%,100%{opacity:0}12%,87%{opacity:1}}
@media(max-width:700px){
 #presenca::before{width:850px;right:-470px;top:70px;opacity:.065}
 #historia::before{width:800px;left:-490px;top:0;opacity:.075}
 #contato::before{width:900px;right:-550px;bottom:-150px;opacity:.08}
 .routine-stage::before{width:850px;right:-480px;top:0;opacity:.045}
 .lupo-contact{right:max(10px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));width:243px;height:108px}
 .lupo-contact__character{width:99px}
 .lupo-contact__label{right:77px;bottom:5px;min-height:56px;padding:10px 19px 10px 14px}
 .lupo-contact__label strong{font-size:13px}
 .lupo-contact__label small{font-size:9px}
}
@media(max-height:500px){.lupo-contact{height:90px;width:227px}.lupo-contact__character{width:82px}.lupo-contact__label{right:63px;bottom:0}}
@media(prefers-reduced-motion:reduce){.lupo-contact__character,.lupo-contact__screen{animation:none}.lupo-contact__screen{opacity:1}.lupo-contact__label{transition:none}}