/* ===================== CONTACT ===================== */
.ct{min-height:100vh;min-height:100svh;padding-block:calc(env(safe-area-inset-top,0px) + 132px) 110px}
.ct-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px clamp(40px,6vw,112px);align-items:start}
.ct-l{position:sticky;top:calc(env(safe-area-inset-top,0px) + 132px);display:flex;flex-direction:column;gap:30px}
.ct-k{display:flex;flex-wrap:wrap;gap:8px 22px}
.ct-t{font-size:clamp(50px,6.6vw,124px);font-weight:800;letter-spacing:-.06em;line-height:.88}
.ct-t .l{display:block;overflow:hidden;padding:.02em .08em .14em 0;margin-bottom:-.12em}
.ct-t .l>span{display:inline-block}
.ct-t em{font-style:normal;color:var(--ac)}
html.fx .ct-t .l>span{transform:translate3d(0,112%,0);transition:transform 1.1s var(--eo)}
html.fx .ct-t .l:nth-child(2)>span{transition-delay:.08s}html.fx .ct-t .l:nth-child(3)>span{transition-delay:.16s}
html.fx.ready .ct-t .l>span{transform:none}
.ct-l .lead{max-width:36ch}
.steps3{list-style:none;margin:0;padding:0;border-top:1px solid var(--ln);max-width:560px}
.steps3 li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 12px;padding:14px 0;border-bottom:1px solid var(--ln)}
.steps3 .n{grid-column:1;grid-row:1 / span 2;font:500 12px/1.6 var(--m);color:var(--ac)}
.steps3 b{grid-column:2;font:800 17px/1.3 var(--f);letter-spacing:-.015em}
.steps3 span:not(.n){grid-column:2;font-size:14.5px;line-height:1.5;color:var(--mut)}
.alt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font:500 13px/1.4 var(--m);color:var(--mut)}
.alt b{font-weight:500;color:var(--fg);user-select:all}
.mini{height:32px;display:inline-flex;align-items:center;padding:0 12px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--ln);color:var(--fg);font:700 12.5px/1 var(--f);cursor:pointer;transition:box-shadow .25s,color .25s}
.mini:hover{box-shadow:inset 0 0 0 1px var(--ac);color:var(--ac)}

/* card */
.card-f{position:relative;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:clamp(22px,2.6vw,38px);display:flex;flex-direction:column;gap:26px;isolation:isolate;overflow:hidden}
.card-f::after{content:"";position:absolute;right:-18%;top:-40%;width:34%;height:180%;background:var(--vul);transform:rotate(45deg);opacity:.06;z-index:-1;pointer-events:none}
html.fx .card-f{opacity:0;transform:translate3d(0,30px,0);transition:opacity .9s var(--eo) .35s,transform 1.1s var(--eo) .35s}
html.fx.ready .card-f{opacity:1;transform:none}
.fld{display:flex;flex-direction:column;gap:10px}
.fld-l{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:500 12px/1 var(--m);color:var(--gangue)}
.fld-l b{font-weight:500;color:var(--rime)}
.fld-l .opt{color:var(--gangue)}
.em{width:100%;height:60px;border:0;border-radius:0;background:transparent;box-shadow:inset 0 -1.5px 0 var(--line2);color:var(--rime);font:700 clamp(20px,1.8vw,26px)/1 var(--f);letter-spacing:-.015em;padding:0 2px;transition:box-shadow .25s}
.em::placeholder{color:#4F6873;font-weight:600}
.em:focus{outline:none;box-shadow:inset 0 -2px 0 var(--vul)}
.fld.bad .em,.fld.bad .box{box-shadow:inset 0 -2px 0 var(--vul)}
.err{font:500 12.5px/1.4 var(--m);color:var(--vul);min-height:0}
.err:empty{display:none}

.box{position:relative;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);min-height:210px;display:flex;flex-direction:column;transition:box-shadow .25s}
.box:focus-within{box-shadow:inset 0 0 0 1.5px var(--vul)}
.box textarea{flex:1;width:100%;min-height:210px;max-height:420px;resize:none;border:0;background:transparent;color:var(--rime);font:500 17px/1.6 var(--f);padding:18px 18px 76px;border-radius:0}
.box textarea::placeholder{color:#4F6873}
.box textarea:focus{outline:none}
.box-bar{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}
.box-bar>*{pointer-events:auto}
.cnt{font:500 11.5px/1 var(--m);color:var(--gangue);font-variant-numeric:tabular-nums}
.mic{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 18px 0 14px;border:0;background:var(--vul);color:var(--noturno);font:700 14px/1 var(--f);cursor:pointer;position:relative;overflow:hidden;isolation:isolate}
.mic::before{content:"";position:absolute;inset:0;background:var(--rime);transform:translateY(101%);transition:transform .45s var(--eo);z-index:-1}
.mic:hover::before{transform:none}
.mic svg{width:18px;height:18px}
.mic small{font:500 11px/1 var(--m);opacity:.7}

/* recorder */
.rec{display:none;flex-direction:column;gap:14px;padding:16px 18px 16px;min-height:210px}
.box.is-rec .rec,.box.is-rev .rec{display:flex}
.box.is-rec textarea,.box.is-rev textarea,.box.is-rec .box-bar,.box.is-rev .box-bar{display:none}
.rec-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font:500 12px/1 var(--m);color:var(--gangue)}
.rec-top b{font-weight:500;color:var(--rime);display:inline-flex;align-items:center;gap:9px}
.rec-top b i{width:9px;height:9px;border-radius:50%;background:var(--vul)}
.box.is-rec .rec-top b i{animation:rdot 1.1s infinite}
@keyframes rdot{50%{opacity:.25}}
.tm{font:500 13px/1 var(--m);color:var(--rime);font-variant-numeric:tabular-nums}
.tm span{color:var(--gangue)}
.wave{display:block;width:100%;height:96px;max-width:100%}
.rec-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ib{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:44px;padding:0 16px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--line2);color:var(--rime);font:700 13.5px/1 var(--f);cursor:pointer;transition:box-shadow .25s,color .25s,background-color .25s}
.ib:hover{box-shadow:inset 0 0 0 1px var(--vul);color:var(--vul)}
.ib svg{width:16px;height:16px}
.ib--hot{background:var(--vul);color:var(--noturno);box-shadow:none}
.ib--hot:hover{background:var(--rime);color:var(--noturno);box-shadow:none}
.ib--play{width:52px;height:52px;padding:0;background:var(--rime);color:var(--noturno);box-shadow:none}
.ib--play:hover{background:var(--vul);color:var(--noturno)}
.rev-w{display:flex;align-items:center;gap:14px}
.rev-w canvas{flex:1;min-width:0;height:52px;cursor:pointer}
.box.is-rec .only-rev,.box.is-rev .only-rec{display:none}
.demo{font:500 10.5px/1 var(--m);letter-spacing:.08em;text-transform:uppercase;color:var(--noturno);background:var(--gangue);padding:4px 6px}
.micnote{font:500 12.5px/1.5 var(--m);color:var(--gangue);background:rgba(255,65,3,.08);box-shadow:inset 2px 0 0 var(--vul);padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.micnote[hidden]{display:none}
.micnote button{font:700 12.5px/1 var(--f);color:var(--vul);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

.send{display:flex;flex-direction:column;gap:12px}
.send .btn{width:100%}
.send-m{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font:500 12px/1.5 var(--m);color:var(--gangue)}
.send-m a{color:var(--gangue);text-decoration:underline;text-underline-offset:3px}
.send-m kbd{font:500 11px/1 var(--m);color:var(--rime);box-shadow:inset 0 0 0 1px var(--line2);padding:3px 6px}
.btn[aria-busy="true"]{pointer-events:none;opacity:.7}

/* shipped */
.done{display:none;flex-direction:column;gap:22px;min-height:420px;justify-content:space-between}
.card-f.is-done>.fld,.card-f.is-done>.send,.card-f.is-done>.micnote{display:none}
.card-f.is-done .done{display:flex}
.done h2{font-size:clamp(54px,6vw,104px);font-weight:800;letter-spacing:-.06em;line-height:.86}
.done h2 .l{display:block;overflow:hidden;padding:.02em .08em .14em 0;margin-bottom:-.12em}
.done h2 .l>span{display:inline-block;position:relative}
.done h2 .dead{color:var(--gangue)}
.done h2 em{font-style:normal;color:var(--vul)}
.card-f.is-done .done .strike{transform:scaleX(1);transition:transform .45s var(--eio) .35s}
html.fx .done h2 .l+.l>span{transform:translate3d(0,112%,0);transition:transform .9s var(--eo) .7s}
html.fx .card-f.is-done .done h2 .l+.l>span{transform:none}
.done p{color:var(--gangue);font-size:17px;line-height:1.55;max-width:40ch}
.done p b{color:var(--rime);font-weight:700}
.done .proto{font:500 12px/1.5 var(--m);color:var(--gangue);box-shadow:inset 2px 0 0 var(--vul);padding:8px 12px;background:rgba(255,65,3,.07)}
.receipt{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 18px;font:500 12.5px/1.5 var(--m);border-top:1px solid var(--line);padding-top:16px}
.receipt dt{color:var(--gangue)}.receipt dd{margin:0;color:var(--rime);overflow-wrap:anywhere}

@media (max-width:1000px){.ct-in{grid-template-columns:1fr}.ct-l{position:relative;top:auto}.ct{padding-top:calc(env(safe-area-inset-top,0px) + 112px)}}
@media (max-width:560px){.mic small{display:none}.send-m .kb{display:none}.ct-t{font-size:clamp(44px,12.4vw,80px)}html.fx .hud-bl{display:none}}
.alt-l{border-bottom:1.5px solid var(--vul);font-weight:700}