@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');

* { box-sizing: border-box; }
body { margin: 0; font-family: 'DM Sans', system-ui, sans-serif; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 3px solid #b86740; outline-offset: 4px; }
h1, h2, h3, strong { font-family: Manrope, system-ui, sans-serif; }
p { line-height: 1.65; }
figure { margin: 0; }
.mule-preview-icon, .mule-step-icon { font-weight: 800; font-size: 13px; }
.mule-time-dot { width: 11px; height: 11px; margin-inline: 4px; border-radius: 50%; background: #487952; }
.mule-preview-sidebar > img { display: block; }

.mule-site { --mule-ink:#193e30; --mule-accent:#954324; }
.mule-site .mule-hero { background:radial-gradient(ellipse at 82% 40%,#e6edd9,transparent 60%); }
.mule-site .mule-preview { border-color:#aebfa6; box-shadow:0 16px 38px #203f271b; }
.mule-feature-section,.mule-pricing { padding-block:clamp(42px,7vw,82px); }
.mule-feature-grid,.mule-demo-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(265px,100%),1fr)); gap:18px; margin-top:24px; }
.mule-feature-grid article,.mule-demo-grid article { padding:22px; border:1px solid #cddac6; border-radius:14px; border-top:4px solid #376d49; background:#fffdf7; }
.mule-feature-grid article:nth-child(even),.mule-demo-grid article:nth-child(even) { border-top-color:#ae5631; }
.mule-feature-grid p,.mule-demo-grid p { margin:8px 0; }
.mule-demos { background:#e6efdf; padding-block:clamp(42px,7vw,74px); }
.mule-demo-grid .mule-button { margin-top:12px; }
.mule-pricing article strong { font-size:30px; }
.mule-pricing article small { font-size:14px; color:#476252; }
