:root{
  --teal:#077881; --teal-fundo:#05565d; --amarelo:#f8ae00;
  --paper:#fbf9f4; --card:#fff; --card-2:#f4f7f6;
  --ink:#152528; --ink-2:#46605f; --ink-3:#7b918f;
  --line:#dbe4e3; --line-2:#eaf0ef;
  --erro:#a8402c; --erro-soft:#f8e6e2;
  --ok:#2f7d5d;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --teal:#4fb6c0; --teal-fundo:#0c2a2e; --amarelo:#f0b535;
  --paper:#0a1516; --card:#111f21; --card-2:#16262a;
  --ink:#e3ecec; --ink-2:#9bb2b2; --ink-3:#6a8281;
  --line:#22353a; --line-2:#1a2b2e;
  --erro:#e59180; --erro-soft:#33191a;
  --ok:#6cc79a;
}}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);
  font:400 16px/1.6 "IBM Plex Sans",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased}
.wrap{max-width:640px;margin:0 auto;padding:0 18px 72px}

.topo{background:var(--teal-fundo);color:#fff;padding:26px 0 30px;margin-bottom:30px}
.topo .wrap{padding-bottom:0}
.marca{display:flex;align-items:center;gap:13px}
.marca img{width:44px;height:44px;display:block}
.marca b{font:500 14px/1.25 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.09em;
  text-transform:uppercase;display:block}
.marca span{font:400 12px/1.3 "IBM Plex Mono",monospace;color:rgba(255,255,255,.72);
  display:block;margin-top:3px}
h1{font:600 clamp(27px,5.6vw,38px)/1.1 "Fraunces",Georgia,serif;letter-spacing:-.02em;
  margin-top:22px;text-wrap:balance}
.topo p{color:rgba(255,255,255,.85);margin-top:12px;font-size:15.5px;max-width:52ch}

h2{font:600 21px/1.2 "Fraunces",Georgia,serif;margin-bottom:6px}
.ajuda{color:var(--ink-2);font-size:14.5px;margin-bottom:16px}

form{display:grid;gap:22px}
fieldset{border:0}
legend{font:500 11px/1 "IBM Plex Mono",monospace;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:11px}
label{display:block;font-weight:500;font-size:14.5px;margin-bottom:7px}
.opc{font-weight:400;color:var(--ink-3);font-size:13px}

input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;font:400 16px/1.5 "IBM Plex Sans",sans-serif;padding:13px 14px;
  border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:2px}
textarea{min-height:130px;resize:vertical}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,
.momento:focus-within{outline:2px solid var(--teal);outline-offset:2px}

.momentos{display:grid;gap:9px}
.momento{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);
  background:var(--card);padding:14px 15px;cursor:pointer;border-radius:2px}
.momento:hover{border-color:var(--ink-3)}
.momento input{margin-top:3px;accent-color:var(--teal);width:19px;height:19px;flex:0 0 auto}
.momento b{display:block;font-weight:600;font-size:15px}
.momento span{display:block;color:var(--ink-2);font-size:13.5px;margin-top:2px}
.momento:has(input:checked){border-color:var(--teal);background:var(--card-2);
  box-shadow:inset 3px 0 0 var(--teal)}

.dupla{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:520px){ .dupla{grid-template-columns:1fr} }

.consent{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);
  background:var(--card-2);padding:15px;border-radius:2px}
.consent input{margin-top:3px;accent-color:var(--teal);width:19px;height:19px;flex:0 0 auto}
.consent span{font-size:14px;color:var(--ink-2)}

button.enviar{font:600 16px/1 "IBM Plex Sans",sans-serif;padding:16px 20px;border:0;
  background:var(--teal);color:#fff;cursor:pointer;border-radius:2px;width:100%}
button.enviar:hover{background:var(--teal-fundo)}
button.enviar:disabled{opacity:.6;cursor:progress}

.msg{padding:13px 15px;font-size:14.5px;border-radius:2px}
.msg.erro{background:var(--erro-soft);color:var(--erro);border:1px solid var(--erro)}
.msg[hidden]{display:none}

.nota{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--ink-3)}
.nota a{color:var(--teal)}
.atalho{display:block;margin-top:24px;border:1px solid var(--line);background:var(--card);
  padding:18px;text-decoration:none;color:inherit;border-radius:2px}
.atalho:hover{border-color:var(--teal)}
.atalho b{display:block;font:600 17px/1.25 "Fraunces",Georgia,serif;color:var(--teal)}
.atalho span{display:block;color:var(--ink-2);font-size:14px;margin-top:5px}