h2.h{font-family:Hello,cursive;font-weight:400;line-height:1;letter-spacing:0}
h2.h{font-family:Hello,cursive;font-weight:400;line-height:1;letter-spacing:0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--g2);border:1px solid var(--g2);border-radius:18px;overflow:hidden}
.f{background:var(--bg);padding:30px;transition:background .3s}.f:hover{background:var(--hov)}
.f .ic{width:40px;height:40px;border-radius:12px;border:1px solid var(--l);display:grid;place-items:center;margin-bottom:16px;font-size:18px}
.f h3{font-size:17px;margin-bottom:6px;letter-spacing:-.01em}.f p{color:var(--g);font-size:14.5px}
.st{display:flex;gap:6px;margin-top:4px}.st span{font-size:12px;color:var(--m);border:1px solid var(--l);border-radius:999px;padding:2px 10px}
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.gal figure{border:1px solid var(--l);border-radius:14px;overflow:hidden;background:var(--card);transition:transform .3s;box-shadow:0 12px 40px var(--sh)}
.gal figure:hover{transform:translateY(-4px)}
.gal figcaption{padding:14px 18px;font-size:14px;color:var(--m);border-top:1px solid var(--l)}
.shot img,.gal img{display:block;width:100%;height:auto}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:s}
.step{border:1px solid var(--l);border-radius:18px;padding:30px;position:relative}
.step:before{counter-increment:s;content:counter(s);font-family:Hello,cursive;font-size:72px;line-height:1;color:#bbb;display:block;margin-bottom:8px}
.step h3{font-size:18px;margin-bottom:6px}.step p{color:var(--g);font-size:14.5px}
.pl{border:1px solid var(--l);border-radius:999px;padding:12px 22px;font-weight:600;display:flex;gap:10px;align-items:center}
.pl.on{background:var(--inv);color:var(--invfg)}.pl small{font-weight:500;color:#777;font-size:12px}
.byo{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.byo .col{border:1px solid var(--l);border-radius:18px;padding:30px;transition:background .3s}.byo .col:hover{background:var(--hov)}
.byo h3{font-size:18px;margin-bottom:6px;letter-spacing:-.01em}.byo .col>p{color:var(--g);font-size:14.5px;margin-bottom:18px}
.bdg{display:flex;flex-wrap:wrap;gap:10px}
code{transition:background-color .4s,color .4s,border-color .4s,box-shadow .4s}
.hp .lede{text-align:center;color:var(--g);max-width:560px;margin:8px auto 56px;font-size:18px}
.hp section{padding:70px 0}.hp section:first-child{padding-top:40px}
@media(max-width:820px){.grid,.steps,.gal,.byo{grid-template-columns:1fr}}
