/* HashMo Art Canvas product-page preview • Jessica • Oct 24, 2026.
   Scoped under .hac-site, using HashMo's shared palette and navigation.
   Visual artboard is explicitly illustrative; no scripted email collection. */
.hac-site{--hac-ink:#f7f3ff;--hac-muted:#b5accd;--hac-line:rgba(174,152,241,.2);--hac-panel:rgba(15,17,34,.82);--hac-glow:#b58cff;--hac-aqua:#73eff0;color:var(--hac-ink);background:radial-gradient(ellipse at 81% 8%,rgba(129,75,225,.2),transparent 40%),radial-gradient(ellipse at 9% 43%,rgba(24,163,171,.09),transparent 33%),#070910}
.hac-site .shell.hac-shell{width:min(1500px,calc(100% - clamp(28px,6vw,100px)));display:grid;grid-template-rows:auto 1fr auto;gap:28px}
.hac-site .topbar{margin-bottom:7px}
.hac-site .topbar .brand-logo.hashmo-brand-logo{display:block;width:clamp(58px,6vw,77px);height:auto}
.hac-site .topbar .brand-copy{min-width:0}
.hac-site .topbar .brand-name{font-size:17px;line-height:1.1}
.hac-site .topbar .brand-sub{letter-spacing:.09em}
.hac-site .site-nav{max-width:970px}
.hac-site .nav-link:focus-visible,.hac-site a:focus-visible,.hac-site button:focus-visible{outline:3px solid #a8f2f7;outline-offset:3px}
.hac-content{display:grid;gap:clamp(55px,7vw,100px);padding-bottom:40px}
.hac-hero{display:grid;grid-template-columns:minmax(300px,.87fr) minmax(450px,1.13fr);align-items:center;gap:clamp(26px,4.5vw,75px);padding:43px 0 5px}
.hac-hero-copy{position:relative;z-index:1;max-width:625px}
.hac-kicker,.hac-overline{display:inline-flex;align-items:center;gap:10px;color:#c8b0f9;font-size:11px;line-height:1.5;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.hac-kicker-dot{width:9px;height:9px;flex:0 0 auto;border-radius:100%;background:var(--hac-aqua);box-shadow:0 0 15px rgba(115,239,240,.65)}
.hac-slash{color:var(--hac-aqua);font-weight:700}
.hac-mark{width:clamp(80px,8vw,114px);height:auto;display:block;margin:24px 0 20px;object-fit:contain;filter:drop-shadow(0 12px 22px rgba(133,82,219,.3))}
.hac-hero h1{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(50px,6.5vw,104px);letter-spacing:-.07em;line-height:.94;max-width:none;overflow-wrap:normal}
.hac-gradient{color:transparent;background:linear-gradient(103deg,#ffe7b0,#dab9ff 40%,#83f2ee);background-clip:text;-webkit-background-clip:text}
.hac-lead{font-size:clamp(16px,1.45vw,20px);color:#c3bbd4;line-height:1.72;max-width:610px;margin:28px 0 15px}
.hac-mission{font-size:12px;letter-spacing:.055em;color:#d0c0ea;line-height:1.6}
.hac-mission strong{color:#ecdcff}
.hac-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:29px}
.hac-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:53px;padding:0 21px;font-size:14px;font-weight:750;text-decoration:none;border:1px solid var(--hac-line);border-radius:13px;transition:transform .17s ease,border-color .17s ease,box-shadow .17s ease}
.hac-button:hover{transform:translateY(-2px)}
.hac-button-primary{background:linear-gradient(120deg,#8953ef,#ac78ec 54%,#507fd4);color:#fff;border-color:rgba(197,163,251,.45);box-shadow:0 14px 33px rgba(130,81,218,.2)}
.hac-button-ghost{background:rgba(29,26,54,.62);color:#eee5ff}
.hac-trust{padding:0;margin:24px 0 0;list-style:none;display:flex;flex-wrap:wrap;gap:9px 17px;color:#b8afc9;font-size:12px;line-height:1.4}
.hac-trust li:before{content:"✓";color:#8bf3e8;font-weight:900;margin-right:7px}
.hac-art-wrap{min-width:0}
.hac-preview{border:1px solid rgba(189,162,248,.29);border-radius:22px;background:linear-gradient(155deg,rgba(33,26,58,.94),rgba(11,16,31,.99));overflow:hidden;box-shadow:0 28px 86px rgba(0,0,0,.47),0 0 85px rgba(131,78,210,.1)}
.hac-preview-title{min-height:65px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 19px;background:rgba(13,17,32,.72);border-bottom:1px solid var(--hac-line)}
.hac-preview-logo{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',system-ui,sans-serif;font-weight:800;font-size:15px;letter-spacing:.02em}
.hac-preview-logo img{object-fit:contain}
.hac-preview-dots{display:flex;gap:7px}.hac-preview-dots i{width:7px;height:7px;border-radius:50%;background:#846e9d}.hac-preview-dots i:nth-child(2){background:#a084a4}.hac-preview-dots i:nth-child(3){background:#7be9d4}
.hac-preview-body{display:grid;grid-template-columns:42px minmax(0,1fr) 132px;min-height:405px}
.hac-toolbar{display:flex;flex-direction:column;align-items:center;gap:11px;padding:16px 5px;border-right:1px solid var(--hac-line);background:rgba(11,15,28,.65)}
.hac-tool{display:grid;place-items:center;width:28px;height:29px;border-radius:7px;border:1px solid transparent;color:#afa6c3;font-weight:800}
.hac-tool.active{color:#f0faff;background:rgba(78,175,186,.17);border-color:rgba(118,230,234,.36)}
.hac-canvas-area{display:grid;align-content:center;place-items:center;gap:11px;background:radial-gradient(circle at 42% 30%,rgba(152,117,236,.13),transparent 55%),#101323;padding:17px 11px;min-width:0}
.hac-canvas-surface{width:100%;max-width:500px;aspect-ratio:520/420;display:block;box-shadow:0 12px 35px rgba(0,0,0,.4);background:#1e2140;overflow:hidden}
.hac-art{display:block;width:100%;height:100%}
.hac-artboard-tag{font-size:9px;letter-spacing:.12em;color:#8d84a3;font-weight:850;text-align:center}
.hac-layers{border-left:1px solid var(--hac-line);background:rgba(15,17,32,.95);display:flex;flex-direction:column;padding:15px 8px;gap:7px;min-width:0}
.hac-panel-title{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.16em;font-weight:800;color:#d6c2f4;padding:2px 4px 12px}
.hac-layer{display:flex;align-items:center;gap:7px;padding:10px 6px;background:rgba(26,29,49,.66);border:1px solid rgba(156,134,207,.1);border-radius:8px;color:#adacc4;font-size:10px;min-width:0}
.hac-layer>span:nth-child(2){min-width:0;flex:1;display:grid;gap:4px}
.hac-layer b{color:#eee7fa;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hac-layer small{color:#9590b3;font-size:9px}
.hac-layer.selected{border-color:rgba(131,210,227,.55);background:rgba(45,75,109,.3)}
.hac-layer-dot{width:10px;height:10px;border-radius:3px;flex:0 0 auto}.hac-layer-dot.violet{background:#ba91fc}.hac-layer-dot.teal{background:#65dcdb}.hac-layer-dot.pink{background:#f3a0bf}.hac-layer-dot.blue{background:#739eec}
.hac-panel-note{margin-top:auto;color:#9c90b9;border-top:1px solid var(--hac-line);font-size:9px;line-height:1.5;padding:12px 4px 0}
.hac-preview-footer{padding:12px 17px;min-height:43px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:rgba(13,16,29,.93);border-top:1px solid var(--hac-line);font-size:11px;color:#b3abc9}
.hac-pill{color:#a7f7e9;font-size:9px;letter-spacing:.11em;font-weight:850;white-space:nowrap}
.hac-illustration-note{color:#a8a1c0;font-size:11px;line-height:1.55;margin:13px 3px 0}
.hac-value-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-block:1px solid var(--hac-line);background:linear-gradient(90deg,rgba(64,31,115,.12),rgba(12,81,88,.05));border-radius:7px;padding:24px 10px}
.hac-value-bar span{display:flex;gap:12px;justify-content:center;align-items:center;text-align:center;color:#c9bed7;font-size:12px;line-height:1.4;padding:0 12px;border-right:1px solid var(--hac-line)}
.hac-value-bar span:last-child{border:0}.hac-value-bar strong{font-family:'Space Grotesk',system-ui,sans-serif;color:#8fe4e4;font-size:20px}
.hac-section{display:grid;gap:30px}.hac-section-head{max-width:860px}
.hac-section h2,.hac-development h2,.hac-availability h2,.hac-closing h2{font-family:'Space Grotesk',system-ui,sans-serif;letter-spacing:-.045em;font-size:clamp(32px,4.2vw,62px);line-height:1.09;margin:12px 0 14px}
.hac-section-head p,.hac-use-cases>div:first-child>p,.hac-development p,.hac-availability p,.hac-closing p{color:var(--hac-muted);line-height:1.72;font-size:15px;max-width:760px}
.hac-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.hac-card{display:flex;flex-direction:column;min-height:245px;padding:clamp(20px,2.25vw,29px);border:1px solid var(--hac-line);border-radius:18px;background:linear-gradient(155deg,rgba(34,29,60,.65),rgba(11,18,32,.82));box-shadow:inset 0 1px rgba(255,255,255,.045)}
.hac-card-index{font-size:10px;letter-spacing:.16em;color:#91e1e8;font-weight:800}.hac-card h3{font-family:'Space Grotesk',system-ui,sans-serif;margin:22px 0 9px;font-size:clamp(19px,2vw,25px);letter-spacing:-.02em;line-height:1.24}.hac-card p{color:#b0abc7;font-size:13px;line-height:1.7;margin:0 0 25px}.hac-card-status{margin-top:auto;font-weight:800;letter-spacing:.07em;font-size:10px;color:#a7e6e0;text-transform:uppercase}.hac-card-status.future{color:#d8b6ff}
.hac-use-cases{border:1px solid rgba(177,151,236,.16);border-radius:24px;background:linear-gradient(130deg,rgba(53,35,92,.25),rgba(9,30,43,.32));padding:clamp(24px,4vw,52px)}
.hac-use-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.hac-use-grid article{padding:22px;border-radius:14px;background:rgba(11,16,33,.72);border:1px solid rgba(163,157,210,.14)}
.hac-use-symbol{font-size:29px;color:#8fecea}.hac-use-grid h3{font-family:'Space Grotesk',system-ui,sans-serif;font-size:20px;margin:14px 0 8px}.hac-use-grid p{color:#b4adc7;font-size:13px;line-height:1.66}
.hac-caution{color:#9d95b7;font-size:11px!important;margin:0;max-width:900px!important}
.hac-development{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(295px,.72fr);gap:42px;align-items:center}
.hac-development-panel{border:1px solid rgba(181,149,241,.32);border-radius:21px;padding:30px;background:radial-gradient(circle at 100% 0%,rgba(145,107,237,.2),transparent 55%),rgba(25,21,45,.8)}
.hac-stage-label{display:block;font-size:10px;letter-spacing:.16em;font-weight:900;color:#99ece7;margin-bottom:13px}.hac-development-panel strong{font-family:'Space Grotesk',system-ui,sans-serif;font-size:27px;line-height:1.2;display:block}.hac-stage-progress{height:7px;border-radius:20px;background:rgba(143,128,193,.22);margin:22px 0;overflow:hidden}.hac-stage-progress span{display:block;width:43%;height:100%;border-radius:20px;background:linear-gradient(90deg,#9c77e8,#65e8e1)}.hac-development-panel p{font-size:12px}.hac-development-panel a,.hac-closing a{color:#afeeee;font-weight:800;text-decoration:none;border-bottom:1px solid rgba(111,220,213,.55);padding-bottom:3px;font-size:13px}
.hac-availability{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.9fr);gap:35px;padding:clamp(25px,4vw,50px);border:1px solid rgba(132,207,211,.22);border-radius:22px;background:linear-gradient(110deg,rgba(37,25,70,.74),rgba(16,42,54,.6))}
.hac-availability h2{margin-top:13px}
.hac-wishlist-closed{align-self:center;padding:27px;border:1px solid rgba(130,220,215,.35);border-radius:15px;background:rgba(6,18,30,.62);box-shadow:0 14px 30px rgba(0,0,0,.15)}
.hac-wishlist-closed:before{content:"●";color:#f2c782;font-size:10px;margin-right:6px}
.hac-wishlist-closed strong{font-family:'Space Grotesk',system-ui,sans-serif;font-size:18px;line-height:1.3}
.hac-wishlist-closed p{font-size:13px;margin:15px 0 0}.hac-wishlist-closed .hac-small{font-size:11px;color:#999eaf}
.hac-closing{text-align:center;padding:45px 20px 26px}.hac-closing img{display:block;margin:auto;max-width:100%;height:auto;filter:drop-shadow(0 14px 35px rgba(151,100,233,.18))}.hac-closing h2{font-size:clamp(32px,4.7vw,62px);margin:28px auto 12px}.hac-closing p{margin:0 auto 25px}
.hac-site .footer{border-top:1px solid var(--hac-line);padding-top:24px}
.hac-site .footer-note a{color:#c8beed}
@media(max-width:1180px){.hac-hero{grid-template-columns:minmax(0,1fr);gap:42px}.hac-hero-copy{max-width:800px}.hac-hero h1{font-size:clamp(60px,9vw,99px)}.hac-art-wrap{max-width:870px;width:100%}.hac-preview-body{grid-template-columns:45px minmax(0,1fr) 148px}.hac-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.hac-site .topbar{grid-template-columns:1fr}.hac-site .site-nav{justify-content:flex-start}.hac-value-bar{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 0}.hac-value-bar span:nth-child(2){border-right:0}.hac-development,.hac-availability{grid-template-columns:1fr}.hac-use-grid{grid-template-columns:1fr}.hac-use-grid article{padding:22px}.hac-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.hac-site .shell.hac-shell{width:calc(100% - 30px)}.hac-content{gap:65px}.hac-hero{padding-top:5px}.hac-hero h1{font-size:clamp(53px,13.5vw,82px)}.hac-mark{width:87px}.hac-kicker{font-size:10px}.hac-actions{display:grid}.hac-button{width:100%}.hac-preview-title{min-height:50px;padding:9px 11px}.hac-preview-body{grid-template-columns:32px minmax(0,1fr) 93px;min-height:auto}.hac-toolbar{gap:5px;padding:9px 1px}.hac-tool{width:25px;height:24px;font-size:12px}.hac-layers{padding:11px 4px;gap:5px}.hac-panel-title{font-size:8px;padding:0 2px 7px}.hac-layer{gap:4px;padding:7px 3px}.hac-layer b{font-size:9px}.hac-layer small{font-size:8px}.hac-layer-dot{width:6px;height:6px}.hac-layer>span:last-child{display:none}.hac-panel-note{font-size:8px}.hac-canvas-area{padding:10px 5px}.hac-artboard-tag{font-size:7px}.hac-preview-logo{font-size:12px}.hac-preview-logo img{width:25px;height:25px}.hac-value-bar{padding:17px 8px}.hac-value-bar span{font-size:11px;padding:0 8px;gap:6px}.hac-value-bar strong{font-size:15px}.hac-card-grid{grid-template-columns:1fr}.hac-card{min-height:0;padding:23px}.hac-use-cases{padding:25px 16px}.hac-availability{padding:25px 19px}.hac-wishlist-closed{padding:22px 18px}.hac-development-panel{padding:25px}.hac-site .footer{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.hac-site *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}