@media(max-width:700px){body{font-size:16px}.wrap{padding:0 22px}
nav{grid-template-columns:auto 1fr auto;padding:12px 18px}nav .l a,nav .r a:not(.btn){display:none}nav .l:before{content:"☰";font-size:22px}nav .brand img{width:50px;height:50px}
.bar{font-size:10px;letter-spacing:.16em}
.hero{grid-template-columns:1fr;min-height:0}.hero .copy{padding:70px 24px 50px}.diya{left:24px;top:28px}.hero .imgs{height:460px;order:2}
.edit .script{font-size:46px}.edit .serif{font-size:64px}h2.t{font-size:36px}section{padding:72px 0}
.story,.cards,.why,.steps,.cta .in,footer .g{grid-template-columns:1fr;gap:40px}.story .ph{margin-right:18px}.story blockquote{font-size:26px}
.why div{border:0;margin:0;padding:20px 0 0}.steps div{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}
.head{flex-direction:column;align-items:flex-start;gap:20px}.logos{grid-template-columns:repeat(2,1fr)}.ctas{flex-direction:column;align-items:stretch;text-align:center}
.cta img{max-width:300px;margin:0 auto}footer .bot{flex-direction:column;gap:6px}}
@media(max-width:700px){.hero .imgs{margin:0 22px 40px}}
@media(max-width:700px){section .wrap[style*="1fr 1fr 1fr"]{grid-template-columns:1fr!important}}
