/* Cores do Bruno Barreiro: verde da marca, laranja do arco e fundo claro */
:root{
  --verde: #0B6B38;
  --verde-2: #0A5A2F;
  --verde-escuro: #0A3D26;
  --laranja: #F2A31B;
  --fundo: #F5FAF6;
  --branco: #FFFFFF;
  --tinta: #14261C;
  --fraca: #4C5F54;
  --filete: #D5E3D9;
  --erro: #B3261E;
  --ok: #1B7A45;
  --sans: "Nunito Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tit: "Poppins", system-ui, sans-serif;
}
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body{ margin: 0; background: var(--fundo); color: var(--tinta); font: 400 1.0625rem/1.55 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img{ max-width: 100%; height: auto; display: block; }
a{ color: inherit; }

/* abertura */
.hero{ position: relative; overflow: hidden; background: linear-gradient(180deg, #FFFFFF 0%, var(--fundo) 100%); padding: 0 max(20px, env(safe-area-inset-left, 0px)) 40px max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); padding-top: calc(28px + env(safe-area-inset-top, 0px)); }
.onda{ position: absolute; pointer-events: none; }
.onda-a{ left: -30%; top: -22%; width: 90%; aspect-ratio: 1.6; background: radial-gradient(closest-side, var(--verde) 0 62%, transparent 63%); border-radius: 50%; opacity: .96; }
.onda-b{ left: -34%; top: -12%; width: 70%; aspect-ratio: 1.4; border-radius: 50%; border: 6px solid var(--laranja); border-color: var(--laranja) transparent transparent transparent; transform: rotate(-24deg); opacity: .95; }
.miolo{ position: relative; max-width: 30rem; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0; }
.logo{ width: min(66vw, 250px); margin-top: 46px; }
.foto{ width: min(76vw, 300px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: #fff; margin-top: 18px; box-shadow: 0 14px 40px rgba(10,61,38,.22), 0 0 0 5px #fff; }
.foto img{ width: 100%; height: 100%; object-fit: cover; }
.selo{ margin: 26px 0 0; font: 700 .8rem var(--tit); letter-spacing: .18em; text-transform: uppercase; color: var(--verde); }
h1{ font: 800 clamp(1.9rem, 8vw, 2.7rem)/1.08 var(--tit); letter-spacing: -.02em; margin: 10px 0 0; color: var(--verde-escuro); text-wrap: balance; }
.intro{ margin: 14px 0 0; color: var(--fraca); font-size: 1.1rem; }
.temas{ list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 20px 0 0; padding: 0; }
.temas li{ background: #fff; border: 1px solid var(--filete); color: var(--verde-2); font: 600 .85rem var(--sans); padding: 6px 13px; border-radius: 999px; }

/* botões */
.btn{ display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 14px 30px; margin-top: 26px; border-radius: 999px; border: 0; background: var(--verde); color: #fff; font: 700 1.05rem var(--tit); text-decoration: none; cursor: pointer; box-shadow: 0 10px 24px rgba(11,107,56,.28); transition: transform .15s ease, background .15s ease; width: 100%; max-width: 22rem; }
.btn:hover{ background: var(--verde-2); transform: translateY(-1px); }
.btn:focus-visible{ outline: 3px solid var(--laranja); outline-offset: 3px; }
.btn:disabled{ opacity: .7; cursor: not-allowed; transform: none; }

/* formulário */
.bloco{ padding: 8px max(16px, env(safe-area-inset-left, 0px)) 46px; padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.form{ max-width: 32rem; margin: 0 auto; background: #fff; border: 1px solid var(--filete); border-radius: 22px; padding: 26px 22px 24px; box-shadow: 0 16px 40px rgba(10,61,38,.1); }
.form h2{ font: 700 1.5rem/1.2 var(--tit); color: var(--verde-escuro); margin: 0; }
.sub{ margin: 6px 0 20px; color: var(--fraca); }
.campo{ display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; min-width: 0; }
.dupla{ display: grid; grid-template-columns: 1fr; gap: 0; }
label{ font: 700 .92rem var(--sans); color: var(--tinta); }
.obr{ font-weight: 600; font-size: .75rem; color: var(--fraca); margin-left: 6px; }
input, select, textarea{ width: 100%; min-height: 50px; padding: 12px 14px; border: 1.5px solid var(--filete); border-radius: 12px; background: #fff; color: var(--tinta); font: 400 16px/1.4 var(--sans); -webkit-appearance: none; appearance: none; }
select{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%230B6B38' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
textarea{ resize: vertical; min-height: 110px; }
input::placeholder, textarea::placeholder{ color: #8A9990; }
input:focus-visible, select:focus-visible, textarea:focus-visible{ outline: 3px solid rgba(242,163,27,.55); border-color: var(--verde); }
input.invalido, select.invalido{ border-color: var(--erro); }
.btn-form{ width: 100%; max-width: none; margin-top: 6px; }
.aviso{ margin: 6px 0 12px; padding: 12px 14px; border-radius: 12px; font: 600 .95rem var(--sans); }
.aviso.erro{ background: #FCE9E7; color: var(--erro); }
.aviso.ok{ background: #E2F4E8; color: var(--ok); }
.aviso[hidden]{ display: none; }
.lgpd{ margin: 14px 0 0; font-size: .82rem; color: var(--fraca); text-align: center; }

/* rodapé */
footer{ background: var(--verde-escuro); color: #BFD6C8; text-align: center; padding: 30px max(20px, env(safe-area-inset-left, 0px)) calc(30px + env(safe-area-inset-bottom, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); font-size: .9rem; }
footer img{ width: 150px; margin: 0 auto 14px; background: #fff; border-radius: 14px; padding: 10px 14px; }
footer p{ margin: 0 auto; max-width: 26rem; }

@media (min-width: 640px){
  .dupla{ grid-template-columns: 1fr 1fr; gap: 14px; }
  .hero{ padding-bottom: 56px; }
  .onda-a{ left: -18%; top: -34%; width: 60%; }
  .onda-b{ left: -20%; top: -20%; width: 48%; }
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  .btn{ transition: none; }
}

/* formulário em duas etapas, endereços separados e busca de CEP */
.etapa{display:flex;align-items:center;gap:10px;font:700 1.08rem var(--tit);color:var(--verde-escuro);margin:22px 0 14px;padding-top:18px;border-top:1px solid var(--filete)}
.form .sub+input+.etapa{border-top:0;padding-top:0;margin-top:8px}
.etapa span{min-width:36px;height:36px;padding:0 6px;border-radius:18px;background:var(--verde);color:#fff;display:grid;place-items:center;font-size:.9rem;flex:0 0 auto}
.end{border:1.5px solid var(--filete);border-radius:16px;padding:14px 14px 2px;margin:4px 0 16px;background:var(--fundo);min-width:0}
.end legend{font:700 .95rem var(--sans);padding:0 8px;color:var(--verde-escuro)}
.dica{margin:0 0 12px;font-size:.86rem;color:var(--fraca)}
.cep-linha{display:grid;grid-template-columns:minmax(0,170px) 1fr;gap:12px;align-items:center}
.cep-linha .campo{margin-bottom:16px}
.cep-status{margin:0 0 16px;font-size:.85rem;font-weight:700;color:var(--fraca);min-height:1.2em}
.cep-status.buscando{color:var(--fraca)}
.cep-status.ok{color:var(--ok)}
.cep-status.erro{color:var(--erro)}
.mesmo{position:relative;display:flex;gap:12px;align-items:center;font:700 .98rem/1.35 var(--sans);margin:0 0 12px;padding:14px;border:1.5px solid var(--filete);border-radius:14px;background:#fff;cursor:pointer}
.mesmo small{display:block;font-weight:600;font-size:.82rem;color:var(--fraca)}
.mesmo input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;padding:0;border:0}
.mesmo .caixa{flex:0 0 26px;width:26px;height:26px;border:2px solid var(--verde);border-radius:7px;background:#fff;display:grid;place-items:center}
.mesmo input:checked+.caixa{background:var(--verde)}
.mesmo input:checked+.caixa::after{content:"";width:7px;height:13px;border:solid #fff;border-width:0 3px 3px 0;transform:translateY(-2px) rotate(45deg)}
.mesmo input:focus-visible+.caixa{outline:3px solid rgba(242,163,27,.55);outline-offset:2px}
.mesmo:has(input:checked){border-color:var(--verde);background:#E2F4E8}
.dupla.fixa{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0 12px}
.dupla.fixa input{padding-left:12px;padding-right:10px}
.end.copiado{opacity:.75}
.dupla{gap:0 12px}
@media (max-width:420px){.cep-linha{grid-template-columns:1fr}.cep-linha .campo{margin-bottom:6px}}
.end .dupla{grid-template-columns:1fr 1fr;gap:0 12px}

/* campo escondido contra robôs */
.pote{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* anexos */
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}
.anexos .rotulo{font:700 .92rem var(--sans);color:var(--tinta)}
.anexos .dica{margin:0}
.btn-anexo{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border:2px dashed var(--verde);border-radius:14px;background:var(--fundo);color:var(--verde);font:700 .98rem var(--sans);cursor:pointer;padding:12px}
.btn-anexo svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-anexo:hover{background:#E2F4E8}
#arquivos:focus-visible + .btn-anexo{outline:3px solid rgba(242,163,27,.55);outline-offset:2px}
.btn-anexo.cheio{opacity:.5;pointer-events:none}
.lista-anexos{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lista-anexos:empty{display:none}
.lista-anexos li{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;border:1.5px solid var(--filete);border-radius:12px;padding:8px 10px;background:#fff}
.lista-anexos .mini{width:48px;height:48px;border-radius:8px;object-fit:cover;background:var(--fundo);display:grid;place-items:center;font:800 .72rem var(--sans);color:var(--verde)}
.lista-anexos .nome{font-weight:700;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lista-anexos .tam{display:block;font-size:.78rem;color:var(--fraca);font-weight:600}
.lista-anexos button{border:0;background:#FCE9E7;color:var(--erro);font:700 .82rem var(--sans);padding:8px 12px;border-radius:999px;cursor:pointer}