/* Reference composition: 1600 × 900. Scale the complete scene to the viewport. */
.cuida-gateway.gateway-reference {
  --scene: min(1vw, 1.77778svh, 16px);
  min-height: 100svh;
  padding: calc(var(--scene) * 3.4) 20px calc(var(--scene) * 6);
  justify-content: flex-start;
  background: #c1eaff url('../img/gateway-health-background.png') center / cover no-repeat;
  font-family: Arial, Helvetica, sans-serif;
}
.gateway-reference:after { display: none; }
.gateway-reference .cuida-gateway-logo { display: block; flex: none; margin-bottom: calc(var(--scene) * 1.5); z-index: 1; mix-blend-mode: multiply; }
.gateway-reference .cuida-gateway-logo img { display: block; width: calc(var(--scene) * 42.5); height: calc(var(--scene) * 11.2); max-width: none; object-fit: contain; mix-blend-mode: multiply; }
.gateway-reference .cuida-access-grid { width: calc(var(--scene) * 58.4); gap: calc(var(--scene) * 1.75); }
.gateway-reference .cuida-access-card { display: flex; flex-direction: column; align-items: center; min-width: 0; padding: calc(var(--scene) * 1.65) calc(var(--scene) * 1.7) calc(var(--scene) * 1.75); border: 1px solid #ffffffb3; border-radius: calc(var(--scene) * 2.3); background: linear-gradient(135deg,#fffffff5,#f7fbfff2); box-shadow: 0 18px 45px #1474b51f; }
.gateway-reference .cuida-access-picture { width: 100%; height: calc(var(--scene) * 15.9); margin: 0 0 calc(var(--scene) * 1); border-radius: 0; background: none; overflow: visible; }
.gateway-reference .cuida-access-picture img,.gateway-reference .cuida-access-picture.patients img,.gateway-reference .cuida-access-picture:not(.patients) img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transform: scale(1.12); transform-origin: center bottom; }
.gateway-reference .cuida-access-card h2 { color: #031f70; font: 700 calc(var(--scene) * 3.08)/1.12 Arial,Helvetica,sans-serif; letter-spacing: calc(var(--scene) * -.1); white-space: nowrap; margin: 0 0 calc(var(--scene) * .55); }
.gateway-reference .cuida-access-card h2 span { display: inline; color: #0783f2; }
.gateway-reference .cuida-access-card.professional h2 span { color: #0dbba8; }
.gateway-reference .cuida-access-card p { font-size: calc(var(--scene) * 1.43); line-height: 1.35; letter-spacing: -.6px; white-space: nowrap; color: #66718b; margin: 0; min-height: 0; }
.gateway-reference .cuida-access-arrow { width: calc(var(--scene) * 5.5); height: calc(var(--scene) * 5.5); margin: calc(var(--scene) * 1.4) 0 0; font-size: calc(var(--scene) * 3.2); background: linear-gradient(140deg,#0085fa,#008af0); box-shadow: 0 13px 27px #059aea47; }
.gateway-reference .professional .cuida-access-arrow { background: linear-gradient(140deg,#0ebfae,#0dbbac); box-shadow: 0 13px 27px #13c7b942; }
.gateway-reference .gateway-side-title { position: absolute; top: 23.3%; left: 4.3%; margin: 0; font-size: calc(var(--scene) * 2.95); line-height: .95; font-weight: 400; color: #237eaf; letter-spacing: -1px; }
.gateway-reference .gateway-side-title span { color: inherit; }
.gateway-reference .gateway-side-title:after,.gateway-reference .cuida-gateway-signature:after { content: ''; display: block; width: calc(var(--scene) * 3.5); height: 4px; margin-top: calc(var(--scene) * 1.7); background: #45a5d0; border-radius: 3px; opacity: .6; }
.gateway-reference .cuida-gateway-signature { position: absolute; right: 3%; top: 49.5%; max-width: none; margin: 0; color: #398dbb; text-align: left; font-size: calc(var(--scene) * 2.08); line-height: 1.2; font-style: italic; font-weight: 400; }
@media (min-width: 1800px) { .cuida-gateway.gateway-reference { padding-top: max(54px,calc((100svh - 790px)/2)); } }
@media (max-width: 900px) {
  .cuida-gateway.gateway-reference { --scene: 12px; padding: 35px 24px 80px; justify-content: center; background-position: center; }
  .gateway-reference .cuida-gateway-logo { margin-bottom: 32px; }
  .gateway-reference .cuida-gateway-logo img { width: min(510px,82vw); height: auto; }
  .gateway-reference .cuida-access-grid { width: min(700px,100%); }
  .gateway-reference .cuida-access-picture { height: auto; aspect-ratio: 4/3; }
  .gateway-reference .cuida-access-card h2 { font-size: clamp(24px,3.7vw,37px); }
  .gateway-reference .cuida-access-card p { font-size: clamp(12px,1.8vw,17px); white-space: normal; letter-spacing: -.2px; }
  .gateway-reference .gateway-side-title { position: static; font-size: 22px; margin: -10px 0 25px; letter-spacing: -.5px; }
  .gateway-reference .gateway-side-title br { display: none; }
  .gateway-reference .gateway-side-title br:after { content: ' '; }
  .gateway-reference .gateway-side-title:after { display: none; }
  .gateway-reference .cuida-gateway-signature { position: static; margin: 30px 0 0; text-align: center; font-size: 20px; }
  .gateway-reference .cuida-gateway-signature br { display: none; }
  .gateway-reference .cuida-gateway-signature:after { margin: 14px auto 0; }
}
@media (max-width: 540px) {
  .cuida-gateway.gateway-reference { --scene: 9px; padding: 32px 16px 45px; justify-content: flex-start; }
  .gateway-reference .cuida-gateway-logo { margin-bottom: 25px; }
  .gateway-reference .cuida-gateway-logo img { width: min(330px,88vw); }
  .gateway-reference .gateway-side-title { font-size: 19px; margin-bottom: 26px; }
  .gateway-reference .cuida-access-grid { gap: 14px; }
  .gateway-reference .cuida-access-card { padding: 16px 10px 20px; border-radius: 22px; }
  .gateway-reference .cuida-access-picture { margin-bottom: 13px; }
  .gateway-reference .cuida-access-card h2 { font-size: clamp(21px,6vw,29px); line-height: 1.18; letter-spacing: -.9px; white-space: normal; margin-bottom: 10px; }
  .gateway-reference .cuida-access-card h2 span { display: block; }
  .gateway-reference .cuida-access-card p { font-size: 12px; line-height: 1.5; min-height: 36px; }
  .gateway-reference .cuida-access-arrow { width: 49px; height: 49px; font-size: 28px; margin-top: 18px; }
  .gateway-reference .cuida-gateway-signature { font-size: 17px; max-width: 260px; line-height: 1.5; margin-top: 32px; }
}

.gateway-blog-nav{position:absolute;top:24px;right:4%;z-index:3}.gateway-blog-nav a{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.1rem;border-radius:24px;background:#fff;color:#0c275b;font-weight:700;box-shadow:0 3px 14px #12345612}.gateway-blog-nav a:focus-visible{outline:3px solid #08b5a5}@media(max-width:575px){.gateway-blog-nav{top:16px;right:14px}.gateway-blog-nav a{padding:.45rem .8rem;font-size:.85rem}}

/* Android download navigation 20261006 */
.gateway-blog-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}.gateway-blog-nav a{min-height:44px}.gateway-blog-nav a:focus-visible{outline-offset:3px}.gateway-blog-nav .bi-android{color:#16804a}@media(max-width:1100px){.gateway-blog-nav{position:static;order:-1;margin-bottom:24px;max-width:100%}.gateway-blog-nav a{padding:.45rem .8rem;font-size:.85rem}}

/* Profile portraits — 20261020 */
.gateway-reference .cuida-access-card {
  padding-top: 0;
  overflow: hidden;
  border-color: #ffffffdc;
  box-shadow: 0 20px 55px #17679a26, inset 0 1px 0 #fff;
}
.gateway-reference .cuida-access-picture {
  width: calc(100% + var(--scene) * 3.4);
  height: clamp(210px, 36svh, 300px);
  margin-bottom: calc(var(--scene) * 1.2);
  overflow: hidden;
  background: #fff;
  border-radius: 0;
  mask-image: linear-gradient(#000 87%, transparent);
  -webkit-mask-image: linear-gradient(#000 87%, transparent);
}
.gateway-reference .cuida-access-picture img,
.gateway-reference .cuida-access-picture.patients img,
.gateway-reference .cuida-access-picture:not(.patients) img {
  object-fit: cover;
  object-position: center top;
  transform: none;
}
.gateway-reference .cuida-access-card:focus-visible {
  outline: 3px solid #0759b9;
  outline-offset: 5px;
}
.gateway-reference .cuida-access-card.professional:focus-visible {
  outline-color: #008c7e;
}
@media (max-width: 900px) {
  .gateway-reference .cuida-access-picture { height: auto; aspect-ratio: 1; }
}
@media (max-width: 540px) {
  .gateway-reference .cuida-access-picture {
    width: calc(100% + 20px);
    margin-bottom: 14px;
  }
  .gateway-reference .cuida-access-card { padding-top: 0; }
}
