.qira-footer { position: relative; background: #fff; overflow: hidden; font-family: var(--qira-font); } .qira-footer__main { position: relative; z-index: 2; max-width: var(--qira-band); margin: 0 auto; padding: 80px var(--qira-gutter) 64px; } .qira-footer__logo-wrap { padding-top: 4px; } .qira-footer__logo-wrap a { display: inline-block; text-decoration: none; } .qira-footer__logo-wrap img { width: 180px; height: auto; display: block; } .qira-footer__nav { display: flex; flex-direction: column; gap: 16px; } .qira-footer__nav-label { display: block; font-size: 11px; font-weight: var(--qira-fw-medium); letter-spacing: .12em; text-transform: uppercase; color: #9e9e9e; margin-bottom: 4px; } .qira-footer__nav a { display: block; font-size: 15px; font-weight: var(--qira-fw-medium); color: var(--font-color, #171717); text-decoration: none; line-height: var(--qira-lh-flat); transition: color .18s ease; } .qira-footer__nav a:hover { color: #6c43c6; } .qira-footer__watermark { position: absolute; right: max(var(--qira-gutter), calc((100% - var(--qira-max-width)) / 2)); top: 50%; transform: translateY(-50%); height: 95%; width: auto; aspect-ratio: 1 / 1; pointer-events: none; z-index: 1; opacity: .15; user-select: none; } .qira-footer__watermark img { width: 100%; height: 100%; display: block; object-fit: contain; } .qira-footer__bottom { position: relative; z-index: 2; max-width: var(--qira-band); margin: 0 auto; padding: 0 var(--qira-gutter) 40px; } .qira-footer__copyright { font-size: 13px; font-weight: var(--qira-fw-regular); color: var(--font-color); margin: 24px 0 0; line-height: var(--qira-lh-flat); } .qira-footer__disclaimers { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; max-width: 860px; } .qira-footer__disclaimers p { font-family: var(--qira-font); font-size: 11px; font-weight: var(--qira-fw-regular); color: var(--font-color); line-height: 1.6; margin: 0; } .qira-footer__legal-links { margin-top: 4px; } .qira-footer__disclaimers a { color: var(--font-color); text-decoration: underline; text-underline-offset: 2px; transition: color .18s ease; } .qira-footer__disclaimers a:hover { color: #6c43c6; } @media (max-width: 860px) { .qira-footer__main { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; padding: 56px 24px 48px; gap: 40px 32px; } .qira-footer__logo-wrap { grid-column: 1 / -1; } .qira-footer__logo-wrap img { width: 150px; } .qira-footer__watermark { width: auto; height: 90%; aspect-ratio: 1 / 1; right: var(--qira-gutter); opacity: .15; } .qira-footer__bottom { padding: 0 24px 32px; } .qira-footer__disclaimers { max-width: 100%; } } @media (max-width: 480px) { .qira-footer__watermark { display: block; width: 460px; height: 460px; right: var(--qira-gutter); top: 58%; opacity: .13; } }