.duo{position:relative;width:100%;min-height:680px;background:#eeeef1;border-radius:32px;overflow:hidden}.phone-demo{position:absolute;width:270px;border:7px solid #232323;border-radius:34px;overflow:hidden;box-shadow:0 24px 42px #23232330;background:white}.phone-demo img{width:100%;display:block}.phone-demo.staff{left:28px;top:38px;z-index:2;transform:rotate(-3deg)}.phone-demo.resident{right:22px;top:104px;width:240px;transform:rotate(4deg)}.role{position:absolute;background:white;border:1px solid #ff385744;padding:7px 15px;border-radius:30px;font-size:13px;font-weight:bold;z-index:4}.role.staff-label{left:38px;top:10px}.role.resident-label{right:25px;bottom:18px}.side .phone-demo{width:45%;top:72px;transform:none}.side .staff{left:3%}.side .resident{right:3%}.side .resident-label{top:25px;bottom:auto}.side .staff-label{top:25px}.side{min-height:720px}
@media(max-width:680px){.duo{min-height:510px}.phone-demo.staff{width:58%;left:9px;top:48px}.phone-demo.resident{width:51%;right:8px;top:110px}.role{font-size:11px;padding:5px 10px}.role.staff-label{left:15px;top:14px}.role.resident-label{right:12px;bottom:14px}.side{min-height:420px}.side .phone-demo{width:46%;top:62px;transform:none}.side .staff{left:2%}.side .resident{right:2%}.side .resident-label{top:18px;bottom:auto}.side .staff-label{top:18px}}

@media(max-width:680px){
.site-header{gap:12px}.brand img{width:min(175px,43vw)}.header-actions{min-width:0}.button-small{padding-inline:10px}.hero{display:flex;flex-direction:column;gap:0}.hero-copy{display:contents}.hero-copy>.eyebrow,.hero-copy>h1,.hero-copy>.hero-lead,.hero-copy>.hero-actions{order:0;width:100%}.hero-actions{margin-bottom:28px}.duo.side{order:1;background:transparent;min-height:0;width:100%;display:flex;flex-direction:column;gap:18px;overflow:visible;padding:0}.side .phone-demo{position:relative;top:auto;left:auto;right:auto;width:100%;height:286px;transform:none;border:5px solid #232323;border-radius:24px;box-shadow:0 12px 24px #23232315;flex-shrink:0}.side .phone-demo img{width:100%;height:auto;max-width:none;transform:translateY(-24px)}.side .role{position:static;align-self:flex-start;font-size:12px;padding:6px 13px;margin:0 0 -9px}.side .resident-label{order:2}.side .resident{order:3}.download-panel{order:2;margin:30px 0 22px;width:100%}.trust-line{order:3;margin-top:0;width:100%;justify-content:center}
}

.zoom-trigger{padding:0;cursor:zoom-in;text-align:left}.zoom-trigger:focus-visible{outline:3px solid #ff3857;outline-offset:5px}.zoom-hint{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#232323e8;color:white;border-radius:30px;padding:7px 12px;font:12px Arial;z-index:5}.image-modal{position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100%;margin:0;padding:0;background:#f7f7f8;border:0}.image-modal::backdrop{background:#000a}.modal-toolbar{height:68px;padding:10px 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #ddd;background:white}.modal-toolbar strong{flex:1;font-size:16px}.modal-toolbar button{cursor:pointer;border:1px solid #ddd;border-radius:8px;padding:9px 12px;font-size:14px;min-height:44px}.modal-view{height:calc(100% - 68px);overflow:auto;padding:16px;text-align:center;overscroll-behavior:contain}.modal-view img{height:100%;width:auto;max-width:100%;object-fit:contain;display:block;margin:auto;cursor:zoom-in;transform:none}.modal-view.enlarged img{height:auto;width:800px;max-width:none;cursor:zoom-out}.modal-toolbar button:focus-visible{outline:3px solid #ff3857}
@media(max-width:680px){.modal-toolbar{padding:10px;gap:6px}.modal-toolbar strong{font-size:14px}.modal-toolbar button{padding:8px;font-size:12px}.zoom-hint{font-size:11px}.modal-view.enlarged img{width:650px}}

/* Moldura de telefone nas telas completas. */
.modal-view img{box-sizing:border-box;height:auto;width:auto;max-height:100%;max-width:100%;border:8px solid #232323;border-radius:36px;background:#fff;box-shadow:0 16px 32px #23232326}
.modal-view.enlarged img{max-height:none;border-width:10px;border-radius:44px}
@media(max-width:680px){.modal-view img{border-width:6px;border-radius:30px}.modal-view.enlarged img{border-width:9px;border-radius:40px}}