/* Version 2 point refinements. */
h2::after {
  animation: none;
  transform: scaleX(0);
  transform-origin: left center;
}

.reveal.is-visible h2::after,
h2.reveal.is-visible::after {
  animation: lineIn .8s .12s ease both;
}

.song-slider.reveal {
  position: relative;
  margin-top: clamp(48px, 7vw, 100px);
}

.song-viewport {
  overflow: hidden;
  width: 100%;
}

.song-track {
  display: flex;
  gap: 22px;
  width: 100%;
  transition: transform .62s cubic-bezier(.22,.7,.25,1);
  will-change: transform;
}

.song {
  flex: 0 0 calc((100% - 44px) / 3);
  min-width: 0;
  border-radius:14px;
  transform-origin:center center;
}

.song:hover {
  position:relative;
  z-index:2;
  transform:scale(1.012);
}

.song-top { height:58px;padding:9px 16px;align-items:center;font-size:11px;line-height:1.2; }
.funding-label { display:flex;flex-direction:column;gap:2px;white-space:nowrap; }
.funding-label b { font-size:22px;font-weight:600; }
.bids-label { display:grid;width:48%;gap:7px; }
.bids-label i { display:flex;align-items:center;justify-content:space-between;font-style:normal; }
.bids-label i span { font-size:16px; }
.bids-label i b { font-size:21px;font-weight:400; }
.bids-label em { position:relative;display:block;height:3px;border-radius:4px;background:#fff;font-style:normal;overflow:hidden; }
.bids-label em span { position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--pink); }
.cover { position:relative;height:136px; }
.cover button { width:64px;height:64px;padding:0;border:1px solid #ffffff14;font-size:0;background:#29292b88; }
.cover button span { display:block;width:0;height:0;margin-left:5px;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:19px solid #fff;filter:drop-shadow(0 1px 1px #0004); }
.song-duration { position:absolute;right:14px;bottom:9px;color:#fff;font-size:16px;line-height:1; }
.song-bottom { height:66px;padding:9px 16px;grid-template-columns:1fr auto;align-items:center;font-size:14px;line-height:1.2; }
.song-bottom>b { font-size:18px; }
.song-bottom small { font-size:14px; }
.song-bottom small:last-child { color:#36363b;font-weight:600; }
.status { display:grid;place-items:center;min-width:92px;height:30px;border-radius:9px;font-size:15px; }

.cover-d { background: linear-gradient(135deg,#30293d,#95566c,#19191f); }
.cover-e { background: linear-gradient(135deg,#163d4b,#297f8e,#11171c); }
.cover-f { background: linear-gradient(135deg,#3c2344,#9b3979,#251527); }
.cover-g { background: linear-gradient(135deg,#2f344f,#b06b4c,#151820); }
.cover-h { background: linear-gradient(135deg,#184139,#46776a,#121918); }
.cover.has-image { background-position:center; background-size:cover; }

.slider-controls { display:none; }
.slider-arrow {
  position:absolute;
  z-index:4;
  top:50%;
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid #ffffff66;
  border-radius:50%;
  color:#fff;
  background:#090b10bf;
  box-shadow:0 12px 28px #0006;
  cursor:pointer;
  transform:translateY(-50%);
  transition:background .25s,border-color .25s,transform .25s;
}
.slider-arrow:hover,.slider-arrow:focus-visible { background:var(--pink);border-color:var(--pink);transform:translateY(-50%) scale(1.08); }
.slider-arrow--prev { left:-68px; }
.slider-arrow--next { right:-68px; }

.faq { font-size:20px; }
.interest-box { min-height:289px; }
.interest-box article { display:flex;flex-direction:column;align-items:center;justify-content:center; }
.eco-grid a { display:none; }

.successful-auctions { padding:88px 0 92px;background:#07080b;color:#fff;overflow:hidden; }
.successful-slider { position:relative;margin-top:44px; }
.successful-viewport { overflow:hidden; }
.successful-track { display:flex;gap:32px;transition:transform .62s cubic-bezier(.22,.7,.25,1);will-change:transform; }
.successful-card { flex:0 0 calc((100% - 64px) / 3);min-width:0;overflow:hidden;background:#fff;color:#29292e;box-shadow:0 18px 40px #0008; }
.successful-cover { position:relative;height:155px;display:flex;align-items:center;gap:14px;padding:20px;color:#fff;background:#173149;overflow:hidden; }
.successful-cover::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,#07111dcc,transparent 78%); }
.successful-cover>* { position:relative;z-index:1; }
.successful-cover button { flex:0 0 auto;width:58px;height:58px;border:0;border-radius:50%;color:#fff;background:#ffffff31;box-shadow:0 8px 20px #0003;cursor:pointer;transition:transform .25s ease,background-color .25s ease,box-shadow .25s ease; }
.successful-cover button:hover,.successful-cover button:focus-visible { background:var(--pink);box-shadow:0 12px 28px #ed2b8d66;transform:scale(1.12);outline:none; }
.successful-cover button:active { transform:scale(1.03); }
.successful-cover div { display:flex;min-width:0;flex-direction:column; }
.successful-cover strong { font-size:16px; }
.successful-cover span { font-size:13px; }
.successful-cover small { position:absolute;right:13px;bottom:9px; }
.success-cover--yellow { background:linear-gradient(135deg,#f2bb28,#c95c36 65%,#5b1f31); }
.success-cover--violet { background:linear-gradient(135deg,#172638,#725b7c 60%,#252530); }
.success-cover--red { background:linear-gradient(135deg,#4a1822,#b8535b 60%,#1f141b); }
.success-cover--teal { background:linear-gradient(135deg,#123c45,#3e8581 60%,#111b20); }
.successful-cover.has-image { background-size:cover; }
.successful-info { min-height:72px;padding:15px 18px;display:flex;flex-direction:column;border-bottom:1px solid #ececf0; }
.successful-info strong { font-size:17px; }
.successful-info span { color:#9999a0; }
.successful-state { height:51px;padding:0 18px;display:flex;align-items:center;gap:10px;font-size:12px; }
.successful-state span { display:grid;width:19px;height:19px;place-items:center;border-radius:50%;background:#13a728;color:#fff;font-weight:700; }
.successful-total { height:62px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:var(--pink);color:#fff; }
.successful-total span { font-size:12px; }
.successful-total strong { font-size:24px;font-weight:500; }
.successful-arrow { position:absolute;z-index:4;top:50%;display:grid;width:46px;height:46px;place-items:center;padding:0;border:1px solid #ffffff55;border-radius:50%;background:#090b10dd;color:#fff;cursor:pointer;transform:translateY(-50%);transition:.25s; }
.successful-arrow:hover,.successful-arrow:focus-visible { border-color:var(--pink);background:var(--pink); }
.successful-arrow--prev { left:-68px; }
.successful-arrow--next { right:-68px; }

.logo-image {
  display:flex;
  align-items:center;
  line-height:0;
}
.logo-image img { width:135px;height:auto;display:block; }
.image-heading { display:flex;align-items:center;height:27px;margin-bottom:22px!important; }
.image-heading img { display:block;width:auto;max-width:100%;height:auto;object-fit:contain;object-position:left center; }
.image-heading--why img { height:14px; }
.image-heading--how img { height:14px; }
.eco-icon-image { display:block;width:auto;height:64px;margin:0 auto;object-fit:contain; }
.eco-title-image { display:flex;align-items:center;justify-content:center;height:27px;margin:18px 0 7px!important; }
.eco-title-image img { display:block;max-width:90%;height:14px;width:auto;object-fit:contain; }

footer {
  height:240px;
  padding:0;
  background-color:#08090b;
  background-image:linear-gradient(#07080bea,#07080bea),url('../assets/backgrounds/signup-crowd.png');
  background-position:center bottom;
  background-size:cover;
}
.footer-inner {
  width:min(var(--container),calc(100% - 64px));
  height:100%;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:146px 1px 93px;
  align-items:center;
  color:#9e9ea2;
  font-size:16px;
}
.footer-logo { justify-self:start;line-height:0; }
.footer-logo img { display:block;width:230px;height:auto; }
.footer-support { justify-self:center;display:flex;flex-direction:column;align-items:center;line-height:1.35; }
.footer-support span { color:#85858b; }
.footer-support a { color:#fff;font-size:18px; }
.footer-divider { grid-column:1/-1;width:100%;height:1px;background:#ffffff18; }
.footer-copyright { grid-column:1/-1;align-self:start;display:block;width:100%;height:auto;margin:26px 0 0;text-align:center;color:#77777e;font-size:13px; }

body.modal-open { overflow:hidden; }
.registration-modal { position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:24px;opacity:0;transition:opacity .22s ease; }
.registration-modal[hidden] { display:none; }
.registration-modal.is-open { opacity:1; }
.registration-modal__backdrop { position:absolute;inset:0;background:#05060ae8;backdrop-filter:blur(7px); }
.registration-modal__dialog { position:relative;width:min(520px,100%);padding:52px 48px 44px;border:1px solid #ffffff1c;border-radius:16px;background:#111218;color:#fff;text-align:center;box-shadow:0 28px 80px #000a;transform:translateY(18px) scale(.98);transition:transform .22s ease; }
.registration-modal.is-open .registration-modal__dialog { transform:none; }
.registration-modal__close { position:absolute;top:14px;right:16px;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:transparent;color:#aaaab1;font-size:30px;line-height:1;cursor:pointer;transition:color .2s,background .2s,transform .2s; }
.registration-modal__close:hover,.registration-modal__close:focus-visible { color:#fff;background:#ffffff12;transform:rotate(8deg);outline:none; }
.registration-modal__mark { display:grid;width:58px;height:58px;margin:0 auto 24px;place-items:center;border-radius:50%;background:#ed2b8d1c;color:var(--pink);font-size:28px;box-shadow:inset 0 0 0 1px #ed2b8d55; }
.registration-modal h2 { margin:0;font-size:27px;line-height:1.25; }
.registration-modal h2::after { margin:17px auto 0;animation:lineIn .65s .08s ease both; }
.registration-modal p { margin:24px 0 30px;color:#b9b9bf;font-size:14px;line-height:1.75; }
.registration-modal .btn { margin:auto; }

@media(max-width:1280px) {
  .slider-arrow--prev { left:10px; }
  .slider-arrow--next { right:10px; }
  .successful-arrow--prev { left:10px; }
  .successful-arrow--next { right:10px; }
}

@media(min-width:701px) and (max-width:1024px) {
  .container { width:calc(100% - 48px); }
  .hero { min-height:750px;background-position:58% center; }
  .hero-inner { padding-top:105px; }
  .hero-text { max-width:610px; }
  .song-slider.reveal { margin-top:72px; }
  .song { flex-basis:calc((100% - 22px) / 2); }
  .slider-arrow--prev { left:8px; }
  .slider-arrow--next { right:8px; }
  .why-grid { gap:42px; }
  .how-grid { gap:42px; }
  .how-grid article+article { padding-left:36px; }
  .interest-box article { padding:38px 22px; }
  .successful-slider {
    display:grid;
    grid-template-columns:1fr auto 12px auto 1fr;
    grid-template-areas:
      "cards cards cards cards cards"
      ". previous . next .";
  }
  .successful-viewport { grid-area:cards; }
  .successful-track { gap:24px; }
  .successful-card { flex-basis:calc((100% - 24px) / 2); }
  .successful-arrow { position:static;margin-top:20px;transform:none;box-shadow:0 8px 22px #0005; }
  .successful-arrow:hover,.successful-arrow:focus-visible { transform:scale(1.07); }
  .successful-arrow--prev { grid-area:previous; }
  .successful-arrow--next { grid-area:next; }
  .eco-grid { gap:16px; }
  .signup-form { width:min(560px,calc(100% - 48px)); }
  .footer-inner { width:calc(100% - 48px); }
  .footer-logo img { width:200px; }
}

@media(max-width:700px) {
  .song-slider.reveal { margin-top:clamp(42px,12vw,64px); }
  .song-track { gap:0; }
  .song { flex-basis:100%; }
  .song-top { height:53px;padding:8px 14px;font-size:10px; }
  .funding-label b { font-size:20px; }
  .bids-label i span { font-size:14px; }
  .bids-label i b { font-size:18px; }
  .cover { height:124px; }
  .cover button { width:58px;height:58px; }
  .song-duration { font-size:15px; }
  .song-bottom { height:60px;padding:8px 14px; }
  .song-bottom>b { font-size:16px; }
  .song-bottom small { font-size:13px; }
  .status { min-width:82px;height:28px;font-size:14px; }
  .slider-arrow { width:42px;height:42px; }
  .slider-arrow--prev { left:8px; }
  .slider-arrow--next { right:8px; }
  .interest-box { min-height:0; }
  .interest-box article { min-height:289px; }
  .logo-image img { width:108px; }
  .image-heading--why img { height:12px; }
  .image-heading--how img { height:13px; }
  .eco-icon-image { height:62px; }
  .successful-auctions { padding:60px 0; }
  .successful-slider {
    display:grid;
    grid-template-columns:1fr auto 12px auto 1fr;
    grid-template-areas:
      "cards cards cards cards cards"
      ". previous . next .";
    margin-top:34px;
  }
  .successful-viewport { grid-area:cards; }
  .successful-track { gap:0; }
  .successful-card { flex-basis:100%; }
  .successful-cover { height:170px; }
  .successful-arrow { position:static;width:42px;height:42px;margin-top:18px;transform:none;box-shadow:0 8px 22px #0005; }
  .successful-arrow:hover,.successful-arrow:focus-visible { transform:scale(1.07); }
  .successful-arrow--prev { grid-area:previous; }
  .successful-arrow--next { grid-area:next; }
  footer { height:auto;min-height:250px;padding:0; }
  .footer-inner { width:calc(100% - 36px);min-height:250px;grid-template-columns:1fr;grid-template-rows:92px 76px 1px 81px;text-align:center; }
  .footer-logo { justify-self:center; }
  .footer-logo img { width:170px; }
  .footer-support { justify-self:center; }
  .footer-divider { grid-column:1; }
  .footer-copyright { grid-column:1;margin:22px 0 0;font-size:11px; }
  .registration-modal { padding:18px; }
  .registration-modal__dialog { padding:46px 24px 34px; }
  .registration-modal h2 { font-size:23px; }
  .registration-modal p { font-size:13px; }
  .registration-modal .btn { width:100%; }
}

@media(max-width:420px) {
  .container { width:calc(100% - 28px); }
  .header-inner { gap:18px; }
  .logo-image img { width:98px; }
  .btn-small { width:88px;height:34px;font-size:11px; }
  .hero { min-height:700px;background-position:61% center; }
  .hero-inner { padding-top:62px; }
  .hero h1 { max-width:230px;font-size:28px; }
  .song-top { padding:8px 11px; }
  .funding-label { white-space:normal; }
  .funding-label b { font-size:18px; }
  .bids-label { width:46%; }
  .bids-label i span { font-size:12px; }
  .bids-label i b { font-size:16px; }
  .song-bottom { padding:8px 11px; }
  .song-bottom>b { max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .status { min-width:75px; }
  .why,.how,.security,.interest,.ecosystem,.successful-auctions { padding-top:52px;padding-bottom:52px; }
  .successful-total strong { font-size:21px; }
  .signup-form { gap:12px; }
  .signup-form input,.signup-form select { height:52px; }
}

@media(hover:none) {
  .song:hover,.eco-grid article:hover { transform:none; }
  .successful-cover button:hover { transform:none;background:#ffffff31;box-shadow:0 8px 20px #0003; }
}

@media(prefers-reduced-motion:reduce) {
  h2::after { animation:none!important;transform:scaleX(1); }
  .song-track { transition:none; }
}
