{"title":"ZayDen Zubehör","description":"","products":[{"product_id":"fracture","title":"ZayDen Glass — FRACTURE · Photovoltaic Glass Mousepad","description":"\u003cp\u003e\u003cmeta charset=\"UTF-8\"\u003e \u003cmeta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\u003e\u003clink href=\"https:\/\/fonts.googleapis.com\" rel=\"preconnect\"\u003e \u003clink crossorigin=\"\" href=\"https:\/\/fonts.gstatic.com\" rel=\"preconnect\"\u003e \u003clink rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Unbounded:wght@500;700;900\u0026amp;family=Manrope:wght@400;500;600;700;800\u0026amp;family=JetBrains+Mono:wght@400;500;600\u0026amp;display=swap\"\u003e\u003c\/p\u003e\n\u003cstyle\u003e\n\n  \/* Scoped everything to prevent breaking Shopify theme styles *\/\n  .zayden-landing-wrapper {\n    --void: #0a0a0e;\n    --panel: #13151d;\n    --panel-2: #1b1e2a;\n    --line: rgba(255,255,255,0.08);\n    --line-strong: rgba(255,255,255,0.16);\n    --electric: #2d5bfe;\n    --electric-soft: rgba(45,91,254,0.16);\n    --violet: #a995ff;\n    --frost: #eef0f7;\n    --frost-dim: #9097ad;\n    --frost-faint: #5b6178;\n    --radius: 14px;\n    --container: 1180px;\n    \n    background: var(--void);\n    color: var(--frost);\n    font-family: 'Manrope', sans-serif;\n    font-size: 16px;\n    line-height: 1.65;\n    -webkit-font-smoothing: antialiased;\n    overflow-x: hidden;\n  }\n\n  .zayden-landing-wrapper * { box-sizing: border-box; margin: 0; padding: 0; }\n\n  .zayden-landing-wrapper img { display: block; max-width: 100%; }\n\n  .zayden-landing-wrapper .wrap {\n    max-width: var(--container);\n    margin: 0 auto;\n    padding: 0 32px;\n  }\n\n  .zayden-landing-wrapper a { color: inherit; }\n\n  .zayden-landing-wrapper .eyebrow {\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 12px;\n    letter-spacing: 0.28em;\n    text-transform: uppercase;\n    color: var(--electric);\n    font-weight: 600;\n  }\n\n  .zayden-landing-wrapper .eyebrow.is-violet { color: var(--violet); }\n\n  .zayden-landing-wrapper h1, \n  .zayden-landing-wrapper h2, \n  .zayden-landing-wrapper h3 {\n    font-family: 'Unbounded', sans-serif;\n    font-weight: 800;\n    letter-spacing: -0.01em;\n    line-height: 1.05;\n    color: var(--frost);\n  }\n\n  .zayden-landing-wrapper h2 {\n    font-size: clamp(2rem, 4.2vw, 3.4rem);\n    margin-top: 14px;\n  }\n\n  .zayden-landing-wrapper p { color: var(--frost-dim); max-width: 54ch; }\n\n  .zayden-landing-wrapper .pimg {\n    width: 100%;\n    aspect-ratio: 1\/1;\n    object-fit: cover;\n    border-radius: var(--radius);\n    border: 1px solid var(--line-strong);\n  }\n  .zayden-landing-wrapper .pimg--wide { aspect-ratio: 4\/3; }\n\n  \/* ---------- nav ---------- *\/\n  .zayden-landing-wrapper header {\n    position: fixed;\n    top: 0; left: 0; right: 0;\n    z-index: 50;\n    backdrop-filter: blur(14px);\n    -webkit-backdrop-filter: blur(14px);\n    background: rgba(10,10,14,0.55);\n    border-bottom: 1px solid var(--line);\n  }\n  .zayden-landing-wrapper nav {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 18px 32px;\n    max-width: var(--container);\n    margin: 0 auto;\n  }\n  .zayden-landing-wrapper .logo {\n    font-family: 'Unbounded', sans-serif;\n    font-weight: 900;\n    font-size: 18px;\n    letter-spacing: 0.06em;\n  }\n  .zayden-landing-wrapper .logo span { color: var(--electric); }\n  .zayden-landing-wrapper .nav-tag {\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 11px;\n    letter-spacing: 0.22em;\n    text-transform: uppercase;\n    color: var(--frost-dim);\n    display: flex;\n    gap: 18px;\n    align-items: center;\n  }\n\n  \/* ---------- hero ---------- *\/\n  .zayden-landing-wrapper .hero {\n    position: relative;\n    min-height: 100vh;\n    display: flex;\n    align-items: center;\n    padding-top: 90px;\n    overflow: hidden;\n  }\n  .zayden-landing-wrapper .hero .wrap {\n    display: grid;\n    grid-template-columns: 1.1fr 0.9fr;\n    gap: 64px;\n    align-items: center;\n    width: 100%;\n  }\n  .zayden-landing-wrapper .hero__title {\n    font-size: clamp(3.4rem, 9vw, 7.5rem);\n    line-height: 0.95;\n    margin-top: 18px;\n    background: linear-gradient(135deg, #ffffff 0%, #ffffff 55%, var(--violet) 100%);\n    -webkit-background-clip: text;\n    background-clip: text;\n    color: transparent;\n  }\n  .zayden-landing-wrapper .hero__sub {\n    margin-top: 22px;\n    font-size: 17px;\n    max-width: 46ch;\n  }\n  .zayden-landing-wrapper .hero__meta {\n    display: flex;\n    gap: 28px;\n    align-items: flex-end;\n    margin-top: 38px;\n    flex-wrap: wrap;\n  }\n  .zayden-landing-wrapper .btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 13px;\n    letter-spacing: 0.16em;\n    text-transform: uppercase;\n    font-weight: 600;\n    padding: 18px 30px;\n    border-radius: 999px;\n    border: 1px solid transparent;\n    cursor: pointer;\n    text-decoration: none;\n    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;\n  }\n  .zayden-landing-wrapper .btn--primary {\n    background: var(--electric);\n    color: #fff;\n    box-shadow: 0 0 0 0 rgba(45,91,254,0.6);\n  }\n  .zayden-landing-wrapper .btn--primary:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 10px 30px -8px rgba(45,91,254,0.7);\n  }\n  .zayden-landing-wrapper .btn--ghost {\n    border-color: var(--line-strong);\n    color: var(--frost);\n    background: transparent;\n  }\n  .zayden-landing-wrapper .btn--ghost:hover {\n    border-color: var(--electric);\n    color: var(--electric);\n  }\n\n  .zayden-landing-wrapper .hero__visual { position: relative; }\n  .zayden-landing-wrapper .hero__visual .pimg { transform: rotate(2deg); }\n  .zayden-landing-wrapper .hero__glint {\n    position: absolute;\n    inset: -2px;\n    border-radius: var(--radius);\n    pointer-events: none;\n    background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,0.22) 50%, transparent 65%);\n    transform: translateX(-120%) rotate(2deg);\n    animation: glint 5.5s ease-in-out infinite;\n  }\n  @keyframes glint {\n    0% { transform: translateX(-120%) rotate(2deg); }\n    35% { transform: translateX(120%) rotate(2deg); }\n    100% { transform: translateX(120%) rotate(2deg); }\n  }\n\n  .zayden-landing-wrapper .scroll-cue {\n    position: absolute;\n    bottom: 36px; left: 32px;\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 11px;\n    letter-spacing: 0.24em;\n    text-transform: uppercase;\n    color: var(--frost-faint);\n    display: flex;\n    align-items: center;\n    gap: 10px;\n  }\n  .zayden-landing-wrapper .scroll-cue .line {\n    width: 1px; height: 34px;\n    background: linear-gradient(to bottom, var(--electric), transparent);\n  }\n\n  \/* ---------- sections ---------- *\/\n  .zayden-landing-wrapper section {\n    padding: 120px 0;\n    border-top: 1px solid var(--line);\n  }\n  .zayden-landing-wrapper .section-head {\n    max-width: 760px;\n    margin-bottom: 64px;\n  }\n\n  \/* manifesto *\/\n  .zayden-landing-wrapper .manifesto .wrap {\n    display: grid;\n    grid-template-columns: 1fr 0.8fr;\n    gap: 72px;\n    align-items: start;\n  }\n  .zayden-landing-wrapper .manifesto p { margin-top: 18px; }\n  .zayden-landing-wrapper .manifesto blockquote {\n    margin-top: 34px;\n    padding-left: 24px;\n    border-left: 2px solid var(--electric);\n    font-family: 'Unbounded', sans-serif;\n    font-weight: 700;\n    font-size: 1.35rem;\n    color: var(--frost);\n    line-height: 1.4;\n  }\n\n  \/* anatomy *\/\n  .zayden-landing-wrapper .anatomy-layout {\n    display: grid;\n    grid-template-columns: 0.85fr 1.15fr;\n    gap: 72px;\n    align-items: start;\n  }\n  .zayden-landing-wrapper .layer-stack {\n    position: relative;\n    padding-left: 30px;\n  }\n  .zayden-landing-wrapper .layer-stack::before {\n    content: '';\n    position: absolute;\n    left: 9px; top: 10px; bottom: 10px;\n    width: 1px;\n    background: linear-gradient(to bottom, var(--electric), var(--violet));\n    opacity: 0.5;\n  }\n  .zayden-landing-wrapper .layer {\n    position: relative;\n    padding: 0 0 44px 30px;\n    opacity: 0;\n    transform: translateX(-24px);\n    transition: opacity .7s ease, transform .7s ease;\n  }\n  .zayden-landing-wrapper .layer.in-view {\n    opacity: 1;\n    transform: translateX(0);\n  }\n  .zayden-landing-wrapper .layer:last-child { padding-bottom: 0; }\n  .zayden-landing-wrapper .layer::before {\n    content: attr(data-index);\n    position: absolute;\n    left: -30px; top: -2px;\n    width: 20px; height: 20px;\n    border-radius: 50%;\n    background: var(--void);\n    border: 1px solid var(--line-strong);\n    display: flex; align-items: center; justify-content: center;\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 10px;\n    color: var(--frost-dim);\n  }\n  .zayden-landing-wrapper .layer__name {\n    font-family: 'Unbounded', sans-serif;\n    font-weight: 700;\n    font-size: 1.15rem;\n    display: flex;\n    align-items: baseline;\n    gap: 14px;\n    flex-wrap: wrap;\n  }\n  .zayden-landing-wrapper .layer__spec {\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 11px;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    color: var(--electric);\n  }\n  .zayden-landing-wrapper .layer__name.is-violet .layer__spec { color: var(--violet); }\n  .zayden-landing-wrapper .layer p { margin-top: 8px; font-size: 15px; }\n\n  .zayden-landing-wrapper .anatomy-visual {\n    position: sticky;\n    top: 120px;\n  }\n  .zayden-landing-wrapper .stack-card {\n    border-radius: var(--radius);\n    border: 1px solid var(--line-strong);\n    background: var(--panel);\n    overflow: hidden;\n  }\n  .zayden-landing-wrapper .stack-card__row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 22px 26px;\n    border-bottom: 1px solid var(--line);\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 13px;\n  }\n  .zayden-landing-wrapper .stack-card__row:last-child { border-bottom: none; }\n  .zayden-landing-wrapper .stack-card__row span:first-child { color: var(--frost-dim); letter-spacing: 0.1em; text-transform: uppercase; font-size: 11px; }\n  .zayden-landing-wrapper .stack-card__row span:last-child { color: var(--frost); font-weight: 500; }\n  .zayden-landing-wrapper .stack-card__row.accent span:last-child { color: var(--violet); }\n\n  \/* specs *\/\n  .zayden-landing-wrapper .specs-grid {\n    display: grid;\n    grid-template-columns: repeat(3,1fr);\n    gap: 1px;\n    background: var(--line);\n    border: 1px solid var(--line);\n    border-radius: var(--radius);\n    overflow: hidden;\n  }\n  .zayden-landing-wrapper .spec-cell {\n    background: var(--panel);\n    padding: 30px 26px;\n  }\n  .zayden-landing-wrapper .spec-cell dt {\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 11px;\n    letter-spacing: 0.18em;\n    text-transform: uppercase;\n    color: var(--frost-faint);\n    margin-bottom: 10px;\n  }\n  .zayden-landing-wrapper .spec-cell dd {\n    font-family: 'Unbounded', sans-serif;\n    font-weight: 700;\n    font-size: 1.05rem;\n  }\n\n  \/* gallery *\/\n  .zayden-landing-wrapper .gallery-grid {\n    display: grid;\n    grid-template-columns: repeat(2,1fr);\n    gap: 24px;\n  }\n  .zayden-landing-wrapper .gallery-cap {\n    margin-top: 14px;\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 12px;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: var(--frost-dim);\n  }\n\n  \/* footer *\/\n  .zayden-landing-wrapper footer {\n    border-top: 1px solid var(--line);\n    padding: 40px 0;\n  }\n  .zayden-landing-wrapper footer .wrap {\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    flex-wrap: wrap;\n    gap: 24px;\n  }\n  .zayden-landing-wrapper .footer-meta {\n    font-family: 'JetBrains Mono', monospace;\n    font-size: 11px;\n    letter-spacing: 0.18em;\n    text-transform: uppercase;\n    color: var(--frost-faint);\n    text-align: right;\n  }\n\n  \/* reveal *\/\n  .zayden-landing-wrapper .reveal {\n    opacity: 0;\n    transform: translateY(28px);\n    transition: opacity .8s ease, transform .8s ease;\n  }\n  .zayden-landing-wrapper .reveal.in-view {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  \/* focus *\/\n  .zayden-landing-wrapper a:focus-visible, \n  .zayden-landing-wrapper button:focus-visible {\n    outline: 2px solid var(--electric);\n    outline-offset: 3px;\n  }\n\n  \/* reduced motion *\/\n  @media (prefers-reduced-motion: reduce){\n    .zayden-landing-wrapper * { animation: none !important; transition: none !important; }\n  }\n\n  \/* responsive *\/\n  @media (max-width: 980px){\n    .zayden-landing-wrapper .hero .wrap, \n    .zayden-landing-wrapper .manifesto .wrap, \n    .zayden-landing-wrapper .anatomy-layout {\n      grid-template-columns: 1fr;\n    }\n    .zayden-landing-wrapper .hero__visual { order: -1; }\n    .zayden-landing-wrapper .anatomy-visual { position: relative; top: 0; }\n    .zayden-landing-wrapper .specs-grid { grid-template-columns: repeat(2,1fr); }\n    .zayden-landing-wrapper .gallery-grid { grid-template-columns: 1fr; }\n  }\n  @media (max-width: 640px){\n    .zayden-landing-wrapper .wrap { padding: 0 20px; }\n    .zayden-landing-wrapper section { padding: 80px 0; }\n    .zayden-landing-wrapper .nav-tag { display: none; }\n    .zayden-landing-wrapper .specs-grid { grid-template-columns: 1fr 1fr; }\n  }\n\n\u003c\/style\u003e\n\u003cdiv class=\"zayden-landing-wrapper\"\u003e\n\u003cheader\u003e\u003cnav\u003e\n\u003cdiv class=\"logo\"\u003eZAY\u003cspan\u003eDEN\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"nav-tag\"\u003e\u003cspan\u003eGLASS SERIES\u003c\/span\u003e\u003c\/div\u003e\n\u003c\/nav\u003e\u003c\/header\u003e\n\u003csection class=\"hero\"\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv\u003e\n\u003cdiv class=\"eyebrow\"\u003eZayden Glass Series\u003c\/div\u003e\n\u003ch1 class=\"hero__title\"\u003eFRACTURE\u003c\/h1\u003e\n\u003cp class=\"hero__sub\"\u003e3.2mm photovoltaic glass. Laser-engraved art that doesn't fade, peel, or wear. One piece — built to last.\u003c\/p\u003e\n\u003cdiv class=\"hero__meta\"\u003e\n\u003ca href=\"#specs\" class=\"btn btn--primary\"\u003eSee the specs\u003c\/a\u003e \u003ca href=\"#gallery\" class=\"btn btn--ghost\"\u003eView it\u003c\/a\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"hero__visual\"\u003e\n\u003cimg class=\"pimg\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_15_2026_04_48_06_PM.png?v=1781523027\" alt=\"FRACTURE glass mousepad on a desk setup\"\u003e\n\u003cdiv class=\"hero__glint\"\u003e\u003cbr\u003e\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"scroll-cue\"\u003e\n\u003cdiv class=\"line\"\u003e\u003cbr\u003e\u003c\/div\u003e\nSCROLL\u003c\/div\u003e\n\u003c\/section\u003e\n\u003csection class=\"manifesto\"\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv class=\"reveal in-view\"\u003e\n\u003cdiv class=\"eyebrow\"\u003eBecause basic is a crime\u003c\/div\u003e\n\u003ch2\u003eCloth fades.\u003cbr\u003eGlass doesn't.\u003c\/h2\u003e\n\u003cp\u003eEvery stock mousepad on a desk is the same story: thin foam, a printed skin, and a fabric edge that frays before the year is out. The art on it was never meant to last — it was meant to be cheap.\u003c\/p\u003e\n\u003cp\u003eFRACTURE is built the opposite way. The artwork comes first — a fractured, mirrored portrait that splits a single eye into a hundred watching ones — and the hardware exists to protect it. Laser-engraved into photovoltaic glass, with polished edges that won't curl, peel, or stain.\u003c\/p\u003e\n\u003cblockquote\u003eThis isn't a mousepad with a picture on it. It's a piece of glass with a desk underneath it.\u003c\/blockquote\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"reveal in-view\"\u003e\u003cimg class=\"pimg pimg--wide\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_15_2026_05_03_50_PM_1104e668-4ba6-4491-8aa6-dc176785805c.png?v=1781523023\" alt=\"FRACTURE close-up of the mirror shard artwork\"\u003e\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003csection id=\"anatomy\"\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv class=\"section-head reveal in-view\"\u003e\n\u003cdiv class=\"eyebrow\"\u003eConstruction\u003c\/div\u003e\n\u003ch2\u003eWhat it's made of\u003c\/h2\u003e\n\u003cp\u003eTwo layers, fused into one 3.2mm panel. Nothing here is filler.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"anatomy-layout\"\u003e\n\u003cdiv class=\"layer-stack\"\u003e\n\u003cdiv class=\"layer in-view\" data-index=\"01\"\u003e\n\u003cdiv class=\"layer__name\"\u003ePhotovoltaic glass surface \u003cspan class=\"layer__spec\"\u003e3.2mm · polished edge\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cp\u003eEco-friendly and durable. Scratch-resistant and perfectly flat — consistent glide regardless of sensor or DPI. Won't dent, warp, or develop the worn-smooth patches cloth pads get after a few months.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"layer is-violet in-view\" data-index=\"02\"\u003e\n\u003cdiv class=\"layer__name is-violet\"\u003eLaser engraving \u003cspan class=\"layer__spec\"\u003eFRACTURE print\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cp\u003eThe FRACTURE design is laser-engraved directly into the glass — not printed on top, not applied as a skin. It's part of the material itself. Nothing to fade, nothing to peel.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"anatomy-visual reveal in-view\"\u003e\n\u003cdiv class=\"stack-card\"\u003e\n\u003cdiv class=\"stack-card__row\"\u003e\n\u003cspan\u003eTotal thickness\u003c\/span\u003e\u003cspan\u003e3.2mm\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"stack-card__row\"\u003e\n\u003cspan\u003eSurface\u003c\/span\u003e\u003cspan\u003ePhotovoltaic glass\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"stack-card__row accent\"\u003e\n\u003cspan\u003eEngraving\u003c\/span\u003e\u003cspan\u003eLaser, permanent\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"stack-card__row\"\u003e\n\u003cspan\u003eFootprint\u003c\/span\u003e\u003cspan\u003e350 × 260mm\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"stack-card__row\"\u003e\n\u003cspan\u003eEdges\u003c\/span\u003e\u003cspan\u003ePolished, smooth\u003c\/span\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"stack-card__row\"\u003e\n\u003cspan\u003eMaterial grade\u003c\/span\u003e\u003cspan\u003eEco-friendly PV glass\u003c\/span\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003csection id=\"specs\"\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv class=\"section-head reveal in-view\"\u003e\n\u003cdiv class=\"eyebrow\"\u003eSpecs\u003c\/div\u003e\n\u003ch2\u003eThe numbers\u003c\/h2\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eDimensions350 × 260mm\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eThickness3.2mm\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eMaterialPhotovoltaic Glass\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eEngravingLaser\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eEdgesPolished\u003c\/div\u003e\n\u003cdiv class=\"spec-cell\"\u003eEcoYes\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003csection id=\"gallery\"\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv class=\"section-head reveal in-view\"\u003e\n\u003cdiv class=\"eyebrow\"\u003eLook closer\u003c\/div\u003e\n\u003ch2\u003eFrom every angle\u003c\/h2\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"gallery-grid\"\u003e\n\u003cdiv class=\"reveal in-view\"\u003e\n\u003cimg class=\"pimg\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_15_2026_04_02_08_PM_d69e5e8b-a2d7-43d5-822b-dd831bd1be89.png?v=1781523121\" alt=\"FRACTURE glass mousepad full desk setup\"\u003e\n\u003cdiv class=\"gallery-cap\"\u003eDesk setup\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"reveal in-view\"\u003e\n\u003cimg class=\"pimg\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_15_2026_05_03_36_PM_869f760d-6d8c-4a04-baa5-31a92d4b9724.png?v=1781523122\" alt=\"FRACTURE mirror shard macro detail\"\u003e\n\u003cdiv class=\"gallery-cap\"\u003eDetail — mirror shard\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n\u003cfooter\u003e\n\u003cdiv class=\"wrap\"\u003e\n\u003cdiv class=\"footer-meta\"\u003eZAYDEN GLASS SERIES\u003cbr\u003eFRACTURE\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/footer\u003e\n\u003c\/div\u003e\n\u003cp\u003e \u003c\/p\u003e","brand":"ZayDen","offers":[{"title":"Veilborne","offer_id":47920492675223,"sku":null,"price":79.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPTImageJun15_2026_04_48_06PM.png?v=1781531116"},{"product_id":"zayden-glass-yoru-sakura","title":"Zayden Glass — Yoru Sakura · Photovoltaic Glass Mousepad","description":"\u003c!-- YORU SAKURA — ZAYDEN Glass Series --\u003e\n\u003clink rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\"\u003e\n\u003clink rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\"\u003e\n\u003clink href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400\u0026amp;family=DM+Sans:wght@300;400;500\u0026amp;family=JetBrains+Mono:wght@400;500\u0026amp;display=swap\" rel=\"stylesheet\"\u003e\n\n\u003cstyle\u003e\n\/* ─── HIDE SCROLLBAR (Keeps Scrolling Active) ──────── *\/\n::-webkit-scrollbar {\n  display: none;\n}\n* {\n  -ms-overflow-style: none;  \/* IE and Edge *\/\n  scrollbar-width: none;  \/* Firefox *\/\n}\n\n\/* ─── SCOPED TOKENS \u0026 RESET ────────────────────────── *\/\n.zayden-glass-wrapper {\n  --void:      #0c0810;\n  --panel:     #160f18;\n  --panel-2:   #1e1522;\n  --line:      rgba(255,255,255,0.07);\n  --line-s:    rgba(255,255,255,0.13);\n  --frost:     #f5eff2;\n  --frost-dim: #9c8e96;\n  --frost-faint:#5a5059;\n  --sakura:    #e8789a;\n  --sakura-dim:rgba(232,120,154,0.18);\n  --sakura-glow:rgba(232,120,154,0.08);\n  --electric:  #2d5bfe;\n  --r:         12px;\n\n  background: var(--void);\n  color: var(--frost);\n  font-family: 'DM Sans', sans-serif;\n  font-size: 16px;\n  line-height: 1.7;\n  -webkit-font-smoothing: antialiased;\n  overflow-x: hidden;\n  position: relative;\n  width: 100%;\n}\n\n.zayden-glass-wrapper *, \n.zayden-glass-wrapper *::before, \n.zayden-glass-wrapper *::after { \n  margin: 0; \n  padding: 0; \n  box-sizing: border-box; \n}\n\n.zayden-glass-wrapper img { \n  display: block; \n  width: 100%; \n}\n\n\/* ─── NAV ────────────────────────────────────────────── *\/\n.zayden-glass-wrapper nav {\n  position: fixed;\n  top: 0; left: 0; right: 0;\n  z-index: 100;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 20px 48px;\n  backdrop-filter: blur(16px);\n  background: rgba(12, 8, 16, 0.5);\n  border-bottom: 1px solid var(--line);\n}\n.zayden-glass-wrapper .logo {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 15px;\n  font-weight: 500;\n  letter-spacing: 0.22em;\n  text-transform: uppercase;\n  color: var(--frost);\n}\n.zayden-glass-wrapper .logo em {\n  color: var(--electric);\n  font-style: normal;\n}\n.zayden-glass-wrapper .nav-right {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.2em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  display: flex;\n  align-items: center;\n  gap: 20px;\n}\n.zayden-glass-wrapper .nav-dot {\n  width: 6px; height: 6px;\n  border-radius: 50%;\n  background: var(--sakura);\n  box-shadow: 0 0 10px var(--sakura);\n  animation: zs-breathe 3s ease-in-out infinite;\n}\n@keyframes zs-breathe {\n  0%,100% { opacity:1; transform:scale(1); }\n  50% { opacity:0.4; transform:scale(0.7); }\n}\n\n\/* ─── PETALS ─────────────────────────────────────────── *\/\n.zayden-glass-wrapper .petal-field {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  overflow: hidden;\n  z-index: 1;\n}\n.zayden-glass-wrapper .petal {\n  position: absolute;\n  top: -40px;\n  border-radius: 80% 0 80% 0;\n  background: radial-gradient(circle at 35% 35%, #f2a8bc, #d96088 70%, #b84470);\n  opacity: 0;\n  animation: zs-fall linear infinite;\n}\n@keyframes zs-fall {\n  0%   { transform: translateY(0)    rotate(0deg)   translateX(0);    opacity: 0; }\n  5%   { opacity: 0.55; }\n  85%  { opacity: 0.3; }\n  100% { transform: translateY(100vh) rotate(380deg) translateX(60px); opacity: 0; }\n}\n.zayden-glass-wrapper .petal:nth-child(1)  { left:8%;  width:8px;  height:6px;  animation-duration:9s;   animation-delay:0s;    }\n.zayden-glass-wrapper .petal:nth-child(2)  { left:18%; width:11px; height:8px;  animation-duration:12s;  animation-delay:1.5s;  }\n.zayden-glass-wrapper .petal:nth-child(3)  { left:30%; width:7px;  height:5px;  animation-duration:8s;   animation-delay:3s;    }\n.zayden-glass-wrapper .petal:nth-child(4)  { left:45%; width:10px; height:7px;  animation-duration:14s;  animation-delay:0.5s;  }\n.zayden-glass-wrapper .petal:nth-child(5)  { left:58%; width:8px;  height:6px;  animation-duration:10s;  animation-delay:4s;    }\n.zayden-glass-wrapper .petal:nth-child(6)  { left:70%; width:12px; height:9px;  animation-duration:11s;  animation-delay:2s;    }\n.zayden-glass-wrapper .petal:nth-child(7)  { left:82%; width:7px;  height:5px;  animation-duration:9.5s; animation-delay:6s;    }\n.zayden-glass-wrapper .petal:nth-child(8)  { left:92%; width:9px;  height:7px;  animation-duration:13s;  animation-delay:1s;    }\n\n\/* ─── HERO ───────────────────────────────────────────── *\/\n.zayden-glass-wrapper .hero {\n  position: relative;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 100px 48px 80px;\n  overflow: hidden;\n}\n.zayden-glass-wrapper .hero::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background:\n    radial-gradient(ellipse 60% 50% at 50% 80%, var(--sakura-glow), transparent),\n    radial-gradient(ellipse 40% 30% at 50% 50%, rgba(45,91,254,0.04), transparent);\n  pointer-events: none;\n  z-index: 0;\n}\n.zayden-glass-wrapper .hero__kicker {\n  position: relative;\n  z-index: 2;\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.32em;\n  text-transform: uppercase;\n  color: var(--sakura);\n  margin-bottom: 24px;\n}\n.zayden-glass-wrapper .hero__title {\n  position: relative;\n  z-index: 2;\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 300;\n  font-size: clamp(4.5rem, 12vw, 10rem);\n  line-height: 0.92;\n  text-align: center;\n  letter-spacing: -0.01em;\n  color: var(--frost);\n}\n.zayden-glass-wrapper .hero__title em {\n  font-style: italic;\n  color: var(--sakura);\n}\n.zayden-glass-wrapper .hero__img-wrap {\n  position: relative;\n  z-index: 2;\n  width: min(580px, 90vw);\n  margin: 48px auto;\n  filter: drop-shadow(0 40px 80px rgba(232,120,154,0.22)) drop-shadow(0 8px 20px rgba(0,0,0,0.8));\n}\n.zayden-glass-wrapper .hero__img-wrap img {\n  border-radius: 16px;\n}\n.zayden-glass-wrapper .hero__sub {\n  position: relative;\n  z-index: 2;\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 300;\n  font-size: 1.25rem;\n  color: var(--frost-dim);\n  text-align: center;\n  letter-spacing: 0.04em;\n  margin-bottom: 36px;\n}\n.zayden-glass-wrapper .hero__cta {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  gap: 14px;\n  align-items: center;\n  flex-wrap: wrap;\n  justify-content: center;\n}\n.zayden-glass-wrapper .btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 12px;\n  font-weight: 500;\n  letter-spacing: 0.18em;\n  text-transform: uppercase;\n  text-decoration: none;\n  padding: 16px 28px;\n  border-radius: 999px;\n  border: 1px solid transparent;\n  cursor: pointer;\n  transition: transform 0.25s, box-shadow 0.25s, background 0.25s, border-color 0.25s;\n}\n.zayden-glass-wrapper .btn--primary {\n  background: var(--electric);\n  color: #fff;\n}\n.zayden-glass-wrapper .btn--primary:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 8px 28px -6px rgba(45,91,254,0.65);\n}\n.zayden-glass-wrapper .btn--ghost {\n  border-color: var(--line-s);\n  color: var(--frost-dim);\n}\n.zayden-glass-wrapper .btn--ghost:hover {\n  border-color: var(--sakura);\n  color: var(--sakura);\n}\n\n\/* ─── HAIKU ──────────────────────────────────────────── *\/\n.zayden-glass-wrapper .haiku {\n  padding: 120px 48px;\n  text-align: center;\n  border-top: 1px solid var(--line);\n}\n.zayden-glass-wrapper .haiku__text {\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 300;\n  font-style: italic;\n  font-size: clamp(1.6rem, 3.5vw, 2.8rem);\n  line-height: 1.6;\n  color: var(--frost);\n  max-width: 22ch;\n  margin: 0 auto;\n}\n.zayden-glass-wrapper .haiku__text span {\n  display: block;\n}\n.zayden-glass-wrapper .haiku__rule {\n  width: 1px;\n  height: 60px;\n  background: linear-gradient(to bottom, transparent, var(--sakura), transparent);\n  margin: 48px auto;\n}\n.zayden-glass-wrapper .haiku__tag {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.26em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n}\n\n\/* ─── FEATURE ROWS ───────────────────────────────────── *\/\n.zayden-glass-wrapper .features {\n  border-top: 1px solid var(--line);\n  padding: 0 48px;\n}\n.zayden-glass-wrapper .feature-row {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 0;\n  min-height: 520px;\n  border-bottom: 1px solid var(--line);\n  opacity: 0;\n  transform: translateY(32px);\n  transition: opacity 0.9s ease, transform 0.9s ease;\n}\n.zayden-glass-wrapper .feature-row.in-view {\n  opacity: 1;\n  transform: translateY(0);\n}\n.zayden-glass-wrapper .feature-row:nth-child(even) .feature-img  { order: 2; }\n.zayden-glass-wrapper .feature-row:nth-child(even) .feature-copy { order: 1; }\n\n.zayden-glass-wrapper .feature-img {\n  overflow: hidden;\n  position: relative;\n}\n.zayden-glass-wrapper .feature-img img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: transform 0.8s ease;\n}\n.zayden-glass-wrapper .feature-row:hover .feature-img img {\n  transform: scale(1.03);\n}\n\n.zayden-glass-wrapper .feature-copy {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  padding: 64px 72px;\n  background: var(--panel);\n}\n.zayden-glass-wrapper .feature-row:nth-child(even) .feature-copy {\n  background: var(--void);\n}\n.zayden-glass-wrapper .feature-num {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.24em;\n  color: var(--sakura);\n  margin-bottom: 20px;\n}\n.zayden-glass-wrapper .feature-copy h2 {\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 300;\n  font-size: clamp(2rem, 3.5vw, 3rem);\n  line-height: 1.1;\n  color: var(--frost);\n  margin-bottom: 20px;\n}\n.zayden-glass-wrapper .feature-copy h2 em {\n  font-style: italic;\n  color: var(--sakura);\n}\n.zayden-glass-wrapper .feature-copy p {\n  font-family: 'DM Sans', sans-serif;\n  font-size: 15px;\n  color: var(--frost-dim);\n  max-width: 38ch;\n  line-height: 1.75;\n}\n\n\/* ─── SPECS ──────────────────────────────────────────── *\/\n.zayden-glass-wrapper .specs {\n  border-top: 1px solid var(--line);\n  padding: 100px 48px;\n}\n.zayden-glass-wrapper .specs__head {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.28em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  margin-bottom: 48px;\n}\n.zayden-glass-wrapper .specs-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 1px;\n  background: var(--line);\n  border: 1px solid var(--line);\n  border-radius: var(--r);\n  overflow: hidden;\n  max-width: 860px;\n}\n.zayden-glass-wrapper .spec-cell {\n  background: var(--panel);\n  padding: 32px 28px;\n}\n.zayden-glass-wrapper .spec-cell dt {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 10px;\n  letter-spacing: 0.22em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  margin-bottom: 10px;\n}\n.zayden-glass-wrapper .spec-cell dd {\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 400;\n  font-size: 1.5rem;\n  color: var(--frost);\n  line-height: 1.2;\n}\n.zayden-glass-wrapper .spec-cell.accent dd { color: var(--sakura); }\n\n\/* ─── GALLERY STRIP ──────────────────────────────────── *\/\n.zayden-glass-wrapper .gallery {\n  border-top: 1px solid var(--line);\n  padding: 80px 0 0;\n  overflow: hidden;\n}\n.zayden-glass-wrapper .gallery__head {\n  padding: 0 48px;\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.28em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  margin-bottom: 40px;\n}\n.zayden-glass-wrapper .gallery-strip {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 1px;\n  background: var(--line);\n}\n.zayden-glass-wrapper .gallery-item {\n  overflow: hidden;\n  aspect-ratio: 1\/1;\n  opacity: 0;\n  transform: translateY(24px);\n  transition: opacity 0.7s ease, transform 0.7s ease;\n}\n.zayden-glass-wrapper .gallery-item.in-view { opacity:1; transform:translateY(0); }\n.zayden-glass-wrapper .gallery-item:nth-child(2) { transition-delay: 0.1s; }\n.zayden-glass-wrapper .gallery-item:nth-child(3) { transition-delay: 0.2s; }\n.zayden-glass-wrapper .gallery-item:nth-child(4) { transition-delay: 0.3s; }\n.zayden-glass-wrapper .gallery-item img {\n  width: 100%; height: 100%;\n  object-fit: cover;\n  transition: transform 0.7s ease;\n}\n.zayden-glass-wrapper .gallery-item:hover img { transform: scale(1.06); }\n\n\/* ─── CTA SECTION ────────────────────────────────────── *\/\n.zayden-glass-wrapper .cta-section {\n  border-top: 1px solid var(--line);\n  padding: 120px 48px;\n  text-align: center;\n  position: relative;\n  overflow: hidden;\n}\n.zayden-glass-wrapper .cta-section::before {\n  content: '';\n  position: absolute;\n  bottom: -20%;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 70%;\n  height: 60%;\n  background: radial-gradient(ellipse, var(--sakura-glow), transparent 70%);\n  pointer-events: none;\n}\n.zayden-glass-wrapper .cta-section h2 {\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 300;\n  font-size: clamp(2.8rem, 7vw, 6rem);\n  line-height: 1.05;\n  color: var(--frost);\n  margin-bottom: 18px;\n}\n.zayden-glass-wrapper .cta-section h2 em {\n  font-style: italic;\n  color: var(--sakura);\n}\n.zayden-glass-wrapper .cta-section p {\n  font-family: 'DM Sans', sans-serif;\n  font-size: 15px;\n  color: var(--frost-dim);\n  margin: 0 auto 40px;\n  max-width: 44ch;\n}\n.zayden-glass-wrapper .cta-section .price-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  margin-bottom: 36px;\n  flex-wrap: wrap;\n}\n.zayden-glass-wrapper .price-tag {\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 400;\n  font-size: 3.5rem;\n  color: var(--frost);\n  line-height: 1;\n}\n.zayden-glass-wrapper .price-meta {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.18em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  text-align: left;\n  line-height: 1.7;\n}\n\n\/* ─── FAQ ────────────────────────────────────────────── *\/\n.zayden-glass-wrapper .faq {\n  border-top: 1px solid var(--line);\n  padding: 100px 48px;\n  max-width: 720px;\n  margin: 0 auto;\n}\n.zayden-glass-wrapper .faq__head {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 11px;\n  letter-spacing: 0.28em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  margin-bottom: 40px;\n}\n.zayden-glass-wrapper details {\n  border-bottom: 1px solid var(--line);\n  padding: 24px 0;\n}\n.zayden-glass-wrapper summary {\n  cursor: pointer;\n  font-family: 'Cormorant Garamond', serif;\n  font-weight: 400;\n  font-size: 1.25rem;\n  color: var(--frost);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  list-style: none;\n}\n.zayden-glass-wrapper summary::-webkit-details-marker { display: none; }\n.zayden-glass-wrapper summary::after {\n  content: '+';\n  font-family: 'DM Sans', sans-serif;\n  font-size: 20px;\n  color: var(--sakura);\n  transition: transform 0.3s;\n  flex-shrink: 0;\n  margin-left: 16px;\n}\n.zayden-glass-wrapper details[open] summary::after { transform: rotate(45deg); }\n.zayden-glass-wrapper details p {\n  margin-top: 14px;\n  font-family: 'DM Sans', sans-serif;\n  font-size: 15px;\n  color: var(--frost-dim);\n  max-width: 56ch;\n}\n\n\/* ─── FOOTER ─────────────────────────────────────────── *\/\n.zayden-glass-wrapper footer {\n  border-top: 1px solid var(--line);\n  padding: 48px;\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  flex-wrap: wrap;\n  gap: 20px;\n}\n.zayden-glass-wrapper .footer-brand {\n  font-family: 'Cormorant Garamond', serif;\n  font-style: italic;\n  font-weight: 300;\n  font-size: 1.4rem;\n  color: var(--frost);\n}\n.zayden-glass-wrapper .footer-brand strong {\n  font-style: normal;\n  color: var(--sakura);\n}\n.zayden-glass-wrapper .footer-copy {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 10px;\n  letter-spacing: 0.18em;\n  text-transform: uppercase;\n  color: var(--frost-faint);\n  text-align: right;\n}\n\n\/* ─── REVEAL ─────────────────────────────────────────── *\/\n.zayden-glass-wrapper .reveal {\n  opacity: 0;\n  transform: translateY(28px);\n  transition: opacity 0.85s ease, transform 0.85s ease;\n}\n.zayden-glass-wrapper .reveal.in-view {\n  opacity: 1;\n  transform: translateY(0);\n}\n\n\/* ─── REDUCED MOTION ─────────────────────────────────── *\/\n@media (prefers-reduced-motion: reduce) {\n  .zayden-glass-wrapper *, \n  .zayden-glass-wrapper *::before, \n  .zayden-glass-wrapper *::after {\n    animation: none !important;\n    transition: none !important;\n  }\n}\n\n\/* ─── RESPONSIVE ─────────────────────────────────────── *\/\n@media (max-width: 900px) {\n  .zayden-glass-wrapper nav { padding: 18px 24px; }\n  .zayden-glass-wrapper .hero { padding: 100px 24px 64px; }\n  .zayden-glass-wrapper .haiku { padding: 80px 24px; }\n  .zayden-glass-wrapper .features { padding: 0 24px; }\n  .zayden-glass-wrapper .feature-row {\n    grid-template-columns: 1fr;\n    min-height: auto;\n  }\n  .zayden-glass-wrapper .feature-row:nth-child(even) .feature-img  { order: 0; }\n  .zayden-glass-wrapper .feature-row:nth-child(even) .feature-copy { order: 0; }\n  .zayden-glass-wrapper .feature-img { aspect-ratio: 4\/3; }\n  .zayden-glass-wrapper .feature-copy { padding: 40px 28px; }\n  .zayden-glass-wrapper .specs { padding: 72px 24px; }\n  .zayden-glass-wrapper .specs-grid { grid-template-columns: 1fr 1fr; }\n  .zayden-glass-wrapper .gallery-strip { grid-template-columns: 1fr 1fr; }\n  .zayden-glass-wrapper .cta-section { padding: 80px 24px; }\n  .zayden-glass-wrapper .faq { padding: 72px 24px; }\n  .zayden-glass-wrapper footer { padding: 32px 24px; }\n}\n@media (max-width: 520px) {\n  .zayden-glass-wrapper .specs-grid { grid-template-columns: 1fr; }\n  .zayden-glass-wrapper .gallery-strip { grid-template-columns: 1fr 1fr; }\n  .zayden-glass-wrapper .nav-right { display: none; }\n}\n\u003c\/style\u003e\n\n\u003c!-- ============================================== --\u003e\n\u003c!-- WRAPPER STARTS HERE                            --\u003e\n\u003c!-- ============================================== --\u003e\n\u003cdiv class=\"zayden-glass-wrapper\"\u003e\n\n  \u003c!-- HERO --\u003e\n  \u003csection class=\"hero\"\u003e\n    \u003cdiv class=\"petal-field\" aria-hidden=\"true\"\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n      \u003cdiv class=\"petal\"\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cp class=\"hero__kicker\"\u003eZayden Glass Series — Yoru Sakura\u003c\/p\u003e\n\n    \u003ch1 class=\"hero__title\"\u003e\n      Night\u003cbr\u003e\n      \u003cem\u003eBlooms\u003c\/em\u003e\n    \u003c\/h1\u003e\n\n    \u003cdiv class=\"hero__img-wrap\"\u003e\n      \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_16_2026_04_44_13_PM.png?v=1781608731\" alt=\"Yoru Sakura glass mousepad floating — cherry blossoms on black glass\"\u003e\n    \u003c\/div\u003e\n\n    \u003cp class=\"hero__sub\"\u003eCherry blossoms sealed in photovoltaic glass.\u003cbr\u003e450 × 400mm. 3.2mm thick. Built to outlast every cloth pad you've ever burned through.\u003c\/p\u003e\n\n    \u003cdiv class=\"hero__cta\"\u003e\n      \u003ca href=\"#buy\" class=\"btn btn--primary\"\u003eExplore Yoru Sakura\u003c\/a\u003e\n      \u003ca href=\"#features\" class=\"btn btn--ghost\"\u003eSee what's inside\u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- HAIKU BREAK --\u003e\n  \u003csection class=\"haiku\"\u003e\n    \u003cdiv class=\"haiku__rule\"\u003e\u003c\/div\u003e\n    \u003cp class=\"haiku__text\"\u003e\n      \u003cspan\u003ePetals fall once.\u003c\/span\u003e\n      \u003cspan\u003eGlass holds them\u003c\/span\u003e\n      \u003cspan\u003eforever.\u003c\/span\u003e\n    \u003c\/p\u003e\n    \u003cdiv class=\"haiku__rule\"\u003e\u003c\/div\u003e\n    \u003cp class=\"haiku__tag\"\u003ePhotovoltaic glass · UV print · Non-slip base\u003c\/p\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- FEATURE ROWS --\u003e\n  \u003cdiv class=\"features\" id=\"features\"\u003e\n\n    \u003cdiv class=\"feature-row in-view\"\u003e\n      \u003cdiv class=\"feature-img\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_16_2026_04_44_13_PM.png?v=1781608731\" alt=\"Yoru Sakura mousepad floating — clean white studio\"\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"feature-copy\"\u003e\n        \u003cp class=\"feature-num\"\u003e01 — Surface\u003c\/p\u003e\n        \u003ch2\u003eGlass that \u003cem\u003eglides\u003c\/em\u003e\n\u003c\/h2\u003e\n        \u003cp\u003ePhotovoltaic glass — eco-rated, scratch-resistant, and perfectly flat. Your sensor reads it identically at every corner. No worn patches, no fabric fraying, no dead zones after six months.\u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"feature-row in-view\"\u003e\n      \u003cdiv class=\"feature-img\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_16_2026_04_36_04_PM.png?v=1781612205\" alt=\"Yoru Sakura mousepad on dark desk with cherry blossoms\"\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"feature-copy\"\u003e\n        \u003cp class=\"feature-num\"\u003e02 — Art\u003c\/p\u003e\n        \u003ch2\u003eSealed \u003cem\u003ebeneath\u003c\/em\u003e\u003cbr\u003ethe glass\u003c\/h2\u003e\n        \u003cp\u003eThe cherry blossom artwork lives underneath the glass, not on top of it. UV-cured and protected from the start. It won't fade, scratch, or peel — because nothing ever touches the print.\u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"feature-row in-view\"\u003e\n      \u003cdiv class=\"feature-img\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_16_2026_04_45_41_PM.png?v=1781608705\" alt=\"Yoru Sakura mousepad propped on dark stone\"\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"feature-copy\"\u003e\n        \u003cp class=\"feature-num\"\u003e03 — Build\u003c\/p\u003e\n        \u003ch2\u003e3.2mm.\u003cbr\u003e\u003cem\u003eNo flex.\u003c\/em\u003e\n\u003c\/h2\u003e\n        \u003cp\u003eThick enough to feel solid, slim enough to stay low. Polished edges, a non-slip silicone base, and corners that won't lift off your desk — even after years of use.\u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n\n  \u003c\/div\u003e\n\n  \u003c!-- SPECS --\u003e\n  \u003csection class=\"specs reveal\"\u003e\n    \u003cp class=\"specs__head\"\u003eTechnical specifications\u003c\/p\u003e\n    \u003cdl class=\"specs-grid\"\u003e\n      \u003cdiv class=\"spec-cell\"\u003e\n        \u003cdt\u003eDimensions\u003c\/dt\u003e\n        \u003cdd\u003e450 × 400mm\u003c\/dd\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"spec-cell\"\u003e\n        \u003cdt\u003eThickness\u003c\/dt\u003e\n        \u003cdd\u003e3.2mm\u003c\/dd\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"spec-cell accent\"\u003e\n        \u003cdt\u003eSurface material\u003c\/dt\u003e\n        \u003cdd\u003ePhotovoltaic glass\u003c\/dd\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"spec-cell\"\u003e\n        \u003cdt\u003ePrint method\u003c\/dt\u003e\n        \u003cdd\u003eUV-cured, sealed beneath glass\u003c\/dd\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"spec-cell\"\u003e\n        \u003cdt\u003eBase\u003c\/dt\u003e\n        \u003cdd\u003eNon-slip silicone\u003c\/dd\u003e\n      \u003c\/div\u003e\n      \u003cdiv class=\"spec-cell\"\u003e\n        \u003cdt\u003eEdge finish\u003c\/dt\u003e\n        \u003cdd\u003ePolished, rounded\u003c\/dd\u003e\n      \u003c\/div\u003e\n    \u003c\/dl\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- CTA --\u003e\n  \u003csection class=\"cta-section reveal\" id=\"buy\"\u003e\n    \u003ch2\u003eArt you\u003cbr\u003e\u003cem\u003euse daily.\u003c\/em\u003e\n\u003c\/h2\u003e\n    \u003cp\u003ePhotovoltaic glass. UV-cured cherry blossom art. Non-slip base. One piece, no compromises.\u003c\/p\u003e\n    \u003ca href=\"\/de\/products\/yoru-sakura\" class=\"btn btn--primary\"\u003eView Product\u003c\/a\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- FAQ --\u003e\n  \u003csection class=\"faq reveal\"\u003e\n    \u003cp class=\"faq__head\"\u003eQuestions\u003c\/p\u003e\n    \u003cdetails\u003e\n      \u003csummary\u003eIs glass actually good for gaming?\u003c\/summary\u003e\n      \u003cp\u003eYes. Glass gives your sensor a perfectly consistent surface with no texture variation — meaning your cursor tracks the same at every spot on the pad, at any DPI, indefinitely. Cloth pads develop dead zones and worn patches over months. Glass doesn't.\u003c\/p\u003e\n    \u003c\/details\u003e\n    \u003cdetails\u003e\n      \u003csummary\u003eWill the print fade or scratch?\u003c\/summary\u003e\n      \u003cp\u003eThe art is UV-cured and sealed beneath the glass — nothing touches the print directly. It won't fade from light exposure, and the surface above it is tempered glass, so it won't scratch under normal use.\u003c\/p\u003e\n    \u003c\/details\u003e\n    \u003cdetails\u003e\n      \u003csummary\u003eIs it heavy?\u003c\/summary\u003e\n      \u003cp\u003eIt's denser than a cloth pad, but at 3.2mm it's not bulky. The non-slip silicone base keeps it locked in place so you don't notice the weight — the pad doesn't move, so neither does your aim.\u003c\/p\u003e\n    \u003c\/details\u003e\n    \u003cdetails\u003e\n      \u003csummary\u003eWhat if my desk is glass or polished wood?\u003c\/summary\u003e\n      \u003cp\u003eThe silicone underside is safe on all desk surfaces including glass, lacquered wood, and metal. It won't mark or scratch.\u003c\/p\u003e\n    \u003c\/details\u003e\n  \u003c\/section\u003e\n\n\u003c\/div\u003e \n\u003c!-- ============================================== --\u003e\n\u003c!-- WRAPPER ENDS HERE                              --\u003e\n\u003c!-- ============================================== --\u003e\n\n\u003cscript\u003e\n  const io = new IntersectionObserver((entries) =\u003e {\n    entries.forEach(e =\u003e {\n      if (e.isIntersecting) e.target.classList.add('in-view');\n    });\n  }, { threshold: 0.12 });\n\n  document.querySelectorAll('.reveal, .feature-row, .gallery-item').forEach(el =\u003e io.observe(el));\n\u003c\/script\u003e","brand":"ZayDen","offers":[{"title":"🌸 Sakura Ripple","offer_id":47925016428695,"sku":null,"price":69.0,"currency_code":"USD","in_stock":true},{"title":"🌸 Sakura Canopy","offer_id":47925016461463,"sku":null,"price":69.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_15_2026_10_52_39_PM.png?v=1781605293"},{"product_id":"ryumon","title":"ZayDen Ryūmon - Keyboard Ribbon for Mechanical Keyboard","description":"\u003c!-- RYŪMON SECTION --\u003e\n\u003clink rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\"\u003e\n\u003clink rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\"\u003e\n\u003clink href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400\u0026amp;family=DM+Sans:wght@300;400;500\u0026amp;display=swap\" rel=\"stylesheet\"\u003e\n\n\u003cstyle\u003e\n  \/* ── SCOPED RESET \u0026 VARIABLES ── *\/\n  .ryumon-wrapper {\n    --gold: #B8952A;\n    --gold-light: #D4AF5A;\n    --ink: #0C0B09;\n    --ivory: #F2EDE4;\n    --ivory-dim: #E2DAD0;\n    --muted: #8A8278;\n    --teal: #1B8B87;\n    --teal-light: #4EC5C1;\n    --crimson: #9B1C1C;\n    --crimson-light: #C0392B;\n    --shadow-ink: #1A1714;\n\n    background: var(--ink);\n    color: var(--ivory);\n    font-family: 'DM Sans', sans-serif;\n    font-weight: 300;\n    line-height: 1.7;\n    overflow-x: hidden;\n    width: 100%;\n  }\n\n  .ryumon-wrapper *, \n  .ryumon-wrapper *::before, \n  .ryumon-wrapper *::after { \n    box-sizing: border-box; \n    margin: 0; \n    padding: 0; \n  }\n\n  \/* ── OPENING RITUAL ── *\/\n  .ryumon-wrapper .ritual-open {\n    height: 100vh;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .ryumon-wrapper .ritual-open::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background: radial-gradient(ellipse 60% 50% at 50% 60%, rgba(184,149,42,0.08) 0%, transparent 70%);\n    pointer-events: none;\n  }\n\n  .ryumon-wrapper .kamon {\n    width: 80px;\n    height: 80px;\n    border: 1px solid var(--gold);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 2.5rem;\n    position: relative;\n    animation: kamon-spin 20s linear infinite;\n  }\n\n  .ryumon-wrapper .kamon::before {\n    content: '';\n    position: absolute;\n    inset: 6px;\n    border: 1px solid rgba(184,149,42,0.35);\n    border-radius: 50%;\n  }\n\n  .ryumon-wrapper .kamon-inner {\n    width: 28px;\n    height: 28px;\n    border: 1px solid var(--gold);\n    border-radius: 50%;\n    position: relative;\n  }\n\n  .ryumon-wrapper .kamon-inner::after {\n    content: '';\n    position: absolute;\n    top: 50%; left: 50%;\n    transform: translate(-50%, -50%);\n    width: 8px; height: 8px;\n    background: var(--gold);\n    border-radius: 50%;\n  }\n\n  @keyframes kamon-spin {\n    from { transform: rotate(0deg); }\n    to { transform: rotate(360deg); }\n  }\n\n  .ryumon-wrapper .brand-name {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(3.5rem, 8vw, 7rem);\n    font-weight: 300;\n    letter-spacing: 0.35em;\n    color: var(--ivory);\n    line-height: 1;\n    text-transform: uppercase;\n    margin-bottom: 1rem;\n  }\n\n  .ryumon-wrapper .brand-tagline {\n    font-size: 0.7rem;\n    letter-spacing: 0.4em;\n    color: var(--gold);\n    text-transform: uppercase;\n    margin-bottom: 3rem;\n  }\n\n  .ryumon-wrapper .gold-rule {\n    width: 1px;\n    height: 60px;\n    background: linear-gradient(to bottom, transparent, var(--gold), transparent);\n    margin: 0 auto;\n    animation: pulse-line 3s ease-in-out infinite;\n  }\n\n  @keyframes pulse-line {\n    0%, 100% { opacity: 0.4; }\n    50% { opacity: 1; }\n  }\n\n  \/* ── MANIFESTO ── *\/\n  .ryumon-wrapper .manifesto {\n    max-width: 720px;\n    margin: 0 auto;\n    padding: 8rem 2rem;\n    text-align: center;\n  }\n\n  .ryumon-wrapper .manifesto-label {\n    font-size: 0.65rem;\n    letter-spacing: 0.5em;\n    color: var(--gold);\n    text-transform: uppercase;\n    display: block;\n    margin-bottom: 2.5rem;\n  }\n\n  .ryumon-wrapper .manifesto-text {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(1.5rem, 3vw, 2.2rem);\n    font-weight: 300;\n    font-style: italic;\n    line-height: 1.6;\n    color: var(--ivory);\n    margin-bottom: 3rem;\n  }\n\n  .ryumon-wrapper .manifesto-body {\n    font-size: 0.9rem;\n    color: var(--muted);\n    letter-spacing: 0.03em;\n    max-width: 480px;\n    margin: 0 auto;\n    line-height: 1.9;\n  }\n\n  \/* ── HORIZONTAL GOLD DIVIDER ── *\/\n  .ryumon-wrapper .horizon {\n    display: flex;\n    align-items: center;\n    gap: 1.5rem;\n    padding: 0 4rem;\n    overflow: hidden;\n  }\n\n  .ryumon-wrapper .horizon-line {\n    flex: 1;\n    height: 1px;\n    background: linear-gradient(to right, transparent, var(--gold), transparent);\n    opacity: 0.3;\n  }\n\n  .ryumon-wrapper .horizon-glyph {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 1.2rem;\n    color: var(--gold);\n    opacity: 0.6;\n    letter-spacing: 0.2em;\n  }\n\n  \/* ── SPIRIT CHAPTERS ── *\/\n  .ryumon-wrapper .chapter {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    min-height: 100vh;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .ryumon-wrapper .chapter:nth-child(even) .chapter-image { order: 2; }\n  .ryumon-wrapper .chapter:nth-child(even) .chapter-text  { order: 1; }\n\n  .ryumon-wrapper .chapter-image {\n    position: relative;\n    overflow: hidden;\n  }\n\n  .ryumon-wrapper .chapter-image img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    transition: transform 0.8s ease;\n  }\n\n  .ryumon-wrapper .chapter:hover .chapter-image img {\n    transform: scale(1.03);\n  }\n\n  .ryumon-wrapper .chapter-image-overlay {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n  }\n\n  .ryumon-wrapper .chapter--teal .chapter-image-overlay {\n    background: linear-gradient(135deg, rgba(27,139,135,0.18) 0%, transparent 60%);\n  }\n  .ryumon-wrapper .chapter--crimson .chapter-image-overlay {\n    background: linear-gradient(135deg, rgba(155,28,28,0.2) 0%, transparent 60%);\n  }\n  .ryumon-wrapper .chapter--shadow .chapter-image-overlay {\n    background: linear-gradient(135deg, rgba(12,11,9,0.25) 0%, transparent 60%);\n  }\n\n  .ryumon-wrapper .chapter-text {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: clamp(3rem, 6vw, 6rem) clamp(2.5rem, 5vw, 5rem);\n    position: relative;\n  }\n\n  .ryumon-wrapper .chapter--teal .chapter-text::before {\n    content: '';\n    position: absolute;\n    left: 0; top: 10%; bottom: 10%;\n    width: 1px;\n    background: linear-gradient(to bottom, transparent, var(--teal-light), transparent);\n  }\n  .ryumon-wrapper .chapter--crimson .chapter-text::before {\n    content: '';\n    position: absolute;\n    right: 0; top: 10%; bottom: 10%;\n    width: 1px;\n    background: linear-gradient(to bottom, transparent, var(--crimson-light), transparent);\n  }\n  .ryumon-wrapper .chapter--shadow .chapter-text::before {\n    content: '';\n    position: absolute;\n    left: 0; top: 10%; bottom: 10%;\n    width: 1px;\n    background: linear-gradient(to bottom, transparent, var(--gold-light), transparent);\n  }\n\n  .ryumon-wrapper .spirit-number {\n    font-size: 0.62rem;\n    letter-spacing: 0.5em;\n    color: var(--muted);\n    text-transform: uppercase;\n    margin-bottom: 1.2rem;\n  }\n\n  .ryumon-wrapper .spirit-name {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(2.8rem, 5vw, 4.5rem);\n    font-weight: 300;\n    line-height: 1.05;\n    margin-bottom: 0.6rem;\n    letter-spacing: -0.01em;\n  }\n\n  .ryumon-wrapper .chapter--teal .spirit-name  { color: var(--teal-light); }\n  .ryumon-wrapper .chapter--crimson .spirit-name { color: #E87070; }\n  .ryumon-wrapper .chapter--shadow .spirit-name  { color: var(--gold-light); }\n\n  .ryumon-wrapper .spirit-subtitle {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 1rem;\n    font-style: italic;\n    color: var(--muted);\n    margin-bottom: 2.5rem;\n    letter-spacing: 0.05em;\n  }\n\n  .ryumon-wrapper .spirit-lore {\n    font-size: 0.88rem;\n    color: #B5AFA7;\n    line-height: 1.9;\n    max-width: 400px;\n    margin-bottom: 2.5rem;\n  }\n\n  .ryumon-wrapper .spirit-details {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 1.2rem;\n    margin-bottom: 2.5rem;\n  }\n\n  .ryumon-wrapper .detail-item {\n    border-top: 1px solid rgba(255,255,255,0.08);\n    padding-top: 0.8rem;\n  }\n\n  .ryumon-wrapper .detail-label {\n    font-size: 0.62rem;\n    letter-spacing: 0.4em;\n    color: var(--muted);\n    text-transform: uppercase;\n    display: block;\n    margin-bottom: 0.3rem;\n  }\n\n  .ryumon-wrapper .detail-value {\n    font-size: 0.85rem;\n    color: var(--ivory-dim);\n    font-weight: 400;\n  }\n\n  .ryumon-wrapper .cta-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 1rem;\n    padding: 1rem 2rem;\n    border: 1px solid currentColor;\n    background: transparent;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 0.7rem;\n    letter-spacing: 0.35em;\n    text-transform: uppercase;\n    text-decoration: none;\n    cursor: pointer;\n    transition: background 0.3s, color 0.3s;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .ryumon-wrapper .cta-btn::after {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background: currentColor;\n    transform: scaleX(0);\n    transform-origin: left;\n    transition: transform 0.35s ease;\n    z-index: 0;\n  }\n\n  .ryumon-wrapper .cta-btn:hover::after { transform: scaleX(1); }\n\n  .ryumon-wrapper .cta-btn span {\n    position: relative;\n    z-index: 1;\n    transition: color 0.35s;\n  }\n\n  .ryumon-wrapper .cta-btn:hover span { color: var(--ink); }\n\n  .ryumon-wrapper .chapter--teal .cta-btn  { color: var(--teal-light); }\n  .ryumon-wrapper .chapter--crimson .cta-btn { color: #E87070; }\n  .ryumon-wrapper .chapter--shadow .cta-btn  { color: var(--gold-light); }\n\n  .ryumon-wrapper .btn-arrow {\n    position: relative;\n    z-index: 1;\n    font-size: 1rem;\n    transition: transform 0.3s, color 0.35s;\n  }\n\n  .ryumon-wrapper .cta-btn:hover .btn-arrow {\n    transform: translateX(4px);\n    color: var(--ink);\n  }\n\n  \/* ── CRAFT SECTION ── *\/\n  .ryumon-wrapper .craft {\n    padding: 8rem 2rem;\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .ryumon-wrapper .craft-header {\n    text-align: center;\n    margin-bottom: 5rem;\n  }\n\n  .ryumon-wrapper .craft-pillars {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 3rem;\n  }\n\n  .ryumon-wrapper .pillar {\n    text-align: center;\n  }\n\n  .ryumon-wrapper .pillar-icon {\n    width: 48px;\n    height: 48px;\n    border: 1px solid rgba(184,149,42,0.3);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin: 0 auto 1.5rem;\n  }\n\n  .ryumon-wrapper .pillar-icon svg {\n    width: 20px;\n    height: 20px;\n    stroke: var(--gold);\n    fill: none;\n    stroke-width: 1.2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n  }\n\n  .ryumon-wrapper .pillar-title {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 1.25rem;\n    font-weight: 400;\n    color: var(--ivory);\n    margin-bottom: 0.8rem;\n    letter-spacing: 0.05em;\n  }\n\n  .ryumon-wrapper .pillar-text {\n    font-size: 0.83rem;\n    color: var(--muted);\n    line-height: 1.8;\n  }\n\n  \/* ── TRIO GALLERY ── *\/\n  .ryumon-wrapper .trio {\n    padding: 0 2rem 8rem;\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .ryumon-wrapper .trio-header {\n    text-align: center;\n    margin-bottom: 4rem;\n  }\n\n  .ryumon-wrapper .trio-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 2px;\n  }\n\n  .ryumon-wrapper .trio-card {\n    position: relative;\n    aspect-ratio: 1;\n    overflow: hidden;\n    cursor: pointer;\n  }\n\n  .ryumon-wrapper .trio-card img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    transition: transform 0.7s ease;\n    display: block;\n  }\n\n  .ryumon-wrapper .trio-card:hover img { transform: scale(1.06); }\n\n  .ryumon-wrapper .trio-card-caption {\n    position: absolute;\n    bottom: 0; left: 0; right: 0;\n    padding: 2rem 1.5rem 1.5rem;\n    background: linear-gradient(to top, rgba(12,11,9,0.85) 0%, transparent 100%);\n    transform: translateY(100%);\n    transition: transform 0.4s ease;\n  }\n\n  .ryumon-wrapper .trio-card:hover .trio-card-caption { transform: translateY(0); }\n\n  .ryumon-wrapper .trio-card-name {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 1.4rem;\n    font-weight: 300;\n    color: var(--ivory);\n    display: block;\n    margin-bottom: 0.2rem;\n  }\n\n  .ryumon-wrapper .trio-card-sub {\n    font-size: 0.7rem;\n    letter-spacing: 0.3em;\n    color: var(--muted);\n    text-transform: uppercase;\n  }\n\n  \/* ── PROMISE SECTION ── *\/\n  .ryumon-wrapper .promise {\n    background: var(--shadow-ink);\n    padding: 6rem 2rem;\n    text-align: center;\n    border-top: 1px solid rgba(184,149,42,0.12);\n    border-bottom: 1px solid rgba(184,149,42,0.12);\n  }\n\n  .ryumon-wrapper .promise-inner {\n    max-width: 680px;\n    margin: 0 auto;\n  }\n\n  .ryumon-wrapper .promise-quote {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(1.6rem, 3.5vw, 2.6rem);\n    font-weight: 300;\n    font-style: italic;\n    line-height: 1.5;\n    color: var(--ivory);\n    margin-bottom: 2rem;\n  }\n\n  .ryumon-wrapper .promise-badges {\n    display: flex;\n    justify-content: center;\n    flex-wrap: wrap;\n    gap: 2rem;\n    margin-top: 3rem;\n  }\n\n  .ryumon-wrapper .badge {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 0.5rem;\n  }\n\n  .ryumon-wrapper .badge-icon {\n    width: 36px;\n    height: 36px;\n    border: 1px solid rgba(184,149,42,0.4);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .ryumon-wrapper .badge-icon svg {\n    width: 16px;\n    height: 16px;\n    stroke: var(--gold);\n    fill: none;\n    stroke-width: 1.5;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n  }\n\n  .ryumon-wrapper .badge-label {\n    font-size: 0.65rem;\n    letter-spacing: 0.3em;\n    color: var(--muted);\n    text-transform: uppercase;\n  }\n\n  \/* ── SECTION LABEL ── *\/\n  .ryumon-wrapper .section-eyebrow {\n    font-size: 0.62rem;\n    letter-spacing: 0.5em;\n    color: var(--gold);\n    text-transform: uppercase;\n    display: block;\n    margin-bottom: 1.5rem;\n  }\n\n  .ryumon-wrapper .section-title {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(2rem, 4vw, 3rem);\n    font-weight: 300;\n    color: var(--ivory);\n    line-height: 1.15;\n    margin-bottom: 1rem;\n  }\n\n  \/* ── SCROLL REVEAL ── *\/\n  .ryumon-wrapper .reveal {\n    opacity: 0;\n    transform: translateY(28px);\n    transition: opacity 0.8s ease, transform 0.8s ease;\n  }\n\n  .ryumon-wrapper .reveal.visible {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  .ryumon-wrapper .reveal-delay-1 { transition-delay: 0.1s; }\n  .ryumon-wrapper .reveal-delay-2 { transition-delay: 0.22s; }\n  .ryumon-wrapper .reveal-delay-3 { transition-delay: 0.34s; }\n  .ryumon-wrapper .reveal-delay-4 { transition-delay: 0.46s; }\n\n  \/* ── RESPONSIVE ── *\/\n  @media (max-width: 800px) {\n    .ryumon-wrapper .chapter {\n      grid-template-columns: 1fr;\n      min-height: auto;\n    }\n\n    .ryumon-wrapper .chapter:nth-child(even) .chapter-image { order: 0; }\n    .ryumon-wrapper .chapter:nth-child(even) .chapter-text  { order: 1; }\n\n    .ryumon-wrapper .chapter--teal .chapter-text::before,\n    .ryumon-wrapper .chapter--crimson .chapter-text::before,\n    .ryumon-wrapper .chapter--shadow .chapter-text::before {\n      display: none;\n    }\n\n    .ryumon-wrapper .chapter-image { height: 60vw; }\n    .ryumon-wrapper .craft-pillars { grid-template-columns: 1fr; gap: 2rem; }\n    .ryumon-wrapper .trio-grid { grid-template-columns: 1fr; }\n    .ryumon-wrapper .trio-card { aspect-ratio: 4\/3; }\n    .ryumon-wrapper .spirit-details { grid-template-columns: 1fr; }\n  }\n\n  @media (max-width: 500px) {\n    .ryumon-wrapper .manifesto { padding: 5rem 1.5rem; }\n    .ryumon-wrapper .chapter-text { padding: 2.5rem 1.5rem; }\n    .ryumon-wrapper .craft { padding: 4rem 1.5rem; }\n    .ryumon-wrapper .trio { padding: 0 1.5rem 4rem; }\n\n    .ryumon-wrapper .ritual-open {\n      height: auto;\n      min-height: 75vh;\n      padding: 6rem 1rem 2rem;\n    }\n\n    .ryumon-wrapper .kamon {\n      width: 60px;\n      height: 60px;\n      margin-bottom: 1.5rem;\n    }\n\n    .ryumon-wrapper .brand-tagline {\n      margin-bottom: 2rem;\n      text-align: center;\n      line-height: 1.6;\n    }\n\n    .ryumon-wrapper .gold-rule {\n      height: 40px;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ryumon-wrapper .kamon { animation: none; }\n    .ryumon-wrapper .gold-rule { animation: none; }\n    .ryumon-wrapper .reveal {\n      opacity: 1;\n      transform: none;\n      transition: none;\n    }\n  }\n\u003c\/style\u003e\n\n\u003cdiv class=\"ryumon-wrapper\"\u003e\n  \u003c!-- ══ OPENING RITUAL ══ --\u003e\n  \u003csection class=\"ritual-open\"\u003e\n    \u003cdiv class=\"kamon\" aria-hidden=\"true\"\u003e\n      \u003cdiv class=\"kamon-inner\"\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n    \u003ch1 class=\"brand-name\"\u003eRyūmon\u003c\/h1\u003e\n    \u003cp class=\"brand-tagline\"\u003eSacred Keyboard Ribbons  ·  Limited Edition\u003c\/p\u003e\n    \u003cdiv class=\"gold-rule\" aria-hidden=\"true\"\u003e\u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ MANIFESTO ══ --\u003e\n  \u003csection class=\"manifesto\"\u003e\n    \u003cspan class=\"section-eyebrow reveal visible\"\u003eThe Craft\u003c\/span\u003e\n    \u003cp class=\"manifesto-text reveal reveal-delay-1 visible\"\u003e\n      Every keystroke deserves a ceremony.\u003cbr\u003e\n      Every desk, an altar.\n    \u003c\/p\u003e\n    \u003cp class=\"manifesto-body reveal reveal-delay-2 visible\"\u003e\n      Born from the tradition of Japanese washi fabric art, each Ryūmon ribbon is \n      hand-finished with a single strip of pattern silk, crystal charms, and a silk tassel \n      dyed in the spirit of its namesake. These are not accessories. They are invocations — \n      placed once, felt always.\n    \u003c\/p\u003e\n  \u003c\/section\u003e\n\n  \u003cdiv class=\"horizon\" aria-hidden=\"true\"\u003e\n    \u003cdiv class=\"horizon-line\"\u003e\u003c\/div\u003e\n    \u003cspan class=\"horizon-glyph\"\u003e龍\u003c\/span\u003e\n    \u003cdiv class=\"horizon-line\"\u003e\u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ══ CHAPTER I — UMIGAMI ══ --\u003e\n  \u003csection class=\"chapter chapter--teal\"\u003e\n    \u003cdiv class=\"chapter-image\"\u003e\n      \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPTImageJun19_2026_08_37_59AM.png?v=1781843824\" alt=\"Umigami — the Ocean Spirit keyboard ribbon in teal waves silk with crystal charms and blue-pink tassel\" loading=\"lazy\"\u003e\n      \u003cdiv class=\"chapter-image-overlay\"\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"chapter-text\"\u003e\n      \u003cspan class=\"spirit-number reveal visible\"\u003eChapter I\u003c\/span\u003e\n      \u003ch2 class=\"spirit-name reveal reveal-delay-1 visible\"\u003eUmigami\u003c\/h2\u003e\n      \u003cp class=\"spirit-subtitle reveal reveal-delay-2 visible\"\u003eSpirit of the Endless Sea\u003c\/p\u003e\n\n      \u003cp class=\"spirit-lore reveal reveal-delay-3 visible\"\u003e\n        In old Japanese myth, Umigami — the ocean god — does not roar. It breathes. \n        Its breath becomes the wave, the wave becomes the shore. This ribbon carries \n        its pattern: Nami-style silk, gold-threaded crests, and a gradient tassel \n        that fades from the cold depth of the sea to the warmth of coral. The crystal \n        charm ring catches light the way still water catches the sky.\n      \u003c\/p\u003e\n\n      \u003cdiv class=\"spirit-details reveal reveal-delay-3 visible\"\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eFabric\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eNami wave silk — teal \u0026amp; white\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eCharm\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eIridescent crystal ring\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eTassel\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eOmbré silk — ocean to coral\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eMount\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eWhite leather double-stud\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003ca href=\"#\" class=\"cta-btn reveal reveal-delay-4 visible\"\u003e\n        \u003cspan\u003eClaim Umigami\u003c\/span\u003e\n        \u003cspan class=\"btn-arrow\"\u003e→\u003c\/span\u003e\n      \u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ CHAPTER II — KASAI ══ --\u003e\n  \u003csection class=\"chapter chapter--crimson\"\u003e\n    \u003cdiv class=\"chapter-image\"\u003e\n      \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_19_2026_10_33_49_AM.png?v=1781844628\" alt=\"Kasai — the Fire Spirit keyboard ribbon in crimson and black cloud silk with red jade bi disc and crimson tassel\" loading=\"lazy\"\u003e\n      \u003cdiv class=\"chapter-image-overlay\"\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"chapter-text\"\u003e\n      \u003cspan class=\"spirit-number reveal visible\"\u003eChapter II\u003c\/span\u003e\n      \u003ch2 class=\"spirit-name reveal reveal-delay-1 visible\"\u003eKasai\u003c\/h2\u003e\n      \u003cp class=\"spirit-subtitle reveal reveal-delay-2 visible\"\u003eSovereign of Sacred Fire\u003c\/p\u003e\n\n      \u003cp class=\"spirit-lore reveal reveal-delay-3 visible\"\u003e\n        Kasai does not destroy. It purifies. The crimson spiral silk pattern echoes \n        the thunder-cloud motifs of Heian-era battle banners — fire that carries \n        intention. Its jade bi disc pendant is carved with the spiral of eternity, \n        and the crimson tassel hangs like a declaration: \n        \u003cem\u003eI am the one at this keyboard, and I am awake.\u003c\/em\u003e\n      \u003c\/p\u003e\n\n      \u003cdiv class=\"spirit-details reveal reveal-delay-3 visible\"\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eFabric\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eThunder cloud silk — crimson \u0026amp; black\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eCharm\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eCarved jade bi disc — fire motif\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eTassel\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003ePure crimson silk\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eMount\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eWhite leather double-stud\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003ca href=\"#\" class=\"cta-btn reveal reveal-delay-4 visible\"\u003e\n        \u003cspan\u003eClaim Kasai\u003c\/span\u003e\n        \u003cspan class=\"btn-arrow\"\u003e→\u003c\/span\u003e\n      \u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ CHAPTER III — RYŪJIN ══ --\u003e\n  \u003csection class=\"chapter chapter--shadow\"\u003e\n    \u003cdiv class=\"chapter-image\"\u003e\n      \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_19_2026_10_49_52_AM.png?v=1781845504\" alt=\"Ryūjin — the Dragon God keyboard ribbon in black and gold cloud silk with silver dragon charm and obsidian tassel\" loading=\"lazy\"\u003e\n      \u003cdiv class=\"chapter-image-overlay\"\u003e\u003c\/div\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"chapter-text\"\u003e\n      \u003cspan class=\"spirit-number reveal visible\"\u003eChapter III\u003c\/span\u003e\n      \u003ch2 class=\"spirit-name reveal reveal-delay-1 visible\"\u003eRyūjin\u003c\/h2\u003e\n      \u003cp class=\"spirit-subtitle reveal reveal-delay-2 visible\"\u003eDragon God of the Deep\u003c\/p\u003e\n\n      \u003cp class=\"spirit-lore reveal reveal-delay-3 visible\"\u003e\n        Ryūjin rules from the palace beneath the sea, where silence has weight \n        and gold runs in the dark like veins of lightning. This ribbon is made \n        for those who do not need to be seen to be powerful. Black silk laced \n        with gold ink — a pattern that moves with you. Its silver dragon pendant \n        coils around the charm ring with jaw open, tail curled: sovereign, still, \n        absolute.\n      \u003c\/p\u003e\n\n      \u003cdiv class=\"spirit-details reveal reveal-delay-3 visible\"\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eFabric\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eKujira silk — black \u0026amp; gilded\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eCharm\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eSterling silver dragon pendant\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eTassel\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eObsidian black silk\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"detail-item\"\u003e\n          \u003cspan class=\"detail-label\"\u003eMount\u003c\/span\u003e\n          \u003cspan class=\"detail-value\"\u003eIvory leather double-stud\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003ca href=\"#\" class=\"cta-btn reveal reveal-delay-4 visible\"\u003e\n        \u003cspan\u003eClaim Ryūjin\u003c\/span\u003e\n        \u003cspan class=\"btn-arrow\"\u003e→\u003c\/span\u003e\n      \u003c\/a\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ CRAFT PILLARS ══ --\u003e\n  \u003csection class=\"craft\"\u003e\n    \u003cdiv class=\"craft-header\"\u003e\n      \u003cspan class=\"section-eyebrow reveal visible\"\u003eWhy Ryūmon\u003c\/span\u003e\n      \u003ch2 class=\"section-title reveal reveal-delay-1 visible\"\u003e\n        The details that\u003cbr\u003emake the difference\n      \u003c\/h2\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"craft-pillars\"\u003e\n      \u003cdiv class=\"pillar reveal visible\"\u003e\n        \u003cdiv class=\"pillar-icon\" aria-hidden=\"true\"\u003e\n          \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M12 2l2.5 7.5H22l-6.5 4.5 2.5 7.5L12 17l-6 4.5 2.5-7.5L3 9.5h7.5z\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n        \u003c\/div\u003e\n        \u003ch3 class=\"pillar-title\"\u003eHand-Finished\u003c\/h3\u003e\n        \u003cp class=\"pillar-text\"\u003e\n          Each ribbon is assembled individually — no production lines, no shortcuts. \n          The tassel is tied, the charm is hung, and the stud is set by hand, one at a time.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"pillar reveal reveal-delay-1 visible\"\u003e\n        \u003cdiv class=\"pillar-icon\" aria-hidden=\"true\"\u003e\n          \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zM9 9h6M9 12h6M9 15h4\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n        \u003c\/div\u003e\n        \u003ch3 class=\"pillar-title\"\u003eMyth-Sourced Design\u003c\/h3\u003e\n        \u003cp class=\"pillar-text\"\u003e\n          Every pattern draws from classical Japanese textile traditions — \n          nami waves, kumo clouds, and kinrande brocade — \n          updated for the modern mechanical keyboard desk.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"pillar reveal reveal-delay-2 visible\"\u003e\n        \u003cdiv class=\"pillar-icon\" aria-hidden=\"true\"\u003e\n          \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M5 12h14M12 5l7 7-7 7\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n        \u003c\/div\u003e\n        \u003ch3 class=\"pillar-title\"\u003eShips Worldwide — Free\u003c\/h3\u003e\n        \u003cp class=\"pillar-text\"\u003e\n          Every order ships free, worldwide, in protective packaging. \n          Each ribbon arrives in a black envelope with a wax seal \n          and a hand-signed origin card.\n        \u003c\/p\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003cdiv class=\"horizon\" aria-hidden=\"true\"\u003e\n    \u003cdiv class=\"horizon-line\"\u003e\u003c\/div\u003e\n    \u003cspan class=\"horizon-glyph\"\u003e波\u003c\/span\u003e\n    \u003cdiv class=\"horizon-line\"\u003e\u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003c!-- ══ TRIO GALLERY ══ --\u003e\n  \u003csection class=\"trio\"\u003e\n    \u003cdiv class=\"trio-header\"\u003e\n      \u003cspan class=\"section-eyebrow reveal visible\"\u003eThe Three Spirits\u003c\/span\u003e\n      \u003ch2 class=\"section-title reveal reveal-delay-1 visible\"\u003eChoose your invocation\u003c\/h2\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"trio-grid reveal reveal-delay-2 visible\"\u003e\n      \u003cdiv class=\"trio-card\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_19_2026_10_49_42_AM.png?v=1781845505\" alt=\"Umigami — teal wave ribbon\" loading=\"lazy\"\u003e\n        \u003cdiv class=\"trio-card-caption\"\u003e\n          \u003cspan class=\"trio-card-name\"\u003eUmigami\u003c\/span\u003e\n          \u003cspan class=\"trio-card-sub\"\u003eOcean Spirit\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"trio-card\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_19_2026_10_35_09_AM.png?v=1781844628\" alt=\"Kasai — crimson fire ribbon\" loading=\"lazy\"\u003e\n        \u003cdiv class=\"trio-card-caption\"\u003e\n          \u003cspan class=\"trio-card-name\"\u003eKasai\u003c\/span\u003e\n          \u003cspan class=\"trio-card-sub\"\u003eFire Sovereign\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"trio-card\"\u003e\n        \u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPT_Image_Jun_19_2026_11_04_21_AM.png?v=1781846375\" alt=\"Ryūjin — obsidian dragon ribbon\" loading=\"lazy\"\u003e\n        \u003cdiv class=\"trio-card-caption\"\u003e\n          \u003cspan class=\"trio-card-name\"\u003eRyūjin\u003c\/span\u003e\n          \u003cspan class=\"trio-card-sub\"\u003eDragon God\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ PROMISE ══ --\u003e\n  \u003csection class=\"promise\"\u003e\n    \u003cdiv class=\"promise-inner\"\u003e\n      \u003cspan class=\"section-eyebrow reveal visible\"\u003eThe Ryūmon Promise\u003c\/span\u003e\n      \u003cp class=\"promise-quote reveal reveal-delay-1 visible\"\u003e\n        \"An object you reach for a hundred times a day \n        should feel like it was made for you alone.\"\n      \u003c\/p\u003e\n      \u003cp class=\"manifesto-body reveal reveal-delay-2 visible\"\u003e\n        These ribbons are made in limited runs. When a spirit sells out, \n        it does not return until the next season's crafting cycle. \n        Each one you own is one fewer left in the world.\n      \u003c\/p\u003e\n\n      \u003cdiv class=\"promise-badges reveal reveal-delay-3 visible\"\u003e\n        \u003cdiv class=\"badge\"\u003e\n          \u003cdiv class=\"badge-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003cspan class=\"badge-label\"\u003eHand-Finished\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"badge\"\u003e\n          \u003cdiv class=\"badge-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\"\u003e\u003ccircle cx=\"12\" cy=\"12\" r=\"10\"\u003e\u003c\/circle\u003e\u003cpath d=\"M12 8v4l3 3\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003cspan class=\"badge-label\"\u003eLimited Edition\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"badge\"\u003e\n          \u003cdiv class=\"badge-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z\"\u003e\u003c\/path\u003e\u003ccircle cx=\"12\" cy=\"10\" r=\"3\"\u003e\u003c\/circle\u003e\u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003cspan class=\"badge-label\"\u003eShips Worldwide\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"badge\"\u003e\n          \u003cdiv class=\"badge-icon\" aria-hidden=\"true\"\u003e\n            \u003csvg viewbox=\"0 0 24 24\"\u003e\u003cpath d=\"M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z\"\u003e\u003c\/path\u003e\u003c\/svg\u003e\n          \u003c\/div\u003e\n          \u003cspan class=\"badge-label\"\u003eMade With Care\u003c\/span\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n    \u003c\/div\u003e\n  \u003c\/section\u003e\n\n  \u003c!-- ══ CLOSING ══ --\u003e\n  \u003csection class=\"manifesto\" style=\"padding-bottom: 10rem;\"\u003e\n    \u003cspan class=\"section-eyebrow reveal visible\"\u003eUntil we meet again\u003c\/span\u003e\n    \u003cp class=\"manifesto-text reveal reveal-delay-1 visible\"\u003e\n      The keyboard is the instrument.\u003cbr\u003e\n      The ribbon is the soul.\n    \u003c\/p\u003e\n    \u003cdiv class=\"horizon-line\" style=\"width:1px; height:80px; margin:0 auto; background: linear-gradient(to bottom, var(--gold), transparent);\"\u003e\u003c\/div\u003e\n    \u003cp style=\"margin-top:2rem; font-family:'Cormorant Garamond',serif; font-size:2rem; color:var(--gold); opacity:0.5; letter-spacing:0.3em;\" class=\"reveal reveal-delay-2 visible\"\u003e龍門\u003c\/p\u003e\n  \u003c\/section\u003e\n\u003c\/div\u003e\n\n\u003cscript\u003e\n  const reveals = document.querySelectorAll('.ryumon-wrapper .reveal');\n  const io = new IntersectionObserver((entries) =\u003e {\n    entries.forEach(e =\u003e {\n      if (e.isIntersecting) {\n        e.target.classList.add('visible');\n        io.unobserve(e.target);\n      }\n    });\n  }, { threshold: 0.12, rootMargin: '0px 0px -40px 0px' });\n  reveals.forEach(el =\u003e io.observe(el));\n\u003c\/script\u003e","brand":"ZayDen","offers":[{"title":"Umigami","offer_id":47935743754391,"sku":null,"price":34.0,"currency_code":"USD","in_stock":true},{"title":"Kasai","offer_id":47935743787159,"sku":null,"price":34.0,"currency_code":"USD","in_stock":true},{"title":"Ryūjin","offer_id":47935743819927,"sku":null,"price":34.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/files\/ChatGPTImageJun19_2026_08_34_28AM.png?v=1781844392"}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0719\/2448\/2199\/collections\/ChatGPT_Image_Jun_15_2026_11_09_29_PM.png?v=1781544569","url":"https:\/\/www.zayden.store\/de\/collections\/zayden-accessory.oembed","provider":"ZayDen","version":"1.0","type":"link"}