/* The product landing page and its companion mechanics page. */
.desktop-links a[aria-current="page"] { text-decoration:underline; text-underline-offset:7px; }
.nav-cta { gap:20px; }
.hero { height:900px; min-height:0; isolation:isolate; }
.hero-art { position:absolute; inset:0; z-index:-1; }
.hero-art img { width:100%; height:100%; object-fit:cover; object-position:center bottom; image-rendering:pixelated; }
.hero-layout { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 408px; gap:64px; align-items:start; padding-top:152px; }
.hero-copy { padding:8px 0 0; order:initial; }
.hero h1 { max-width:760px; font-size:clamp(60px,5.56vw,80px); line-height:1.04; letter-spacing:-.055em; font-weight:500; }
.hero-description { max-width:520px; margin-top:24px; font-size:20px; line-height:30px; font-weight:500; }
.hero-text-link { display:inline-flex; gap:24px; align-items:center; min-height:44px; margin-top:24px; font-size:14px; line-height:20px; font-weight:600; }
.hero-text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.hero .bridge-panel { position:relative; margin:0; width:100%; }
.hero .bridge-panel-placeholder { height:420px; background:var(--ink); border-radius:16px; }
.faq-more { margin-top:24px; font-size:14px; }
.wallet-copy p + p { margin-top:16px; }
.mock-label { max-width:none; white-space:nowrap; font-size:9px; letter-spacing:0; }

/* Quiet page navigation leaves the diagrams as the focus. */
.detail-intro { padding:144px 0 0; }
.detail-back { display:inline-flex; gap:16px; align-items:center; min-height:44px; font-size:14px; font-weight:600; }
.detail-intro-grid { display:grid; grid-template-columns:1fr 1.2fr; align-items:end; gap:80px; margin-top:16px; }
.detail-intro h1 { margin:0; font-size:80px; line-height:1; letter-spacing:-.055em; font-weight:500; }
.detail-intro-grid > p { max-width:560px; color:var(--muted); font-size:18px; line-height:28px; }
.detail-contents { display:flex; flex-wrap:wrap; gap:16px 40px; margin-top:48px; padding-block:24px; border-block:1px solid var(--line); }
.detail-contents a { display:inline-flex; gap:24px; align-items:center; min-height:32px; font-size:14px; line-height:20px; font-weight:600; }
.detail-contents a:hover,.detail-back:hover { text-decoration:underline; text-underline-offset:5px; }
.how-page .proof-section { padding-top:64px; }
.how-page .protection-section { border-top:1px solid var(--line); }
.security-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.security-card { padding:32px; border:1px solid var(--line); border-radius:12px; background:var(--paper); }
.security-symbol { display:block; margin-bottom:32px; color:var(--ink); font-size:40px; line-height:40px; }
.security-card h3 { margin:0 0 24px; font-size:32px; line-height:36px; letter-spacing:-.04em; font-weight:500; }
.security-card > p { max-width:520px; color:var(--muted); }
.security-card .security-limit { margin-top:24px; padding-top:24px; border-top:1px solid var(--line); font-size:14px; line-height:22px; }
.security-foundation { max-width:800px; margin-top:32px; color:var(--muted); font-size:14px; line-height:22px; }

/* Copy sits in the sky, with the landscape extending behind the whole footer. */
.site-footer { position:relative; isolation:isolate; min-height:900px; padding-block:96px 0; overflow:hidden; background:var(--paper); }
.footer-art { position:absolute; inset:0; z-index:-1; height:100%; margin:0; }
.footer-art img { width:100%; height:100%; object-fit:cover; object-position:center bottom; image-rendering:pixelated; mask-image:none; -webkit-mask-image:none; }
.footer-main { position:relative; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:80px; }
.footer-identity > p { margin-top:16px; }
.footer-columns { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.footer-columns nav { gap:12px; }
.footer-columns button { display:inline-flex; min-height:24px; padding:0; border:0; background:transparent; font-size:14px; line-height:20px; font-weight:500; color:var(--ink); }
.footer-columns button:hover { text-decoration:underline; text-underline-offset:4px; }
.footer-socials { gap:24px; margin-top:24px; }
.footer-socials a { display:inline-flex; align-items:center; gap:12px; min-height:44px; font-size:14px; line-height:20px; font-weight:600; }
.footer-socials a:hover { text-decoration:underline; text-underline-offset:4px; }
.footer-bottom-content { position:relative; margin-top:40px; padding-block:0; color:var(--muted); gap:32px; }
.bridge-page .site-header { position:relative; }
.bridge-workspace { padding-block:24px 32px; }
.bridge-app-frame { overflow:hidden; border-radius:16px; background:var(--ink); }
.bridge-page-footer { display:flex; flex-wrap:wrap; align-items:center; gap:16px 32px; padding-bottom:32px; color:var(--muted); font-size:12px; line-height:20px; }
.bridge-page-footer a:hover { text-decoration:underline; text-underline-offset:4px; }
.bridge-page-footer > span { margin-left:auto; }
.bridge-noscript { padding:40px; color:var(--paper); }
.bridge-noscript p,.bridge-noscript a { display:block; margin-top:24px; }

@media(min-width:1600px) {
  .hero { height:min(56.25vw,1080px); }
  .hero-layout { padding-top:176px; }
}
@media(min-width:1001px) and (max-width:1150px) {
  .hero-layout { grid-template-columns:minmax(0,1fr) 360px; gap:40px; }
  .hero h1 { font-size:60px; }
  .hero-description { font-size:18px; line-height:28px; }
}
@media(max-width:1000px) {
  .hero { display:flex; flex-direction:column; height:auto; }
  .hero-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; padding-top:128px; }
  .hero-copy { padding:8px 0 0; }
  .hero h1 { font-size:56px; }
  .hero-description { font-size:16px; line-height:24px; }
  .hero-art { order:1; position:relative; inset:auto; z-index:0; flex:none; aspect-ratio:auto; height:300px; max-height:none; margin-top:-24px; }
  .hero-art img { object-fit:cover; object-position:center bottom; mask-image:linear-gradient(transparent 0,#000 24%); -webkit-mask-image:linear-gradient(transparent 0,#000 24%); }
  .hero-layout { z-index:1; }
  .detail-intro-grid { gap:40px; }
  .detail-intro h1 { font-size:64px; }
  .footer-main { gap:40px; }
  .footer-columns { gap:24px; }
}
@media(max-width:900px) {
  .hero-layout { grid-template-columns:minmax(0,1fr) 360px; padding-top:112px; }
  .hero h1 { font-size:48px; }
  .hero-copy { padding-top:8px; }
  .hero-text-link { margin-top:16px; }
  .detail-intro { padding-top:112px; }
  .detail-intro-grid { display:block; margin-top:16px; }
  .detail-intro h1 { font-size:60px; }
  .detail-intro-grid > p { margin-top:24px; font-size:16px; line-height:24px; }
  .detail-contents { gap:8px 24px; margin-top:32px; padding-block:16px; }
  .security-cards { gap:16px; }
  .security-card { padding:24px; }
  .security-card h3 { font-size:28px; line-height:32px; }
  .site-footer { min-height:1000px; padding-top:64px; }
  .footer-main { display:grid; grid-template-columns:1fr 1.4fr; gap:32px; }
  .footer-columns { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; margin:0; }
  .footer-columns nav:last-child { grid-column:1 / -1; }
  .footer-art { margin:0; height:100%; }
  .footer-art img { object-position:45% bottom; mask-image:none; -webkit-mask-image:none; }
}
@media(max-width:700px) {
  .hero-layout { display:block; padding-top:112px; }
  .hero-copy { padding:0; }
  .hero h1 { max-width:500px; font-size:48px; }
  .hero-description { margin-top:20px; }
  .hero .bridge-panel { margin-top:32px; max-width:440px; margin-inline:auto; }
  .hero-art { height:240px; margin-top:0; }
  .hero-art img { object-position:50% bottom; }
  .security-cards { grid-template-columns:1fr; }
  .security-card h3 { font-size:30px; line-height:36px; }
  .security-symbol { margin-bottom:24px; }
  .footer-main { display:block; }
  .footer-columns { margin-top:32px; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-columns nav:last-child { grid-column:auto; }
  .site-footer { min-height:1000px; }
  .footer-bottom-content { margin-top:32px; font-size:12px; }
  .footer-art img { object-position:62% bottom; }
}
@media(max-width:360px) {
  .hero h1 { font-size:42px; }
  .hero-layout { width:calc(100% - 32px); }
  .detail-intro h1 { font-size:48px; }
  .detail-contents { display:grid; grid-template-columns:1fr 1fr; gap:4px 16px; }
  .detail-contents a { gap:8px; font-size:12px; }
  .footer-columns { gap:24px 16px; }
  .security-card { padding:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .security-card,.hero-text-link { transition:none; }
}