/* Cinematic storefront tone, using Blendini's own artwork and footage. */
:root{--gold:#e2a536;--ink:#121212;--panel:#1c1c1c;--muted:#b2b2b2}
body{background:var(--ink);color:#f4f4f4;font-family:Arial,sans-serif}header{background:#080808;border-bottom:1px solid #292929;height:80px;padding:0 4%;gap:24px}.brand{font-size:29px;letter-spacing:-1px;color:#fff}nav{font-size:13px;gap:23px;text-transform:uppercase}.nav-support{color:#151515;background:var(--gold);border-radius:3px;padding:9px 15px}.language-picker select{background:#202020;border-color:#414141;color:#eee}.language-picker{color:#bbb}a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible{outline-color:var(--gold)}
.hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:620px;padding:72px 7%;background:radial-gradient(ellipse at 78% 48%,#414247 0%,#232428 34%,#0c0c0e 73%)}.hero-copy{position:relative;z-index:2;width:52%;max-width:690px}.hero .eyebrow{color:var(--gold);font-size:13px;letter-spacing:1.3px}.hero h1{font-size:clamp(44px,5vw,72px);line-height:1.1;letter-spacing:-1.6px}.hero h1 span{color:#fff}.hero .lead{font-size:22px;color:#eee}.hero .intro{color:#bdbdc3;max-width:510px}.hero .fine{color:#a5a5aa}.hero-art{position:absolute;width:51%;right:1%;top:50%;transform:translateY(-50%);z-index:0;pointer-events:none}.hero-art:before{inset:12%;background:radial-gradient(ellipse,#428dcd26,transparent 70%)}.hero-art>img{width:100%;margin:0;animation:none;filter:drop-shadow(0 22px 25px #0008)}.vertical,.art-label{display:none}.button{border-radius:3px;padding:13px 24px;font-weight:700;letter-spacing:.1px}.primary,.light,.dark{background:var(--gold);color:#141414}.primary:hover,.light:hover,.dark:hover{background:#f1b64b}.outline{border-color:#686868;color:#f7f7f7;background:#1114}.outline:hover{background:#ffffff10}.ticker{background:#050505;padding:22px 5%;border-bottom:1px solid #282828;color:#bbb;letter-spacing:1px}.ticker b{color:var(--gold)}
.category-strip{display:flex;justify-content:center;gap:12px;padding:27px 5% 0;flex-wrap:wrap}.category-strip a{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#ccc;border:1px solid #3a3a3a;padding:8px 24px;border-radius:25px}.category-strip a:hover{color:var(--gold);border-color:var(--gold)}
.section{max-width:1400px;padding:78px 5%}.section-head{max-width:850px;text-align:center;margin:0 auto 40px}.eyebrow{color:var(--gold);letter-spacing:1.8px;font-size:11px}h2{font-size:clamp(34px,3.5vw,50px);letter-spacing:-1px;font-weight:800}h3{font-size:23px;letter-spacing:-.3px;line-height:1.35}.section-head p:last-child{color:var(--muted);font-size:16px}.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.feature,.main-feature{background:transparent;border-radius:0;padding:0 0 20px;min-height:0}.feature-image{width:100%;height:210px;object-fit:cover;border-radius:5px;display:block;margin-bottom:21px;background:#080808}.feature .index{font-size:11px;color:var(--gold)}.feature h3{margin:10px 0 12px;font-size:25px}.feature h3 br{display:none}.feature p{font-size:14px;color:#b8b8b8}.feature .small{color:#929292}.switch-demo{margin:20px 0 7px}.switch-demo button{background:var(--gold)}.switch-demo [aria-checked=false]{background:#555}.switch-demo i{background:#fff}.keys,.key-line{margin-top:20px}.key-line span,.keys span{color:#bbb}kbd{background:#282828;border-color:#4d4d4d;color:#eee;padding:6px 11px}.tags{margin-top:20px}.tags span{background:#272727;color:#ddd;border:1px solid #353535}.feature:hover .feature-image{outline:1px solid #9b7137}
.demo-strip{background:#080808;border-top:1px solid #292929;border-bottom:1px solid #292929;grid-template-columns:1fr 1fr;gap:60px;padding:65px 8%}.demo-strip .eyebrow{color:var(--gold)}.demo-strip p{color:#bbb}.demo-poster{width:100%;max-width:470px;aspect-ratio:16/10;transform:none;box-shadow:none;overflow:hidden;border:1px solid #333;border-radius:4px}.demo-poster img{width:100%;height:100%;object-fit:cover}.play{left:calc(50% - 35px);top:calc(50% - 35px);background:var(--gold);color:#171717}.release{gap:70px}.release p{color:#bbb}.release-card{background:#1c1c1c;border:1px solid #3b3429;border-radius:5px;box-shadow:none}.pill{background:#392d17;color:#efb749;font-size:11px}.small,.fine{color:#a7a7a7}.testers{background:#202020;border-top:1px solid #333;border-bottom:1px solid #333;gap:80px;padding:65px 9%}.number{color:var(--gold);font-size:140px}.number span{color:#b5b5b5;font-size:11px}.testers p{color:#ccc}.testers .eyebrow{color:var(--gold)}.testers .small{color:#a7a7a7}
.learn-grid{gap:26px}.learn-card,.learn-card.blue{border:0;background:transparent;padding:0 0 20px;color:#eee}.learn-image{display:block;width:100%;height:200px;object-fit:cover;background:#080808;margin-bottom:20px;border-radius:4px}.learn-card .label{color:var(--gold);font-size:10px}.learn-card h3{margin:10px 0 12px}.learn-card p,.blue p{color:#aaa;font-size:14px}.learn-card:hover h3{color:var(--gold)}.text-link,.blue .text-link{color:var(--gold);font-size:13px;margin-top:18px}.tools{padding-top:35px;gap:85px}.tools p{color:#aaa}.roadmap>div{border-color:#333}.roadmap span{color:var(--gold)}.roadmap small{color:#aaa}.about{background:#080808;border-block:1px solid #2a2a2a;text-align:center}.about .section{max-width:990px}.about .eyebrow{color:var(--gold)}.about p{color:#bbb}.about .actions{justify-content:center}.about .small{margin:20px auto 0;color:#929292}.faq{max-width:1080px}.faq h2{text-align:center;margin-bottom:35px}details{border-color:#353535}details p{color:#aaa}summary{font-size:16px}footer{background:#080808;border-top:1px solid #292929;color:#ddd}footer p,footer small{color:#929292}footer a:hover{color:var(--gold)}dialog{background:#171717;border:1px solid #414141}.skip{background:#111;color:white}html:not([lang=en]) .hero h1{font-size:clamp(38px,4.6vw,64px)}
@media(max-width:1050px){header{padding:0 3%;gap:10px}nav{gap:12px;font-size:12px}.hero-copy{width:56%}.hero{min-height:570px;padding:55px 5%}.hero-art{width:49%;right:-2%}.feature-image{height:175px}.hero .lead{font-size:19px}.demo-strip{padding:50px 6%;gap:35px}}
@media(max-width:800px){header nav{display:none;position:absolute;top:80px;left:0;right:0;background:#141414;padding:25px;flex-direction:column;align-items:flex-start;border-bottom:1px solid #444;font-size:14px}header nav.open{display:flex}#menu{display:block;background:#282828;color:#eee;border:1px solid #4a4a4a;border-radius:3px;padding:7px 12px}.language-picker{margin-left:auto;margin-right:4px}.feature-grid{grid-template-columns:1fr}.feature{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.feature-image{grid-row:span 8;height:100%;min-height:240px}.feature h3{font-size:24px}.hero{min-height:580px}.hero-copy{width:65%}.hero-art{width:48%;right:-10%;opacity:.6}.learn-image{height:150px}.testers{gap:35px}}
@media(max-width:600px){header{height:72px}header nav{top:72px}.brand{font-size:24px}.brand img{width:34px;height:34px}.hero{display:block;padding:42px 7% 30px;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 55% 73%,#303136,#0c0c0e 70%)}.hero-copy{width:100%;max-width:none}.hero h1,html:not([lang=en]) .hero h1{font-size:43px;line-height:1.18}.hero .lead{font-size:19px}.hero .intro{font-size:14px;max-width:100%}.hero-art{position:relative;width:85%;max-width:360px;top:auto;right:auto;transform:none;margin:20px auto 0;opacity:1}.hero .actions{flex-direction:row;align-items:stretch}.hero .button{font-size:13px;padding:12px 16px}.hero .eyebrow{font-size:10px}.ticker{gap:10px;padding:18px 10px}.category-strip{gap:8px;padding-top:20px}.category-strip a{font-size:10px;padding:6px 13px}.section{padding:58px 7%}.feature{display:block}.feature-image{height:220px;min-height:0}.feature-grid{gap:24px}.feature h3{font-size:24px}.demo-strip{grid-template-columns:1fr;padding:48px 7%}.demo-poster{max-width:none;aspect-ratio:16/10}.release,.tools{grid-template-columns:1fr;gap:28px}.testers{grid-template-columns:1fr;gap:28px;padding:48px 7%}.number{font-size:100px}.learn-grid{grid-template-columns:1fr}.learn-image{height:220px}.learn-card{padding-bottom:10px}.about .section{padding:58px 7%}.faq h2{text-align:left}footer{padding:35px 7%;gap:18px}.tools{padding-top:10px}h2{font-size:34px}}
.feature h3 br{display:block}

/* Restore the mascot's gentle floating motion. */
.hero-art>img{animation:blendini-float 7s ease-in-out infinite;will-change:transform}
.hero-art::after{content:"";position:absolute;z-index:-1;left:22%;right:16%;bottom:-2%;height:6%;border-radius:50%;background:radial-gradient(ellipse,#0007,transparent 70%);animation:blendini-shadow 7s ease-in-out infinite}
@keyframes blendini-float{0%,100%{transform:translateY(8px) rotate(-1deg)}50%{transform:translateY(-18px) rotate(2deg)}}
@keyframes blendini-shadow{0%,100%{transform:scaleX(1);opacity:.65}50%{transform:scaleX(.85);opacity:.35}}
html[lang=ko] .hero h1{font-size:clamp(35px,3.7vw,57px);line-height:1.25}
html[lang=ja] .hero h1{font-size:clamp(34px,3.7vw,56px)}
@media(max-width:600px){html[lang=ko] .hero h1,html[lang=ja] .hero h1{font-size:clamp(27px,7.2vw,40px)}}
@media(prefers-reduced-motion:reduce){.hero-art>img,.hero-art::after{animation:none!important;will-change:auto}}