/* The close: the icon the four corners become, the last line, how to get it, and the footer. */
.close { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 clamp(28px, 6.4vw, 120px); visibility: hidden; }
.cl-icon { position: relative; margin-top: clamp(96px, 15vh, 150px); width: clamp(120px, 15vh, 168px); height: clamp(120px, 15vh, 168px); }
.cl-bg { position: absolute; inset: 0; border-radius: 23%; background: #f7f1e1; box-shadow: 0 18px 44px rgba(60, 50, 20, 0.16), inset 0 0 0 1px rgba(120, 100, 40, 0.08); opacity: 0; }
.close h2 { margin-top: clamp(26px, 4vh, 40px); font-size: clamp(48px, min(5.6vw, 9vh), 104px); font-weight: 820; font-stretch: 112%; letter-spacing: -0.04em; line-height: 0.96; }
.close h2 .w { display: inline-block; overflow: hidden; vertical-align: top; padding: 0.05em 0 0.12em; margin: -0.05em 0 -0.12em; }
.close h2 .w > span { display: inline-block; }
.cl-sub { margin-top: 18px; font-size: clamp(16px, 1.3vw, 19px); color: rgba(var(--ink-rgb), var(--soft)); font-weight: 430; }
.cl-sub b { color: var(--ink); font-weight: 680; }
.cl-get { margin-top: 26px; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.foot { display: flex; justify-content: space-between; align-items: center; gap: 24px; width: min(1200px, 100%); margin-top: auto; padding: 24px 0 26px; border-top: 1px solid var(--line); font-size: 13.5px; color: var(--ink-2); }
.foot nav { display: flex; gap: 18px; flex-wrap: wrap; }
.foot nav a { color: var(--ink-2); }
.foot nav a:hover { color: var(--ink); }
/* the corners in flight (178 × 204, mapped onto a quad), and the plus the top left wears as the icon */
.cl-t { position: absolute; left: 0; top: 0; width: 178px; height: 204px; transform-origin: 0 0; visibility: hidden; z-index: 6; pointer-events: none !important; box-shadow: 0 10px 24px rgba(40, 60, 30, 0.14); }
.cl-t b { --plus: 0; position: absolute; left: 50%; top: 50%; width: 46%; height: 46%; transform: translate(-50%, -50%); opacity: var(--plus); }
.cl-t b::before, .cl-t b::after { content: ""; position: absolute; left: 50%; top: 50%; background: #fff; border-radius: 6px; transform: translate(-50%, -50%); }
.cl-t b::before { width: 100%; height: 22%; }
.cl-t b::after { width: 22%; height: 100%; }
.app-phone2 .pt { opacity: calc(1 - var(--lifted, 0)) !important; }
