/* Sky Porch · Mulee product page */
.mulee-hero{
  padding-block:28px 36px;
}
.mulee-hero .page-breadcrumbs{
  margin-block-end:40px;
}
.mulee-lockup{
  display:flex;align-items:center;gap:14px;
  margin-block-end:28px;
}
.mulee-lockup img{
  inline-size:64px;block-size:64px;
}
.mulee-lockup b{
  display:block;font-size:24px;line-height:1.2;
}
.mulee-lockup small{
  display:block;color:var(--muted);font-size:12px;
}
.mulee-version{
  padding-block:5px;padding-inline:10px;
  border:1px solid var(--line-2);border-radius:999px;
  color:var(--muted);font:11px var(--font-mono);
}
.mulee-hero .hero-title{
  max-inline-size:100%;
  font-size:clamp(36px,5vw,68px);line-height:1.2;
}
.mulee-protocols{
  margin-block-start:24px;color:var(--c-sky);
  font:600 13px var(--font-mono);text-align:start;
  inline-size:fit-content;
}
.mulee-hero .hero-sub{
  max-inline-size:720px;font-size:17px;
}
.mulee-facts{
  display:flex;flex-wrap:wrap;gap:10px 22px;
  list-style:none;margin-block:24px 42px;
  color:var(--muted);font-size:12px;
}
.mulee-facts li::before{
  content:'✓';color:#178366;margin-inline-end:7px;
}
.mulee-main-shot img{
  inline-size:100%;block-size:auto;border-radius:18px;
  box-shadow:0 22px 60px -24px rgba(14,18,32,.32);
  border:1px solid rgba(255,255,255,.92);
}
.mulee-page figcaption{
  margin-block-start:14px;color:var(--muted);font-size:12px;
  line-height:1.6;
}
.mulee-section{
  padding-block:64px;
}
.mulee-section .sec-head{
  margin-block-end:32px;
}
.mulee-feature-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;
}
.mulee-feature{
  padding-block:26px;padding-inline:28px;
  background:var(--glass);border:1px solid var(--glass-br);
  border-radius:22px;box-shadow:var(--sh-glass);
  backdrop-filter:blur(20px);
}
.mulee-feature-num{
  display:block;color:var(--c-sky);font:12px var(--font-mono);
  margin-block-end:22px;
}
.mulee-feature h3,.mulee-steps h3{
  font-size:19px;line-height:1.4;margin-block-end:10px;
}
.mulee-feature p,.mulee-steps p,.mulee-showcase-copy > p{
  color:var(--muted);font-size:14px;line-height:1.8;
}
.mulee-showcase{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);
  gap:56px;align-items:center;
}
.mulee-showcase-reverse{
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
}
.mulee-showcase-reverse .mulee-showcase-copy{
  grid-column:2;grid-row:1;
}
.mulee-showcase-reverse figure{
  grid-column:1;grid-row:1;
}
.mulee-showcase .sec-title{
  font-size:clamp(30px,3.4vw,46px);line-height:1.2;
}
.mulee-checks{
  list-style:none;display:grid;gap:12px;margin-block-start:24px;
  font-size:14px;
}
.mulee-checks li{
  padding-inline-start:16px;border-inline-start:3px solid var(--c-mint);
}
.mulee-long-shot,.mulee-network-shot{
  min-inline-size:0;
}
.mulee-long-shot a{
  display:block;overflow:hidden;border-radius:18px;
  border:1px solid var(--glass-br);box-shadow:var(--sh-glass);
}
.mulee-long-shot img{
  inline-size:100%;block-size:auto;
  aspect-ratio:1.08;object-fit:cover;object-position:100% 0;
}
.mulee-network-shot img{
  inline-size:100%;block-size:auto;border-radius:18px;
  box-shadow:var(--sh-glass);
}
.mulee-showcase-copy .mulee-rule-label{
  margin-block:22px 10px;font-size:12px;font-weight:650;
}
.mulee-showcase pre{
  max-inline-size:100%;overflow:auto;padding-block:18px;padding-inline:20px;
  background:#131b30;color:#e2ecff;border-radius:14px;
  font:12px/1.8 var(--font-mono);text-align:start;
}
.mulee-showcase-copy .mulee-note{
  margin-block-start:14px;font-size:12px;
}
.mulee-steps{
  list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;counter-reset:step;
}
.mulee-steps li{
  border-block-start:1px solid var(--line-2);padding-block-start:22px;
}
.mulee-step-num{
  display:block;font:24px var(--font-mono);color:var(--c-sky);
  margin-block-end:22px;
}
.mulee-optional{
  margin-block-start:28px;color:var(--muted);font-size:13px;line-height:1.8;
}
.mulee-gallery{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.55fr);
  gap:22px;align-items:start;
}
.mulee-gallery img{
  inline-size:100%;block-size:auto;border-radius:14px;
  box-shadow:var(--sh-glass);
}
.mulee-menu-shot img{
  max-inline-size:230px;margin-inline:auto;
}
.mulee-faq{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;
  align-items:start;
}
.mulee-faq details{
  background:var(--glass-s);border:1px solid var(--glass-br);
  border-radius:16px;box-shadow:var(--sh-glass);
}
.mulee-faq summary{
  position:relative;cursor:pointer;list-style:none;
  padding-block:20px;padding-inline:22px 48px;
  font-size:14px;font-weight:650;line-height:1.5;
}
.mulee-faq summary::-webkit-details-marker{
  display:none;
}
.mulee-faq summary::after{
  content:'+';position:absolute;inset-inline-end:20px;inset-block-start:17px;
  color:var(--c-sky);font-size:20px;font-weight:400;
}
.mulee-faq details[open] summary::after{
  content:'−';
}
.mulee-faq details p{
  padding-block:0 22px;padding-inline:22px;
  color:var(--muted);font-size:13px;line-height:1.8;
}
.mulee-cta-card{
  padding-block:48px;padding-inline:40px;
  background:var(--glass-s);border:1px solid var(--glass-br);
  box-shadow:var(--sh-glass);border-radius:28px;
  text-align:center;
}
.mulee-cta-card > img{
  inline-size:72px;block-size:72px;margin-inline:auto;margin-block-end:22px;
}
.mulee-cta-card > p{
  color:var(--muted);max-inline-size:640px;margin-inline:auto;
}
.mulee-cta-card .hero-cta{
  justify-content:center;margin-block-start:26px;
}
.mulee-disclaimer{
  text-align:center;font-size:12px;color:var(--muted);margin-block-start:24px;
}
.mulee-page a:focus-visible,.mulee-page summary:focus-visible,.mulee-page pre:focus-visible{
  outline:3px solid var(--c-sky);outline-offset:4px;
}
@media (max-width:1000px){
  .mulee-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mulee-showcase,.mulee-showcase-reverse{gap:28px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .mulee-showcase pre{font-size:11px;padding-inline:12px}
}
@media (max-width:720px){
  .mulee-hero{padding-block:16px 24px}
  .mulee-hero .page-breadcrumbs{margin-block-end:28px}
  .mulee-hero .hero-title{
    font-size:36px;
  }
  .mulee-facts{gap:10px 16px;margin-block-end:28px}
  .mulee-main-shot img{border-radius:10px}
  .mulee-section{padding-block:36px}
  .mulee-feature-grid,.mulee-steps,.mulee-showcase,.mulee-showcase-reverse,.mulee-faq,  .mulee-showcase-reverse .mulee-showcase-copy,.mulee-showcase-reverse figure{grid-column:auto;grid-row:auto}
  .mulee-long-shot img{aspect-ratio:auto}
  .mulee-gallery{grid-template-columns:minmax(0,1fr);gap:30px}
  .mulee-menu-shot{max-inline-size:230px}
    .mulee-cta-card{padding-block:32px;padding-inline:22px}
  .mulee-showcase pre{font-size:11px}
}
