/* MetOrbix 0.5.0 — MIM-style complete agency layer (Home, products, portfolio). No GSAP. */
.mx-ahero{position:relative;overflow:hidden;padding:calc(var(--mx-header-h) + clamp(2.5rem,5vw,5rem)) 0 clamp(3rem,6vw,5.5rem);border-bottom:1px solid var(--mx-border)}
.mx-ahero__glow{position:absolute;inset:-20% -10% auto auto;width:60vw;height:60vw;max-width:900px;max-height:900px;background:radial-gradient(closest-side,rgba(241,111,88,.16),rgba(100,230,255,.08) 55%,transparent);pointer-events:none}
.mx-ahero__grid{position:relative;display:grid;gap:clamp(2rem,4vw,4rem);align-items:center}
.mx-ahero__title{font-family:var(--mx-font-display);font-weight:800;font-size:clamp(2.1rem,1.3rem + 2.6vw,3.6rem);line-height:1.04;letter-spacing:-.02em;margin:.6rem 0 1.2rem;max-width:none;overflow-wrap:break-word}
.mx-ahero__title em{font-style:normal;color:var(--mx-accent);display:block}
.mx-ahero__lede{font-size:var(--mx-fs-l);color:var(--mx-text-muted);max-width:52ch;margin:0 0 1.75rem}
.mx-ahero__chips{list-style:none;padding:0;margin:1.75rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.mx-ahero__chips li{border:1px solid var(--mx-border);border-radius:var(--mx-radius-pill);padding:.45rem .9rem;font-size:var(--mx-fs-s);color:var(--mx-text);background:rgba(255,255,255,.02)}
.mx-ahero__visual{position:relative;min-height:0}
.mx-ahero__visual figure{margin:0;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);overflow:hidden;background:var(--mx-surface);box-shadow:var(--mx-shadow-elev)}
.mx-ahero__visual img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.mx-ahero__sub{position:absolute;width:52%;right:-4%;bottom:-12%;}
.mx-pframe__bar,.mx-site__chrome{display:flex;align-items:center;gap:6px;padding:.55rem .8rem;background:var(--mx-surface-elevated);border-bottom:1px solid var(--mx-border);font-size:var(--mx-fs-xs);color:var(--mx-text-muted)}
.mx-pframe__bar i,.mx-site__chrome i{width:8px;height:8px;border-radius:50%;background:var(--mx-border);flex:none}
.mx-pframe__bar span,.mx-site__chrome span{margin-left:.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:1024px){.mx-ahero__grid{grid-template-columns:1.15fr .85fr}}
@media (min-width:768px) and (max-width:1023px){.mx-ahero__title{max-width:20ch}.mx-ahero__visual{max-width:680px}}
@media (max-width:767px){.mx-ahero__sub{display:none}.mx-ahero .mx-actions .mx-btn{width:100%;justify-content:center;min-height:48px}}

/* Proof strip */
.mx-proofstrip{padding:clamp(2rem,4vw,3.5rem) 0;border-bottom:1px solid var(--mx-border);overflow:hidden}
.mx-proofstrip__head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.25rem}
.mx-proofstrip__k{margin:0;text-transform:uppercase;letter-spacing:.14em;font-size:var(--mx-fs-xs);color:var(--mx-text-muted)}
.mx-proofstrip__link{color:var(--mx-accent);font-size:var(--mx-fs-s);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.mx-proofstrip .mx-marquee{overflow:hidden;margin-top:.9rem}
.mx-proofstrip .mx-marquee__track{display:flex;gap:1rem;list-style:none;margin:0;padding:0;width:max-content;animation:mx-mq 70s linear infinite}
.mx-proofstrip .mx-marquee--rev .mx-marquee__track{animation-direction:reverse}
.mx-proofstrip .mx-marquee:hover .mx-marquee__track{animation-play-state:paused}
.mx-proofstrip .mx-marquee__item{flex:none;width:clamp(220px,24vw,340px)}
.mx-proofstrip .mx-marquee__item a{display:block;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);overflow:hidden;background:var(--mx-surface);color:var(--mx-text);text-decoration:none}
.mx-proofstrip img{display:block;width:100%;aspect-ratio:16/10;height:auto;object-fit:cover;object-position:top}
.mx-proofstrip .mx-marquee__cap{display:flex;gap:.5rem;align-items:baseline;padding:.6rem .8rem;font-size:var(--mx-fs-s);font-weight:600}
.mx-proofstrip .mx-marquee__cap em{font-style:normal;color:var(--mx-text-muted);font-weight:500;font-size:var(--mx-fs-xs)}
@keyframes mx-mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mx-proofstrip .mx-marquee{overflow-x:auto}.mx-proofstrip .mx-marquee__track{animation:none}.mx-proofstrip .mx-marquee__item[aria-hidden]{display:none}}

/* Generic agency section */
.mx-asec{padding:var(--mx-space-section) 0;border-bottom:1px solid var(--mx-border)}
.mx-asec--alt{background:var(--mx-bg-secondary)}
.mx-asec .mx-sec-head,.mx-hflow .mx-sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.25rem;margin-bottom:clamp(1.75rem,3vw,2.75rem)}

/* Filter + products */
.mx-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.mx-filter__btn{min-height:44px;padding:.55rem 1.1rem;border-radius:var(--mx-radius-pill);border:1px solid var(--mx-border);background:transparent;color:var(--mx-text);font:600 var(--mx-fs-s)/1 var(--mx-font-body);cursor:pointer;transition:background var(--mx-dur-fast),color var(--mx-dur-fast),border-color var(--mx-dur-fast)}
.mx-filter__btn:hover{border-color:var(--mx-accent)}
.mx-filter__btn.is-active{background:var(--mx-accent);color:var(--mx-on-accent);border-color:var(--mx-accent)}
.mx-prods{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))}
.mx-prod{display:flex;flex-direction:column;border:1px solid var(--mx-border);border-radius:var(--mx-radius-l);background:var(--mx-surface);overflow:hidden;transition:transform var(--mx-dur) var(--mx-ease),border-color var(--mx-dur)}
.mx-prod[hidden]{display:none}
.mx-prod:hover{border-color:rgba(241,111,88,.45);transform:translateY(-3px)}
.mx-prod__shot{display:block;aspect-ratio:16/9;background:linear-gradient(135deg,var(--mx-surface-elevated),var(--mx-bg-secondary));border-bottom:1px solid var(--mx-border);overflow:hidden}
.mx-prod__shot img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block}
.mx-prod__mono{display:grid;place-items:center;height:100%;font-family:var(--mx-font-display);font-weight:800;font-size:clamp(1.8rem,3vw,2.6rem);color:var(--mx-accent);letter-spacing:-.02em;background:radial-gradient(closest-side,rgba(241,111,88,.12),transparent)}
.mx-prod__body{padding:1.1rem 1.15rem 1.2rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.mx-prod__verb{margin:0;font-size:var(--mx-fs-xs);letter-spacing:.14em;color:var(--mx-accent-ai)}
.mx-prod__name{margin:0;font-family:var(--mx-font-display);font-size:1.45rem;line-height:1.1}
.mx-prod__name a{color:inherit;text-decoration:none}
.mx-prod__line{margin:0;color:var(--mx-text-muted);font-size:var(--mx-fs-s)}
.mx-prod__login{margin:.25rem 0 0;display:grid;gap:.3rem;padding:.65rem .75rem;border:1px dashed var(--mx-border);border-radius:var(--mx-radius-s);font-size:var(--mx-fs-xs)}
.mx-prod__login div{display:flex;gap:.5rem;min-width:0}
.mx-prod__login dt{color:var(--mx-text-muted);min-width:4.6rem}
.mx-prod__login dd{margin:0;min-width:0;overflow-wrap:anywhere}
.mx-prod__login code{font-family:var(--mx-font-mono);color:var(--mx-text);user-select:all}
.mx-prod__note dd{color:var(--mx-text-muted)}
.mx-prod__acts{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:auto;padding-top:.5rem}
.mx-btn--sm{min-height:44px;padding:.55rem 1rem;font-size:var(--mx-fs-s)}
.mx-prod__req{font-size:var(--mx-fs-s);color:var(--mx-accent);text-decoration:none;min-height:44px;display:inline-flex;align-items:center;margin-left:auto}
@media (max-width:480px){.mx-prod__acts .mx-btn{flex:1 1 40%;justify-content:center}.mx-prod__req{margin-left:0;width:100%}}

/* Services */
.mx-svc{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--mx-border);border:1px solid var(--mx-border);border-radius:var(--mx-radius-l);overflow:hidden;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.mx-svc a{display:flex;flex-direction:column;gap:.6rem;height:100%;padding:clamp(1.25rem,2.4vw,2rem);background:var(--mx-canvas);color:var(--mx-text);text-decoration:none;transition:background var(--mx-dur)}
.mx-svc a:hover{background:var(--mx-surface)}
.mx-svc__n{font-family:var(--mx-font-mono);font-size:var(--mx-fs-xs);color:var(--mx-accent)}
.mx-svc strong{font-family:var(--mx-font-display);font-size:1.35rem;line-height:1.15}
.mx-svc__d{color:var(--mx-text-muted);font-size:var(--mx-fs-s)}
.mx-svc__go{margin-top:auto;padding-top:.75rem;font-size:var(--mx-fs-s);color:var(--mx-accent)}

/* Why */
.mx-whyg{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.mx-whyg li{padding:1.5rem;border:1px solid var(--mx-border);border-radius:var(--mx-radius-l);background:var(--mx-surface)}
.mx-whyg__n{display:block;font-family:var(--mx-font-mono);color:var(--mx-accent);font-size:var(--mx-fs-xs);margin-bottom:1rem}
.mx-whyg strong{display:block;font-family:var(--mx-font-display);font-size:1.25rem;margin-bottom:.5rem}
.mx-whyg p{margin:0;color:var(--mx-text-muted);font-size:var(--mx-fs-s)}

/* Process on Home (story.css not loaded in 0.5.0) */
.mx-hflow{padding:var(--mx-space-section) 0;border-bottom:1px solid var(--mx-border)}
.mx-hflow__steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem;counter-reset:s}
.mx-hflow__steps li{position:relative;padding:1.25rem 1.25rem 1.25rem 4rem;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);background:var(--mx-surface)}
.mx-hflow__n{position:absolute;left:1.15rem;top:1.2rem;font-family:var(--mx-font-mono);color:var(--mx-accent);font-size:var(--mx-fs-s)}
.mx-hflow__steps strong{display:block;font-family:var(--mx-font-display);font-size:1.2rem;margin-bottom:.35rem}
.mx-hflow__steps p{margin:0;color:var(--mx-text-muted);font-size:var(--mx-fs-s)}
@media (min-width:1024px){.mx-hflow__steps{grid-template-columns:repeat(5,1fr)}.mx-hflow__steps li{padding:3.5rem 1.25rem 1.5rem}.mx-hflow__n{top:1.25rem}}
@media (min-width:768px) and (max-width:1023px){.mx-hflow__steps{grid-template-columns:repeat(2,1fr)}.mx-hflow__steps li:last-child{grid-column:1/-1}}

/* Portfolio wall */
.mx-pwall{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}
.mx-pwall a{display:block;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);overflow:hidden;background:var(--mx-surface);color:var(--mx-text);text-decoration:none;transition:transform var(--mx-dur) var(--mx-ease),border-color var(--mx-dur)}
.mx-pwall a:hover{transform:translateY(-3px);border-color:rgba(241,111,88,.45)}
.mx-pwall img{display:block;width:100%;aspect-ratio:16/10;height:auto;object-fit:cover;object-position:top}
.mx-pwall__cap{display:flex;flex-direction:column;gap:.15rem;padding:.75rem .9rem;font-weight:600}
.mx-pwall__cap em{font-style:normal;font-size:var(--mx-fs-xs);color:var(--mx-text-muted);font-weight:500;letter-spacing:.06em;text-transform:uppercase}

/* Lead close (fallback when story.css absent) */
.mx-hlead{padding:var(--mx-space-section) 0}
.mx-hlead .mx-container{display:grid;gap:clamp(2rem,4vw,4rem)}
.mx-hlead__title{font-family:var(--mx-font-display);font-size:var(--mx-fs-d-l);line-height:1.05;margin:.6rem 0 1rem}
.mx-hlead__title em{font-style:normal;color:var(--mx-accent)}
@media (min-width:1024px){.mx-hlead .mx-container{grid-template-columns:.9fr 1.1fr;align-items:start}.mx-hlead__head{position:sticky;top:calc(var(--mx-header-h) + 2rem)}}
@media (max-width:767px){.mx-hlead .mx-actions .mx-btn{width:100%;justify-content:center;min-height:48px}}
.mx-h2{font-family:var(--mx-font-display);font-size:var(--mx-fs-d-l);line-height:1.05;margin:.5rem 0 0;letter-spacing:-.015em}
.mx-h2 em{font-style:normal;color:var(--mx-accent)}
.mx-sec-lede{color:var(--mx-text-muted);max-width:58ch;margin:.9rem 0 0}

/* Product page */
.mx-mo__herogrid{position:relative;display:grid;gap:2rem;align-items:end}
@media (min-width:1024px){.mx-mo__herogrid{grid-template-columns:1.3fr .7fr}}
.mx-mo__logincard{border:1px solid var(--mx-border);border-radius:var(--mx-radius-l);background:rgba(20,23,27,.85);padding:1.25rem}
.mx-mo__k{margin:0 0 .6rem;font-size:var(--mx-fs-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--mx-accent-ai)}
.mx-mo__small{margin:.75rem 0 0;font-size:var(--mx-fs-xs);color:var(--mx-text-muted)}
.mx-mo__feats{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.mx-mo__feats li{padding:1.25rem;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);background:var(--mx-surface);font-weight:600}
.mx-mo__feats span{display:block;font-family:var(--mx-font-mono);font-size:var(--mx-fs-xs);color:var(--mx-accent);margin-bottom:.6rem}
.mx-mo__ui{margin:0;border:1px solid var(--mx-border);border-radius:var(--mx-radius-l);overflow:hidden;background:var(--mx-surface)}
.mx-mo__ui img{display:block;width:100%;height:auto}
.mx-mo__placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;text-align:center;aspect-ratio:16/8;padding:2rem;background:radial-gradient(closest-side,rgba(241,111,88,.1),transparent)}
.mx-mo__placeholder strong{font-family:var(--mx-font-display);font-size:clamp(2rem,5vw,4rem);color:var(--mx-accent)}
.mx-mo__placeholder span{color:var(--mx-text-muted)}
@media (max-width:600px){.mx-mo__placeholder{aspect-ratio:auto}}
.mx-mo__svc,.mx-mo__more{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.mx-mo__svc a,.mx-mo__more a{display:flex;flex-direction:column;gap:.3rem;min-height:44px;padding:1rem 1.15rem;border:1px solid var(--mx-border);border-radius:var(--mx-radius-m);color:var(--mx-text);text-decoration:none;font-weight:600;transition:border-color var(--mx-dur)}
.mx-mo__svc a:hover,.mx-mo__more a:hover{border-color:var(--mx-accent)}
.mx-mo__more span{font-weight:400;color:var(--mx-text-muted);font-size:var(--mx-fs-s)}
html,body{overflow-x:clip}
.mx-prod__mono{white-space:nowrap;font-size:clamp(1.5rem,2.4vw,2.2rem)}
.mx-mo__what .mx-s__head h2{font-size:clamp(1.4rem,1rem + 1.6vw,2.2rem);line-height:1.25;max-width:40ch}
@media (min-width:1024px){.mx-svc{grid-template-columns:repeat(3,1fr)}}
@media (min-width:640px) and (max-width:1023px){.mx-svc{grid-template-columns:repeat(2,1fr)}}
