:root {
  color-scheme: dark;
  --bound-bg: #08090d;
  --bound-card: #11131a;
  --bound-line: rgb(255 255 255 / 12%);
  --bound-text: #f5f0e8;
  --bound-muted: #aaa7b3;
  --bound-accent: #9c84ff;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.bound-site { background: var(--bound-bg); color: var(--bound-text); font-family: Manrope, ui-sans-serif, system-ui, sans-serif; margin: 0; min-width: 320px; overflow-x: hidden; }
body.bound-site::before { background: radial-gradient(circle at 10% 8%, color-mix(in srgb, var(--bound-accent) 16%, transparent), transparent 31rem), radial-gradient(circle at 92% 48%, rgb(80 205 190 / 7%), transparent 27rem); content: ""; inset: 0; pointer-events: none; position: fixed; }
body.bound-site::after { background-image: linear-gradient(rgb(255 255 255 / 2.2%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 2.2%) 1px, transparent 1px); background-size: 70px 70px; content: ""; inset: 0; mask-image: linear-gradient(to bottom, black, transparent 72%); opacity: .25; pointer-events: none; position: fixed; }
a { color: inherit; }
a:focus-visible { outline: 2px solid var(--bound-accent); outline-offset: 4px; }
.bound-nav { align-items: center; backdrop-filter: blur(20px); background: rgb(8 9 13 / 70%); border: 1px solid var(--bound-line); border-radius: 999px; display: flex; justify-content: space-between; left: 50%; max-width: 1320px; padding: 12px 14px 12px 22px; position: absolute; top: 22px; transform: translateX(-50%); width: calc(100% - clamp(28px, 7vw, 96px)); z-index: 10; }
.bound-brand { align-items: center; display: flex; gap: 10px; letter-spacing: .19em; text-decoration: none; }
.bound-brand span { color: var(--bound-accent); filter: drop-shadow(0 0 12px var(--bound-accent)); font-size: 20px; }
.bound-brand strong { font-size: 12px; }
.bound-nav nav { align-items: center; display: flex; gap: 24px; }
.bound-nav nav > a { color: var(--bound-muted); font-size: 12px; font-weight: 700; text-decoration: none; transition: color .2s ease; }
.bound-nav nav > a:hover { color: var(--bound-text); }
.bound-language { align-items: center; background: rgb(255 255 255 / 6%); border: 1px solid var(--bound-line); border-radius: 999px; display: inline-flex; gap: 7px; padding: 8px 10px; }
.bound-language a { color: #777581; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-decoration: none; }
.bound-language a.is-active { color: var(--bound-text); }
.bound-language i { background: var(--bound-line); height: 12px; width: 1px; }
.bound-hub-hero, .bound-product-hero, .bound-studio-hero { align-items: center; display: grid; margin: auto; max-width: 1600px; min-height: min(960px, 100vh); overflow: hidden; padding: 140px clamp(24px, 7vw, 110px) 90px; position: relative; }
.bound-art-hero::before { background-position: center; background-repeat: no-repeat; background-size: cover; content: ""; inset: 0; position: absolute; transform: scale(1.015); }
.bound-art-hero::after { background: linear-gradient(90deg, var(--bound-bg) 0%, rgb(8 9 13 / 92%) 23%, rgb(8 9 13 / 50%) 50%, transparent 76%), linear-gradient(0deg, var(--bound-bg) 0%, transparent 28%); content: ""; inset: 0; position: absolute; }
.bound-hub-hero::before { background-image: url("public/hero-bound.webp"); }
.bound-studio-hero::before { background-image: url("public/hero-studio.webp"); }
.bound-product-hero::before { background-image: var(--bound-hero-image); }
.bound-hub-hero, .bound-studio-hero, .bound-product-hero { grid-template-columns: minmax(0, 1fr); }
.bound-hero-copy { position: relative; z-index: 2; }
.bound-art-hero .bound-hero-copy { max-width: 760px; }
.bound-eyebrow, .bound-section-head > span, .bound-final-cta > span { color: var(--bound-accent); display: block; font-size: 10px; font-weight: 800; letter-spacing: .27em; margin-bottom: 24px; }
.bound-hero-copy h1 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(52px, 7.2vw, 108px); font-weight: 600; letter-spacing: -.055em; line-height: .94; margin: 0; max-width: 950px; text-wrap: balance; }
.bound-hero-copy > p { color: #c0bdc7; font-size: clamp(16px, 1.8vw, 21px); line-height: 1.7; margin: 30px 0 38px; max-width: 680px; text-wrap: pretty; }
.bound-button { align-items: center; background: var(--bound-text); border: 1px solid var(--bound-text); border-radius: 999px; color: #101119; display: inline-flex; font-size: 13px; font-weight: 800; gap: 24px; justify-content: center; min-height: 54px; padding: 0 27px; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.bound-button:hover { box-shadow: 0 18px 55px color-mix(in srgb, var(--bound-accent) 25%, transparent); transform: translateY(-3px); }
.bound-button.is-ghost { backdrop-filter: blur(10px); background: rgb(8 9 13 / 44%); color: var(--bound-text); }
.bound-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.bound-text-link { align-items: center; color: var(--bound-text); display: inline-flex; font-size: 12px; font-weight: 800; gap: 12px; padding: 0 14px; text-decoration: none; }
.bound-product-name, .bound-kicker { color: rgb(245 240 232 / 74%); display: block; font-size: 11px; font-weight: 800; letter-spacing: .22em; margin-bottom: 16px; text-transform: uppercase; }
.bound-orbit, .bound-product-sigil { aspect-ratio: 1; margin: auto; max-width: 480px; position: relative; width: 100%; z-index: 1; }
.bound-orbit { filter: drop-shadow(0 0 60px color-mix(in srgb, var(--bound-accent) 30%, transparent)); opacity: .8; }
.bound-orbit::before, .bound-orbit::after, .bound-product-sigil::before, .bound-product-sigil::after { border: 1px solid var(--bound-line); border-radius: 50%; content: ""; inset: 7%; position: absolute; }
.bound-orbit::after, .bound-product-sigil::after { border-color: color-mix(in srgb, var(--bound-accent) 58%, transparent); inset: 24%; }
.bound-orbit > span, .bound-product-sigil > div { align-items: center; background: radial-gradient(circle, color-mix(in srgb, var(--bound-accent) 32%, #11131d), #0d0e17 68%); border: 1px solid color-mix(in srgb, var(--bound-accent) 45%, transparent); border-radius: 50%; box-shadow: 0 0 100px color-mix(in srgb, var(--bound-accent) 20%, transparent); display: flex; font-family: "Playfair Display", Georgia, serif; font-size: clamp(60px, 10vw, 120px); inset: 34%; justify-content: center; position: absolute; }
.bound-orbit i, .bound-product-sigil i { background: var(--bound-accent); border-radius: 50%; box-shadow: 0 0 18px var(--bound-accent); height: 7px; position: absolute; width: 7px; }
.bound-orbit i:nth-child(1) { left: 13%; top: 27%; }.bound-orbit i:nth-child(2) { right: 13%; top: 52%; }.bound-orbit i:nth-child(3) { bottom: 13%; left: 43%; }
.bound-product-sigil i:nth-of-type(1) { left: 12%; top: 46%; }.bound-product-sigil i:nth-of-type(2) { right: 20%; top: 17%; }
.bound-studio-intro { align-items: center; display: grid; gap: clamp(40px, 8vw, 120px); grid-template-columns: minmax(240px, .6fr) minmax(0, 1fr); margin: auto; max-width: 1220px; padding: 130px clamp(24px, 6vw, 70px); }
.bound-studio-logo { align-items: center; aspect-ratio: 1; background: radial-gradient(circle, rgb(99 46 97 / 25%), transparent 68%); display: flex; justify-content: center; }
.bound-studio-logo img { filter: drop-shadow(0 28px 70px rgb(234 69 21 / 20%)); height: auto; max-width: 100%; }
.bound-studio-intro h2 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(38px, 5vw, 68px); letter-spacing: -.045em; line-height: 1.08; margin: 0 0 24px; text-wrap: balance; }
.bound-studio-intro p { color: var(--bound-muted); font-size: clamp(17px, 2vw, 21px); line-height: 1.75; }
.bound-values { display: grid; gap: 1px; grid-template-columns: repeat(3, 1fr); margin: 0 auto 120px; max-width: 1220px; padding: 0 clamp(24px, 6vw, 70px); }
.bound-values article { background: linear-gradient(145deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 2%)); border: 1px solid var(--bound-line); min-height: 250px; padding: 34px; }
.bound-values article:first-child { border-radius: 24px 0 0 24px; }.bound-values article:last-child { border-radius: 0 24px 24px 0; }
.bound-values span { color: #f07a2c; font-family: ui-monospace, monospace; font-size: 11px; }.bound-values h3 { font-family: "Playfair Display", Georgia, serif; font-size: 25px; margin: 40px 0 14px; }.bound-values p { color: var(--bound-muted); line-height: 1.65; margin: 0; }
.bound-products, .bound-feature-section { margin: auto; max-width: 1320px; padding: 110px clamp(24px, 6vw, 70px) 150px; position: relative; }
.bound-section-head h2 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(38px, 4.5vw, 64px); font-weight: 600; letter-spacing: -.04em; margin: 0; max-width: 820px; text-wrap: balance; }
.bound-product-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 58px; }
.bound-product-card { background: #101119; border: 1px solid var(--bound-line); border-radius: 28px; display: grid; grid-template-rows: 230px 1fr; min-height: 600px; overflow: hidden; position: relative; transition: border-color .25s ease, transform .25s ease; }
.bound-card-art { background: linear-gradient(0deg, #101119, transparent 48%), var(--bound-card-image) center / cover no-repeat; position: relative; }
.bound-card-art::after { background: linear-gradient(90deg, color-mix(in srgb, var(--bound-accent) 15%, transparent), transparent); content: ""; inset: 0; position: absolute; }
.bound-product-card:hover { border-color: color-mix(in srgb, var(--bound-accent) 46%, transparent); transform: translateY(-5px); }
.bound-product-card.is-inactive { filter: saturate(.7); }
.bound-card-top { align-items: flex-start; display: flex; justify-content: space-between; left: clamp(24px, 3vw, 38px); position: absolute; right: clamp(24px, 3vw, 38px); top: 24px; z-index: 2; }
.bound-glyph { align-items: center; backdrop-filter: blur(9px); background: color-mix(in srgb, var(--bound-accent) 13%, transparent); border: 1px solid color-mix(in srgb, var(--bound-accent) 38%, transparent); border-radius: 17px; color: var(--bound-accent); display: flex; font-size: 16px; font-weight: 900; height: 58px; justify-content: center; min-width: 58px; padding: 8px; }
.bound-status { color: var(--bound-muted); font-size: 9px; font-weight: 800; letter-spacing: .18em; }
.bound-card-copy { display: flex; flex-direction: column; padding: 8px clamp(28px, 4vw, 44px) clamp(30px, 4vw, 42px); }
.bound-card-eyebrow { color: var(--bound-accent); font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.bound-product-card h3 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(34px, 4vw, 54px); letter-spacing: -.045em; margin: 10px 0 14px; }
.bound-product-card p { color: var(--bound-muted); line-height: 1.68; margin: 0 0 28px; max-width: 540px; }
.bound-card-copy > a, .bound-soon, .bound-card-disabled { font-size: 12px; font-weight: 800; margin-top: auto; text-decoration: none; }
.bound-card-copy > a { color: var(--bound-accent); }.bound-soon, .bound-card-disabled { color: #777681; cursor: default; }
.bound-product-page { --bound-bg: #090a11; }
.bound-product-hero { min-height: min(900px, 100vh); }
.bound-feature-grid { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 52px; }
.bound-feature-grid article { background: linear-gradient(145deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 2%)); border: 1px solid var(--bound-line); border-radius: 21px; min-height: 190px; padding: 27px; }
.bound-feature-grid article span { color: var(--bound-accent); font-family: ui-monospace, monospace; font-size: 11px; }
.bound-feature-grid article p { font-size: 16px; font-weight: 650; line-height: 1.55; margin: 42px 0 0; }
.bound-story { background: linear-gradient(90deg, transparent, rgb(255 255 255 / 2%), transparent); border-bottom: 1px solid var(--bound-line); border-top: 1px solid var(--bound-line); padding: 110px 24px; }
.bound-story-content { color: #d5d1dc; font-size: clamp(18px, 2vw, 22px); line-height: 1.8; margin: auto; max-width: 850px; }
.bound-story-content h2 { color: var(--bound-text); font-family: "Playfair Display", Georgia, serif; font-size: clamp(38px, 4.5vw, 62px); letter-spacing: -.04em; line-height: 1.08; }
.bound-story-content img { border-radius: 22px; height: auto; max-width: 100%; }
.bound-privacy-page { margin: auto; max-width: 1100px; min-height: 100vh; padding: 155px clamp(22px, 6vw, 80px) 100px; }.bound-privacy-hero { border-bottom: 1px solid var(--bound-line); margin-bottom: 52px; padding-bottom: 42px; }.bound-privacy-hero > span { color: var(--bound-accent); font-size: 11px; font-weight: 800; letter-spacing: .16em; }.bound-privacy-hero h1 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(48px, 7vw, 82px); letter-spacing: -.05em; line-height: 1.02; margin: 12px 0 18px; }.bound-privacy-hero p { color: var(--bound-muted); font-size: 18px; line-height: 1.65; margin: 0; max-width: 720px; }.bound-privacy-content { color: #d5d1dc; font-size: 16px; line-height: 1.8; }.bound-privacy-content h2 { color: var(--bound-text); font-family: "Playfair Display", Georgia, serif; font-size: clamp(27px, 3vw, 38px); letter-spacing: -.025em; line-height: 1.2; margin: 52px 0 16px; }.bound-privacy-content p, .bound-privacy-content ul { margin: 0 0 20px; }.bound-privacy-content li { margin: 0 0 10px; }.bound-privacy-content a { color: var(--bound-accent); }.bound-privacy-content strong { color: var(--bound-text); }
.bound-final-cta { align-items: center; display: flex; flex-direction: column; padding: 150px 24px; position: relative; text-align: center; }
.bound-final-cta h2 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(42px, 6vw, 82px); letter-spacing: -.05em; margin: 0 0 38px; max-width: 900px; text-wrap: balance; }
.bound-footer { align-items: center; border-top: 1px solid var(--bound-line); color: var(--bound-muted); display: flex; font-size: 11px; gap: 24px; justify-content: space-between; margin: auto; max-width: 1440px; padding: 38px clamp(24px, 5vw, 72px); position: relative; }
.bound-footer a { text-decoration: none; }.bound-footer p { text-align: center; }
@media (max-width: 820px) { .bound-hub-hero, .bound-product-hero, .bound-studio-hero { min-height: 840px; padding-top: 140px; }.bound-art-hero::after { background: linear-gradient(0deg, var(--bound-bg) 4%, rgb(8 9 13 / 78%) 48%, rgb(8 9 13 / 15%) 100%); }.bound-art-hero .bound-hero-copy { align-self: end; }.bound-product-grid, .bound-feature-grid { grid-template-columns: 1fr; }.bound-product-card { min-height: 370px; }.bound-studio-intro { grid-template-columns: 1fr; }.bound-studio-logo { margin: auto; max-width: 420px; }.bound-values { grid-template-columns: 1fr; }.bound-values article:first-child, .bound-values article:last-child { border-radius: 0; }.bound-values article:first-child { border-radius: 24px 24px 0 0; }.bound-values article:last-child { border-radius: 0 0 24px 24px; } }
@media (max-width: 580px) { .bound-nav { padding: 10px 11px 10px 16px; top: 12px; width: calc(100% - 24px); }.bound-brand strong { font-size: 10px; }.bound-nav nav { gap: 10px; }.bound-nav nav > a { display: none; }.bound-hub-hero, .bound-product-hero, .bound-studio-hero { min-height: 760px; padding-left: 22px; padding-right: 22px; }.bound-art-hero::before { background-position: 63% center; }.bound-hero-copy h1 { font-size: clamp(46px, 14vw, 68px); }.bound-products, .bound-feature-section { padding-left: 18px; padding-right: 18px; }.bound-privacy-page { padding-top: 125px; }.bound-footer { align-items: flex-start; flex-direction: column; }.bound-footer p { text-align: left; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.bound-button, .bound-product-card { transition: none; } }
