@font-face {
  font-family: "DM Sans";
  src: url("./dm-sans.woff2") format("woff2");
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("./instrument-serif-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
:root {
  color-scheme: dark;
  --ink: #141115;
  --surface: #1b171c;
  --paper: #f8f2f2;
  --muted: #c2b6bd;
  --rose: #f2bfc6;
  --line: #42353f;
  --gutter: clamp(22px, 5.6vw, 88px);
  font: 100% / 1.55 "DM Sans", system-ui, sans-serif;
  background: var(--ink);
  color: var(--paper);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button, summary, .offer { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .68; }
:focus-visible { outline: 3px solid #ffced3; outline-offset: 5px; }
a:hover { color: #ffd8dc; }
h1, h2, h3, p, dl, dd { margin: 0; }
h1, h2 { font-weight: 500; line-height: 1; letter-spacing: -.065em; }
h1 em, h2 em { font-family: "Instrument Serif", Georgia, serif; font-style: italic; font-weight: 400; letter-spacing: -.04em; color: var(--rose); }
h2 { font-size: clamp(48px, 5.35vw, 84px); }
.wrap { width: min(100% - var(--gutter) * 2, 1240px); margin-inline: auto; }
.skip, .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip:focus { clip-path: none; width: auto; height: auto; top: 10px; left: 12px; z-index: 15; padding: 9px 16px; background: var(--ink); }
.mast { position: relative; z-index: 5; border-bottom: 1px solid #31262f; background: #151116; }
.mast-inner, .footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mast-inner { min-height: 76px; }
.brand, .mini-brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; font-weight: 700; color: var(--paper); letter-spacing: -.06em; line-height: 1; }
.brand { font-size: 28px; }
.brand-pay { font-weight: 450; }
.mark { position: relative; display: inline-block; width: 28px; height: 25px; flex: none; }
.mark::before, .mark::after { content: ""; position: absolute; bottom: 1px; transform: skew(-23deg); }
.mark::before { left: 4px; height: 23px; width: 10px; background: #f6c5cc; }
.mark::after { left: 17px; height: 16px; width: 9px; background: #c28695; }
.mark.small { width: 22px; height: 22px; }
.mark.small::before { width: 8px; height: 19px; left: 3px; }
.mark.small::after { width: 7px; height: 13px; left: 14px; }
.desktop-nav { display: flex; align-items: center; gap: 34px; }
.desktop-nav a, .mobile-nav nav a { color: #dfd4da; font-size: 14px; font-weight: 500; }
.desktop-nav a:hover, .mobile-nav nav a:hover { color: var(--rose); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 15px; min-height: 49px; padding: 0 23px; border: 1px solid transparent; border-radius: 9px; font-weight: 650; font-size: 15px; line-height: 1.35; transition: background .18s, border-color .18s, color .18s; }
.button.primary { background: var(--rose); color: #281620; }
.button.primary:hover:enabled, a.button.primary:hover { background: #ffd7db; }
.button.outline { min-height: 41px; padding-inline: 16px; border-color: #54434e; color: #f2e6ec; background: transparent; font-size: 14px; }
.button.outline:hover { border-color: var(--rose); color: var(--rose); }
.arr { display: inline-block; position: relative; width: 14px; height: 12px; flex: none; }
.arr::before { content: ""; position: absolute; height: 1.5px; top: 5px; width: 13px; left: 0; background: currentColor; }
.arr::after { content: ""; position: absolute; width: 7px; height: 7px; right: 1px; top: 2px; border-top: 1.5px solid; border-right: 1.5px solid; transform: rotate(45deg); }
.arr.diagonal { transform: rotate(-42deg); }
.mobile-nav { display: none; }
.hero { background: #141015; position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid #352a31; }
.hero-art { pointer-events: none; position: absolute; right: 0; top: 0; bottom: 0; width: 60%; z-index: -1; mask-image: linear-gradient(90deg, transparent, black 22%); }
.hero-art img { object-fit: cover; object-position: 52% 52%; width: 100%; height: 100%; display: block; }
.hero-inner { min-height: clamp(558px, 43.5vw, 680px); display: flex; align-items: center; padding-block: clamp(48px, 4.7vw, 76px); }
.hero-copy { width: 49%; }
.status, .demo-tag { display: inline-flex; align-items: center; width: fit-content; }
.status { gap: 8px; border: 1px solid #60444e; border-radius: 99px; padding: 4px 11px; color: #eccdd3; font-size: 12px; font-weight: 550; letter-spacing: .015em; }
.dot { width: 6px; height: 6px; border-radius: 50%; background: #ecacb7; }
h1 { font-size: clamp(78px, 6.65vw, 110px); line-height: .96; margin: 23px 0 23px -.05em; }
h1 em { font-size: 1.12em; letter-spacing: -.045em; }
.hero-copy > p { max-width: 455px; font-size: clamp(16px, 1.23vw, 19px); color: #d0c4cb; line-height: 1.58; }
.hero-actions { display: flex; align-items: center; gap: 25px; margin-top: 29px; }
.text-link, .back, .address { font-weight: 550; }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; }
.down { color: var(--rose); font-size: 18px; }
.section { padding-block: clamp(66px, 7.4vw, 110px); }
.section-intro, .contact-layout p { color: var(--muted); font-size: clamp(16px, 1.25vw, 19px); line-height: 1.6; }
.demo-section { background: #1c171d; }
.demo-layout { display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr); gap: clamp(36px, 7vw, 110px); align-items: center; }
.demo-intro h2 { margin-bottom: 19px; }
.demo-intro .section-intro { max-width: 440px; }
.offers { display: grid; gap: 9px; padding: 0; border: 0; min-width: 0; margin: 31px 0 0; max-width: 405px; }
.offers legend { padding: 0; margin-bottom: 10px; color: #d7c9d0; font-size: 13px; font-weight: 620; }
.offer { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid #4b3c47; border-radius: 9px; background: #201b21; cursor: pointer; }
.offer:has(input:checked) { border-color: #ba8998; background: #30232d; }
.offer:has(input:focus-visible) { outline: 3px solid var(--rose); outline-offset: 3px; }
.offer:hover { border-color: #956f80; }
.offer input { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); }
.radio-indicator { width: 16px; height: 16px; border: 1.5px solid #aa96a3; border-radius: 50%; flex: none; }
.offer input:checked + .radio-indicator { background: var(--rose); border-color: var(--rose); box-shadow: inset 0 0 0 3px #30232d; }
.offer-label { font-size: 15px; }
.offer-price { margin-left: auto; color: #e2cbd3; font-size: 14px; font-variant-numeric: tabular-nums; }
.demo-canvas { display: grid; align-items: center; justify-items: center; position: relative; min-height: 460px; padding: 40px 22px; border: 1px solid #ac808e; border-radius: 24px; background-color: #c49aa6; background-image: linear-gradient(#643e4d12 1px, transparent 1px), linear-gradient(90deg,#643e4d12 1px, transparent 1px), radial-gradient(ellipse at 24% 18%,#f2dad7 0,#dbb7bb 47%,#bd92a3 80%,#9d788c 100%); background-size: 24px 24px, 24px 24px, auto; }
.terminal { width: min(100%, 372px); background: #201a21; border: 1px solid #614c57; border-radius: 16px; box-shadow: 0 20px 42px #4625364d, 0 4px 10px #4625362b; }
.terminal-top { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 17px 20px; border-bottom: 1px solid #443641; }
.mini-brand { font-size: 18px; gap: 6px; }
.demo-tag { padding: 3px 8px; border: 1px solid #594451; border-radius: 99px; color: #dfc7d2; font-size: 11px; font-weight: 550; }
.terminal-body { padding: 23px 22px 22px; }
.eyeline { font-size: 12px; font-weight: 600; color: #deb0c0; margin-bottom: 10px; }
.screen-title { font-size: clamp(21px, 2vw, 28px); line-height: 1.13; font-weight: 550; letter-spacing: -.045em; }
.screen-title:focus { outline: 0; }
.amount { font-size: clamp(32px, 3.55vw, 49px); line-height: 1.2; letter-spacing: -.06em; font-weight: 500; margin-top: 11px; overflow-wrap: anywhere; }
.amount span { font-size: 13px; letter-spacing: .01em; color: #cbafbd; font-weight: 600; }
.amount.btc-amount { font-size: clamp(24px, 2.6vw, 36px); font-variant-numeric: tabular-nums; }
.screen-note, .noscript { font-size: 14px; line-height: 1.48; color: #c9bac3; margin-top: 8px; }
.noscript { padding: 0 22px 20px; }
.checkout-lines { padding: 12px 0; margin: 17px 0; border-block: 1px solid #443641; display: grid; gap: 6px; font-size: 13px; }
.checkout-lines div { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.checkout-lines dt { color: #bfaeb9; }
.checkout-lines dd { text-align: right; font-weight: 550; }
.bitcoin { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: 3px; border-radius: 50%; color: #281b25; background: #e0a8ad; font-size: 13px; }
.button.full { width: 100%; min-height: 44px; font-size: 14px; }
.screen-back { width: 100%; margin-top: 9px; padding: 6px; border: 0; color: #e2c4d0; background: transparent; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.screen-back:hover { color: #fff; }
.use-section { background: #151216; border-block: 1px solid #392e37; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; }
.section-heading .section-intro { max-width: 390px; }
.uses { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(24px, 3.4vw, 52px); margin-top: 42px; }
.uses article { border-top: 1px solid #5b4453; padding-top: 24px; }
.uses h3 { font-size: clamp(21px,1.8vw,28px); letter-spacing: -.045em; line-height: 1.2; font-weight: 550; margin: 19px 0 9px; }
.uses p { color: var(--muted); font-size: 15px; line-height: 1.65; max-width: 350px; }
.use-icon { display: block; position: relative; width: 29px; height: 28px; color: #e6b0c1; }
.use-icon::before,.use-icon::after { position: absolute; content: ""; }
.icon-members::before { left: 5px; top: 1px; width: 8px; height: 8px; border: 1.5px solid; border-radius: 50%; box-shadow: 10px 3px 0 -1px #151216, 10px 3px 0 .5px #e6b0c1; }
.icon-members::after { left: 1px; bottom: 1px; width: 16px; height: 10px; border: 1.5px solid; border-bottom: 0; border-radius: 10px 10px 0 0; box-shadow: 8px 1px 0 -1px #151216, 9px 1px 0 0 #d09baa; }
.icon-download { font-size: 28px; line-height: 22px; text-align: center; }
.icon-download::after { inset: auto 3px 0; height: 7px; border: 1.5px solid; border-top: 0; border-radius: 0 0 3px 3px; }
.icon-list::before { inset: 2px 0 0; border: 1.5px solid; border-radius: 3px; }
.icon-list::after { left: 5px; right: 5px; height: 1.5px; top: 10px; background: currentColor; box-shadow: 0 5px currentColor; }
.question-section { background: #1b171c; }
.questions-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(30px,7vw,110px); }
.questions { border-top: 1px solid #51414d; }
.questions details { border-bottom: 1px solid #51414d; }
.questions summary { display: block; position: relative; padding: 19px 34px 19px 0; cursor: pointer; font-weight: 520; line-height: 1.45; font-size: clamp(16px,1.3vw,20px); }
summary::-webkit-details-marker { display: none; }
.questions summary::after { content: "+"; position: absolute; right: 3px; top: 17px; font-size: 22px; font-weight: 400; color: var(--rose); line-height: 1.4; }
.questions details[open] summary::after { content: "−"; }
.questions details p { padding: 0 28px 22px 0; color: var(--muted); font-size: 15px; }
.contact-section { padding-block: clamp(48px,6.4vw,95px); background: #30222d; border-block: 1px solid #513a47; }
.contact-layout { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.contact-layout h2 { margin-bottom: 14px; }
.contact-actions { display: grid; gap: 11px; justify-items: center; }
.address { font-size: 13px; color: #ddbdc9; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
footer { background: #141115; }
.footer-inner { min-height: 85px; flex-wrap: wrap; color: #b7a9b3; font-size: 13px; }
.footer-brand { font-size: 22px; gap: 7px; }
.footer-dot { padding-inline: 5px; color: #ca9aac; }
.back { color: #e4cbd7; }
.back span { margin-left: 4px; }
@media (min-width: 1600px) {
  .hero-art { width: calc(50% + 130px); }
}
@media (max-width: 900px) {
  .desktop-nav { gap: 20px; }
  .hero-copy { width: 52%; }
  h1 { font-size: clamp(66px,8vw,80px); }
  .hero-art { width: 53%; }
  .demo-layout { gap: 28px; grid-template-columns: .9fr 1.1fr; }
  .demo-canvas { padding: 25px 15px; min-height: 405px; }
  .questions-layout { gap: 28px; }
}
@media (max-width: 710px) {
  .mast-inner { min-height: 62px; gap: 12px; }
  .mast .brand { font-size: 25px; }
  .desktop-nav, .header-contact { display: none; }
  .mobile-nav { display: block; position: relative; }
  .mobile-nav summary { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 6px; cursor: pointer; }
  .menu-lines { width: 21px; height: 11px; border-block: 1.5px solid #f0d8e1; }
  .mobile-nav nav { position: absolute; top: calc(100% + 4px); right: 0; min-width: 175px; padding: 6px; background: #261f28; border: 1px solid #54434e; border-radius: 9px; box-shadow: 0 10px 20px #0006; }
  .mobile-nav nav a { display: block; padding: 10px 13px; border-radius: 5px; }
  .mobile-nav nav a:hover { background: #372937; }
  .hero { display: flex; flex-direction: column; }
  .hero-inner { order: 0; min-height: 0; padding-block: 39px 0; }
  .hero-copy { width: 100%; }
  h1 { font-size: clamp(60px,13.5vw,80px); margin-block: 18px; }
  .hero-copy > p { max-width: 470px; }
  .hero-actions { margin-top: 22px; gap: 12px 18px; flex-wrap: wrap; }
  .hero-actions a { white-space: nowrap; }
  .hero-art { z-index: 0; position: relative; order: 1; width: 100%; height: clamp(200px,54vw,310px); margin-top: 4px; mask-image: linear-gradient(to bottom, transparent, black 19%); }
  .hero-art img { object-position: 50% 59%; }
  .demo-layout,.questions-layout { grid-template-columns: 1fr; gap: 29px; }
  .demo-intro .section-intro, .offers { max-width: none; }
  .offers { margin-top: 21px; }
  .demo-canvas { min-height: 350px; padding: 28px 18px; border-radius: 18px; }
  .section-heading, .contact-layout { display: block; }
  .section-heading .section-intro { max-width: 485px; margin-top: 15px; }
  .uses { grid-template-columns: 1fr; gap: 23px; margin-top: 29px; }
  .uses article { padding: 18px 0 0 45px; position: relative; }
  .uses h3 { margin-top: 0; }
  .use-icon { position: absolute; left: 0; top: 20px; }
  .uses p { max-width: none; }
  .contact-actions { justify-items: start; margin-top: 23px; }
  .footer-inner { padding-block: 21px; column-gap: 16px; row-gap: 14px; }
  .footer-inner > span { flex-basis: 100%; order: 3; }
}
@media (max-width: 370px) {
  :root { --gutter: 18px; }
  .hero-actions { gap: 8px 14px; }
  .hero-actions .button { min-height: 46px; padding-inline: 13px; gap: 9px; font-size: 14px; }
  .hero-actions .text-link { font-size: 13px; gap: 5px; }
  .button { padding-inline: 15px; }
  .demo-canvas { padding: 17px 10px; }
  .terminal-top, .terminal-body { padding-inline: 14px; }
  .offer { gap: 8px; padding-inline: 10px; }
  .offer-label { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
