.hero-art>img[src*="stable-diffusion-webui"]{border:1px solid rgba(86,229,255,.32);border-radius:18px;box-shadow:0 0 0 8px rgba(17,21,40,.88),0 26px 70px rgba(86,229,255,.18);object-fit:cover}
@media(max-width:639px){.hero-art>img[src*="stable-diffusion-webui"]{width:100%;box-shadow:0 0 0 5px rgba(17,21,40,.88),0 18px 45px rgba(86,229,255,.16)}}

/* Keep the feature screenshots readable while preserving the card rhythm. */
.feature-grid article>img[src*="feature-"]{right:1rem;bottom:1rem;width:calc(100% - 2rem);height:auto;aspect-ratio:2/1;object-fit:cover;opacity:.96;mix-blend-mode:normal;border:1px solid rgba(86,229,255,.3);border-radius:6px;box-shadow:0 14px 32px rgba(0,0,0,.32);transform:rotate(-2deg)}
.feature-grid article:nth-child(2)>img[src*="feature-"]{transform:rotate(2deg)}
.feature-grid article:nth-child(3)>img[src*="feature-"]{transform:rotate(-1deg)}

/* Separate the explanatory copy from the screenshot so neither layer collides. */
.feature-grid article{display:flex;flex-direction:column;align-items:stretch}
.feature-grid article>p{max-width:none;margin-bottom:0;min-height:3.6em}
.feature-grid article>img[src*="feature-"]{position:relative;right:auto;bottom:auto;display:block;width:100%;margin-top:auto;flex:0 0 auto}

.feature-grid article{min-height:430px}
.feature-grid article>img[src*="feature-"]{margin-top:1.25rem;transform:none!important}

/* A WebUI-inspired download control: dark panel, spectrum edge and a clear action hierarchy. */
.primary-btn{position:relative;isolation:isolate;clip-path:none;overflow:hidden;min-height:3.75rem;padding:.5rem .95rem .5rem .6rem;gap:.7rem;color:#f5f7ff;background:linear-gradient(115deg,#11182e 0%,#202852 66%,#161b36 100%) padding-box,conic-gradient(from 210deg,#56e5ff,#70ff9f,#ffe46b,#ff8f5b,#ff6cae,#9e7bff,#56e5ff) border-box;border:1px solid transparent;border-radius:10px;box-shadow:0 0 0 1px rgba(158,123,255,.2),0 12px 28px rgba(0,0,0,.3);transition:transform .2s,box-shadow .2s,filter .2s}
.primary-btn:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 0 72%,rgba(86,229,255,.12) 84%,rgba(255,108,174,.22) 100%);pointer-events:none}
.primary-btn:after{content:"";position:absolute;right:-1.5rem;top:50%;width:4.5rem;height:9rem;transform:translateY(-50%) rotate(28deg);background:linear-gradient(180deg,rgba(86,229,255,.65),rgba(158,123,255,.65),rgba(255,108,174,.65));opacity:.8;filter:blur(14px);z-index:-1;pointer-events:none}
.primary-btn:hover{transform:translateY(-3px);filter:brightness(1.12);box-shadow:0 0 0 1px rgba(86,229,255,.5),0 16px 36px rgba(86,229,255,.2)}
.primary-btn .btn-icon{width:2.45rem;height:2.45rem;flex:0 0 auto;padding:.16rem;border-radius:50%;background:conic-gradient(from 210deg,#56e5ff,#70ff9f,#ffe46b,#ff8f5b,#ff6cae,#9e7bff,#56e5ff);box-shadow:0 0 0 2px #0e142b,0 0 18px rgba(86,229,255,.4)}
.primary-btn span{display:grid;gap:.15rem;text-align:left;line-height:1.15}
.primary-btn span strong{font-size:.8rem;line-height:1.15}
.primary-btn span small{font:700 .48rem var(--mono);letter-spacing:.1em;color:#8795c7;line-height:1.1}
.primary-btn span:after{display:none}
.primary-btn b{margin-left:.35rem;color:#56e5ff;font-size:1.25rem;line-height:1}
.download-links .primary-btn{min-width:17rem}
@media(max-width:639px){.download-links .primary-btn{min-width:0}.primary-btn{min-height:3.6rem}}
