/* Flowrage's artwork leads the brand; the workflow below demonstrates it. */
.hero{grid-template-columns:minmax(0,.88fr) minmax(0,1.35fr);align-items:center;gap:36px;padding-top:48px;padding-bottom:42px}
.hero-copy{padding:8px 0 20px;max-width:500px}
.hero .eyebrow{font-size:9px;letter-spacing:.07em;line-height:1.8}
.hero h1{font-size:clamp(52px,5.05vw,74px);line-height:1.01;letter-spacing:-.055em;margin:26px 0 25px}
.hero .hero-description{font-size:19px;line-height:1.5;letter-spacing:-.015em;color:#5c6b5c;margin:0 0 19px}
.hero .hero-description strong{color:#273d2e;font-weight:550}
.hero .hero-detail{font-size:14px;line-height:1.8;color:#647260;max-width:360px;margin:0 0 27px}
.hero .actions{gap:24px}.hero .button{background:#c9582d;color:#fff9ec;padding:14px 20px;font-size:12px;min-height:48px}.hero .button:hover{background:#a94120}.hero .text-link{font-size:11px}
.flow-art{min-width:0;margin:0;background:#f0e8da;border:1px solid #e0d6c5;align-self:center;box-shadow:0 22px 45px -35px #43381e66}
.flow-art-stage{overflow:hidden;aspect-ratio:3/2;background:#e8ddcd}
.flow-sculpture{display:block;width:100%;height:auto;animation:art-arrive .85s ease-out both;transform-origin:55% 60%}
.flow-art figcaption{padding:22px 25px 17px;background:#f4eee2;border-top:1px solid #ddcfbb}
.art-message{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:19px}
.art-message strong{font-size:22px;line-height:1.15;letter-spacing:-.035em;font-weight:500;color:#273c2c}
.art-message p{font-size:11px;line-height:1.75;margin:0;color:#6c705d}
.art-key{list-style:none;padding:15px 0 0;margin:0;border-top:1px solid #d9d1bf;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.art-key li{font:9px/1.6 ui-monospace,SFMono-Regular,monospace;color:#5e6856;display:flex;align-items:center;gap:7px}
.art-key li:before{content:"";display:block;width:6px;height:6px;background:var(--key-color)}
.key-ai{--key-color:#234cad}.key-rules{--key-color:#b48114}.key-people{--key-color:#77509d}.key-systems{--key-color:#365442}
.hero-bottom{margin-top:0;padding:25px 0 30px;border-top:1px solid #d8ddd2;border-bottom:0}
.workflow-proof{padding:65px 0;background:#edeee4;border-top:1px solid #d8ddd2;border-bottom:1px solid #d8ddd2}
@keyframes art-arrive{from{opacity:.2;transform:translateY(12px) scale(1.015)}to{opacity:1;transform:none}}
@media(min-width:901px) and (max-width:1100px){.hero{gap:26px;grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr)}.hero h1{font-size:53px}.hero .hero-description{font-size:17px}.hero .hero-detail{font-size:13px}.hero .eyebrow{font-size:8px}.hero .actions{gap:14px}.hero .button{font-size:11px;padding:13px 16px}.art-message{gap:15px}.art-message strong{font-size:20px}.art-message p{font-size:10px}.flow-art figcaption{padding:19px}.art-key{gap:9px}.art-key li{font-size:8px}}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:32px;padding-top:39px}.hero-copy{max-width:650px;padding:0}.hero h1{font-size:68px;line-height:1.02;margin-top:20px}.hero h1 br:nth-of-type(2){display:none}.hero h1 span:before{content:" "}.hero .hero-description{font-size:20px}.hero .hero-detail{max-width:510px;font-size:14px}.flow-art{width:100%}.flow-art figcaption{padding:24px}.art-message strong{font-size:25px}.art-message p{font-size:12px}.art-key li{font-size:10px}.workflow-proof{padding:45px 0}}
@media(max-width:760px){.hero{gap:29px;padding-top:35px;padding-bottom:30px}.hero .eyebrow{font-size:8px;letter-spacing:.04em}.hero h1{font-size:clamp(43px,10.7vw,67px);margin:22px 0;line-height:1.04}.hero h1 br:nth-of-type(2){display:block}.hero h1 span:before{content:none}.hero .hero-description{font-size:18px;line-height:1.55}.hero .hero-detail{font-size:14px;line-height:1.75;margin-bottom:24px}.hero .actions{gap:19px}.hero .button{font-size:11px;padding:13px 17px}.hero .text-link{font-size:11px}.flow-art figcaption{padding:19px 16px 16px}.art-message{align-items:start;gap:14px;margin-bottom:16px}.art-message strong{font-size:20px;flex:1}.art-message p{font-size:10px;flex:1;line-height:1.65}.art-message p br{display:none}.art-key{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;padding-top:14px}.art-key li{font-size:9px}.hero-bottom{padding:21px 0 25px}.workflow-proof{padding:35px 0}}
@media(prefers-reduced-motion:reduce){.flow-sculpture{animation:none}}

@media(max-width:760px){.hero{gap:22px}.hero-copy{display:contents}.hero .eyebrow{order:0}.hero h1{order:1;margin:0}.flow-art{order:2;margin-top:2px}.hero .hero-description{order:3;margin:3px 0 0}.hero .hero-detail{order:4;margin:0}.hero .actions{order:5}}