/* the end of the page (js/ending.js): thank you, newsletter, socials. Shared bits first, then one block per look. */
section.end { position: relative; max-width: 1100px;   /* section.: the ToS line's last node is also class "end" */ margin: 0 auto; padding: 80px max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px)); }
.end .e-art { position: relative; z-index: 11; display: block; width: 100%; height: auto; user-select: none; -webkit-user-drag: none; }
.end .e-thanks { margin: 0; font: 700 clamp(52px, 8vw, 112px)/.9 var(--font-display); text-transform: uppercase; color: var(--color-text-primary); }
.end .e-thanks span { color: var(--cyber-cyan-500); text-shadow: 0 0 18px rgba(255,43,63,.45); }
.end .e-lead { margin: 12px 0 0; font: 500 16px/1.5 var(--font-mono); color: var(--cyber-chrome-300); }
.end .e-kicker { font: 700 12px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--cyber-cyan-400); }
.end .e-copy { margin: 6px 0 10px; font-size: 14px; line-height: 1.55; color: var(--cyber-chrome-300); }
.e-sr, .e-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.e-hp { left: -9999px; }
.e-form { display: flex; gap: 8px; max-width: 440px; }
.e-form.done { opacity: .5; }
.e-email { flex: 1; min-width: 0; padding: 11px 14px; border-radius: 8px; font: 500 15px var(--font-mono); color: var(--color-text-primary);
  background: rgba(10,11,16,.8); border: 1.5px solid var(--color-border-default); }
.e-email::placeholder { color: #6b6f7d; }
.e-email:focus { outline: none; border-color: var(--cyber-cyan-500); box-shadow: 0 0 12px rgba(255,43,63,.35); }
.e-go { flex: none; padding: 0 16px; border-radius: 8px; cursor: pointer; font: 700 14px var(--font-display); letter-spacing: .1em; text-transform: uppercase;
  color: #fff; background: var(--cyber-cyan-500); border: 0; box-shadow: 0 0 14px rgba(255,43,63,.5); transition: box-shadow .2s, transform .15s; }
.e-go:hover, .e-go:focus-visible { outline: none; box-shadow: 0 0 22px rgba(255,43,63,.8); transform: translateY(-1px); }
.e-go[disabled] { opacity: .6; cursor: default; }
.e-msg { min-height: 20px; margin-top: 6px; font: 500 13px var(--font-mono); color: var(--cyber-chrome-300); }
.e-msg.good { color: #7dffb0; } .e-msg.bad { color: var(--cyber-cyan-400); }
.e-fine { margin: 2px 0 0; font: 500 11px var(--font-mono); color: var(--cyber-chrome-300); opacity: .85; }
.e-fine a, .f-privacy a, .site-foot a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.e-fine a:hover, .f-privacy a:hover, .site-foot a:hover { color: var(--cyber-cyan-400); }
/* the last line of the page: privacy link */
.site-foot { display: flex; justify-content: center; gap: 18px; padding: 56px 16px max(28px, env(safe-area-inset-bottom, 0px));
  font: 500 12px var(--font-mono); letter-spacing: .08em; color: var(--cyber-chrome-300); }
.end a { text-decoration: none; }
.end a svg { flex: none; width: 20px; height: 20px; fill: currentColor; }
.end a:focus-visible { outline: 2px solid var(--cyber-cyan-500); outline-offset: 3px; }

/* ---- a: sign-off. pupD on the left, everything else beside him */
.e-a { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: end; }
.e-a-art { align-self: end; filter: drop-shadow(0 0 30px rgba(255,43,63,.25)); }
.e-a-side { display: grid; gap: 26px; padding-bottom: 48px; }
.e-a .e-block { display: grid; gap: 4px; }
.e-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.e-pill { display: inline-flex; align-items: center; gap: 9px; padding: 9px 16px 9px 12px; border-radius: 999px; color: var(--color-text-primary);
  background: rgba(18,20,29,.85); border: 1.5px solid var(--color-border-default); transition: border-color .2s, box-shadow .2s, transform .15s; }
.e-pill .e-net { display: none; }
.e-pill .e-handle { font: 600 14px var(--font-mono); }
.e-pill svg { color: var(--cyber-cyan-500); }
.e-pill:hover, .e-pill:focus-visible { border-color: var(--cyber-cyan-500); box-shadow: 0 0 16px rgba(255,43,63,.45); transform: translateY(-2px); }
@media (max-width: 760px) {
  .e-a { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
  .e-a-art { order: 2; width: min(260px, 70vw); }
  .e-a-side { padding-bottom: 0; justify-items: center; }
  .e-a .e-form, .e-pills { justify-content: center; margin-inline: auto; } }

/* ---- b: end credits. centred, socials as tiles, pupD rising from the bottom edge */
.e-b { display: grid; justify-items: center; text-align: center; gap: 18px; }
.e-b-top { font: 600 13px var(--font-mono); letter-spacing: .3em; text-transform: uppercase; color: #6b6f7d; }
.e-b .e-thanks { font-size: clamp(48px, 7.4vw, 104px); }
.e-b-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 190px)); gap: 12px; margin-top: 10px; width: 100%; justify-content: center; }
.e-tile { display: grid; justify-items: center; gap: 6px; padding: 18px 10px 16px; border-radius: 12px; color: var(--color-text-primary);
  background: rgba(18,20,29,.85); border: 1.5px solid var(--color-border-default); transition: border-color .2s, box-shadow .2s, transform .15s; }
.e-tile svg { width: 30px; height: 30px; color: var(--cyber-cyan-500); }
.e-tile .e-net { font: 700 12px var(--font-display); letter-spacing: .16em; text-transform: uppercase; color: var(--cyber-chrome-300); }
.e-tile .e-handle { font: 600 14px var(--font-mono); }
.e-tile:hover, .e-tile:focus-visible { border-color: var(--cyber-cyan-500); box-shadow: 0 0 18px rgba(255,43,63,.45); transform: translateY(-3px); }
.e-b-news { display: grid; justify-items: center; gap: 10px; margin-top: 18px; width: 100%; }
.e-b .e-form { width: 100%; }
.e-b .e-email { text-transform: lowercase; letter-spacing: .06em; }
.e-b .e-go { animation: e-blink 1.2s steps(2, jump-none) infinite; }
@keyframes e-blink { 50% { box-shadow: 0 0 4px rgba(255,43,63,.2); } }
.e-b-art { order: -1; width: min(220px, 56vw); margin-bottom: -6px; filter: drop-shadow(0 0 26px rgba(255,43,63,.25)); }   /* above the title, heart hands and all */
@media (max-width: 560px) { .e-b-tiles { grid-template-columns: minmax(0, 1fr); max-width: 300px; } .e-tile { grid-template-columns: auto auto 1fr; justify-items: start; align-items: center; padding: 12px 16px; } .e-tile svg { width: 22px; height: 22px; } }

/* ---- c: a long printed receipt, pupD leaning on it */
.e-c { display: flex; justify-content: center; align-items: flex-end; gap: 0; padding-bottom: 40px; }
.e-c-paper { position: relative; z-index: 11; width: min(400px, 100%); padding: 26px 26px 22px; box-sizing: border-box; text-align: center; color: #1c1c23; background: #ece8df;
  font: 600 13px/1.5 var(--font-mono); letter-spacing: .04em; box-shadow: 0 0 0 2px rgba(255,43,63,.6), 0 0 34px rgba(255,43,63,.3), 0 18px 40px rgba(0,0,0,.6);
  -webkit-mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 14px 51% repeat-x, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 14px 51% repeat-x;
  mask: conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / 14px 51% repeat-x, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 14px 51% repeat-x; }
.e-c-head { font-weight: 700; letter-spacing: .14em; } .e-c-sub { color: #6e6b66; }
.e-c-hr { margin: 12px 0; border-top: 2px dashed #b9b4a8; }
.e-c .e-thanks { font-size: 58px; color: #c8102a; }
.e-c .e-lead { margin-top: 4px; font-size: 13px; color: #4a4843; }
.e-c-label { margin-bottom: 6px; color: #6e6b66; letter-spacing: .14em; font-size: 11px; }
.e-c-lines { display: grid; gap: 2px; }
.e-line { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 4px; color: #1c1c23; }
.e-line svg { width: 16px; height: 16px; }
.e-line .e-net { font-weight: 700; }
.e-line .e-handle { margin-left: auto; color: #c8102a; }
.e-line:hover, .e-line:focus-visible { background: rgba(200,16,42,.1); }
.e-c-tear { position: relative; margin: 16px -26px; border-top: 2px dashed #8f8a80; }
.e-c-tear::before { content: "✂"; position: absolute; left: 8px; top: -12px; font-size: 16px; color: #8f8a80; background: #ece8df; padding: 0 4px; }
.e-c .e-form { margin: 0 auto; }
.e-c .e-email { background: #fff; color: #1c1c23; border-color: #b9b4a8; }
.e-c .e-msg { color: #4a4843; } .e-c .e-msg.good { color: #11803f; } .e-c .e-msg.bad { color: #c8102a; }
.e-c .e-fine { color: #4a4843; }
.e-c-art { width: 260px; margin-left: -40px; position: relative; z-index: 12; filter: drop-shadow(0 0 26px rgba(255,43,63,.25)); }
@media (max-width: 760px) { .e-c { flex-direction: column; align-items: center; } .e-c-art { order: -1; width: 200px; margin: 0 0 -14px; } }

@media (prefers-reduced-motion: reduce) { .e-b .e-go { animation: none; } .e-pill, .e-tile, .e-go { transition: none; } }
@media (max-width: 760px) { .e-email { font-size: 16px; } }   /* under 16px iPhones zoom in on focus (as in request.css) */
