/* A guided look at the real app screens. */
.app-tour{background:#f8fafb;scroll-margin-top:24px}
.app-tour .section-head{max-width:780px;margin:0 auto 64px}
.app-tour .section-lead{max-width:570px}
.app-tour__steps{list-style:none;padding:0;margin:0 auto;max-width:860px;scroll-margin-top:28px}
.app-tour__step{position:relative;display:grid;grid-template-columns:44px 190px minmax(0,1fr);column-gap:40px;align-items:center;padding:0 0 54px;scroll-margin-top:36px}
.app-tour__step:not(:last-child)::before{content:"";position:absolute;left:21px;top:62px;bottom:-24px;width:2px;background:#d9e6e8}
.app-tour__number{position:relative;z-index:1;align-self:start;margin-top:24px;display:grid;place-items:center;width:44px;height:44px;border:6px solid #f8fafb;border-radius:50%;background:#287e87;color:white;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;box-shadow:0 0 0 1px #d9e6e8}
.app-tour__figure{margin:0;min-width:0}
.app-tour__preview{display:block;text-decoration:none;color:var(--medium)}
.app-tour__preview:hover{text-decoration:none;color:#287e87}
.app-tour__phone{display:block;padding:5px;background:#25303d;border:1px solid #47515c;border-radius:25px;box-shadow:0 16px 28px -18px rgba(20,37,74,.4);transition:transform .2s ease}
.app-tour__preview:hover .app-tour__phone{transform:translateY(-3px)}
.app-tour__phone img{display:block;width:100%;height:auto;aspect-ratio:736/1600;border-radius:19px;background:#eef0f5}
.app-tour__zoom{display:block;margin-top:10px;text-align:center;font-size:12px}
.app-tour__zoom::after{content:" ↗"}
.app-tour__copy{min-width:0;padding:12px 0}
.app-tour__label{display:block;font-size:13px;font-weight:600;color:#287e87;margin-bottom:10px}
.app-tour__title{font-family:var(--font-display);font-size:clamp(25px,2.6vw,32px);font-weight:400;line-height:1.23;letter-spacing:-.018em;color:var(--navy);margin:0 0 16px;text-wrap:balance}
.app-tour__copy p{font-size:17px;line-height:1.65;color:var(--dark);margin:0;max-width:43ch}
.app-tour__switcher{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.app-tour__switcher[hidden]{display:none}
.app-tour__switcher button{padding:7px 11px;border:1px solid #ccdadd;border-radius:6px;background:transparent;color:var(--dark);font:inherit;font-size:13px;line-height:1.35;cursor:pointer;transition:background .2s,border-color .2s}
.app-tour__switcher button:hover{border-color:#287e87}
.app-tour__switcher button[aria-pressed="true"]{background:#e0f0f1;border-color:#287e87;color:#205e68;font-weight:600}
.app-tour__preview:focus-visible,.app-tour__switcher button:focus-visible,.app-screen-dialog__close:focus-visible{outline:3px solid #287e87;outline-offset:5px}
.app-tour__step.is-you .app-tour__copy{outline:2px solid var(--cyan);outline-offset:14px;border-radius:4px}
.app-tour__end{text-align:center;margin:0 auto;max-width:600px;padding-top:12px}
.app-tour__end p{font-size:17px;color:var(--dark);margin:0 0 20px}
.app-screen-dialog{max-width:min(520px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:12px;border:1px solid #d9e6e8;border-radius:20px;background:#fff;color:var(--navy);box-shadow:0 24px 80px rgba(0,0,0,.25);overscroll-behavior:contain}
.app-screen-dialog::backdrop{background:rgba(10,23,46,.78)}
.app-screen-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:10px}
.app-screen-dialog__header p{font-size:15px;margin:0}
.app-screen-dialog__close{border:1px solid #ccdadd;background:#f4f7fa;color:var(--navy);border-radius:7px;padding:8px 12px;font:inherit;font-size:14px;cursor:pointer}
.app-screen-dialog__image{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 110px);margin:auto;border-radius:10px}
body:has(.app-screen-dialog[open]){overflow:hidden}
/* Keep the original screen proportions in the rest of the page as well. */
.phone-mock img[src*="/app-atual/"]{aspect-ratio:736/1600;object-fit:contain;height:auto}
.phone-mock:has(img[src*="/app-atual/"])::before{display:none}
@media(max-width:760px){
  .app-tour{padding:64px 20px}
  .app-tour .section-head{margin-bottom:40px}
  .app-tour__step{grid-template-columns:30px 150px minmax(0,1fr);column-gap:22px;padding-bottom:42px}
  .app-tour__number{width:30px;height:30px;border-width:4px;font-size:12px}
  .app-tour__step:not(:last-child)::before{left:14px;top:54px}
  .app-tour__title{font-size:25px}
  .app-tour__copy p{font-size:16px}
}
@media(max-width:540px){
  .app-tour__step{grid-template-columns:26px minmax(0,1fr);column-gap:14px;row-gap:20px;padding-bottom:44px;align-items:start}
  .app-tour__number{grid-column:1;grid-row:1;margin-top:0;width:26px;height:26px;border-width:3px}
  .app-tour__step:not(:last-child)::before{left:12px;top:26px;bottom:0}
  .app-tour__copy{grid-column:2;grid-row:1;padding:0}
  .app-tour__label{margin-bottom:7px;font-size:12px}
  .app-tour__title{font-size:26px;margin-bottom:12px;text-wrap:pretty}
  .app-tour__copy p{font-size:16px;line-height:1.6}
  .app-tour__figure{grid-column:2;grid-row:2;width:190px;max-width:100%;justify-self:center}
  .app-tour__switcher{gap:6px;margin-top:16px}
  .app-tour__switcher button{font-size:12px;padding:7px 9px}
  .app-tour__end .btn-cta{white-space:normal;line-height:1.4}
}
@media(prefers-reduced-motion:reduce){.app-tour__phone{transition:none}.app-tour__preview:hover .app-tour__phone{transform:none}}