/* Folha de demonstração: painel lateral no desktop, folha que sobe de baixo no celular. Cabeçalho no material navy
   com arcos dos cartões do app; corpo em marfim. <dialog> no body, então nada dos palcos presos interfere. */
html.ds-aberta{overflow:hidden}
.ds{--ds-pad:28px;position:fixed;inset:0 0 0 auto;width:min(480px,100vw);max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:none;color:var(--ink);font-family:var(--sans);overflow:visible}
.ds:not([open]){display:none}
.ds::backdrop{background:rgba(7,18,38,.5);animation:ds-veu .3s cubic-bezier(.4,0,.2,1) both}
.ds.is-saindo::backdrop{animation:ds-veu-sai .24s cubic-bezier(.4,0,1,1) both}
.ds__caixa{display:flex;flex-direction:column;height:100%;overflow-y:auto;overscroll-behavior:contain;background:var(--ivory);box-shadow:-24px 0 60px -24px rgba(7,18,38,.55);animation:ds-entra .42s cubic-bezier(.16,1,.3,1) both}
.ds.is-saindo .ds__caixa{animation:ds-sai .24s cubic-bezier(.4,0,1,1) both}
@keyframes ds-entra{from{transform:translateX(44px);opacity:.4}to{transform:none;opacity:1}}
@keyframes ds-sai{to{transform:translateX(44px);opacity:0}}
@keyframes ds-veu{from{opacity:0}to{opacity:1}}
@keyframes ds-veu-sai{to{opacity:0}}

.ds__cab{position:relative;flex:none;padding:calc(30px + env(safe-area-inset-top,0px)) calc(var(--ds-pad) + 28px) 26px var(--ds-pad);color:#fff;border-bottom:1px solid #C69A4B;
  background:linear-gradient(90deg,rgba(9,28,56,.72) 0%,rgba(9,28,56,.1) 80%),url('assets/textures/navy-arches-720.webp') right 60% / 120% auto no-repeat,var(--navy-card)}
.ds__t{margin:0;font:400 31px/1.08 var(--serif);letter-spacing:-.01em;text-wrap:balance;outline:0}
.ds__d{margin:10px 0 0;font:400 14.5px/1.5 var(--sans);color:#DCE3EE;text-wrap:pretty}
.ds__fecha{position:absolute;right:14px;top:calc(14px + env(safe-area-inset-top,0px));display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:none;color:#fff;cursor:pointer;transition:background-color .18s ease-out}
.ds__fecha:hover{background:rgba(255,255,255,.12)}
.ds__fecha svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ds :focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.ds .ds__t:focus-visible,.ds .ds__fim-t:focus-visible{outline:0}

.ds__form{display:flex;flex-direction:column;gap:16px;padding:24px var(--ds-pad) 18px}
.ds__form[hidden],.ds__fim[hidden],.ds__erro[hidden],.ds__aviso[hidden]{display:none}
.ds__campo{display:flex;flex-direction:column;gap:6px}
.ds__campo label,.ds__fichas legend{padding:0;font:600 13px/1.2 var(--sans);color:var(--ink)}
.ds__campo input,.ds__campo textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid #CBD3DE;border-radius:10px;background:#fff;color:var(--ink);font:400 16px/1.35 var(--sans);box-sizing:border-box;transition:border-color .18s ease-out,box-shadow .18s ease-out}
.ds__campo textarea{resize:vertical}
.ds__campo input:hover,.ds__campo textarea:hover{border-color:#91A7C2}
.ds__campo input:focus,.ds__campo textarea:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(198,154,75,.32)}
.ds__campo [aria-invalid="true"]{border-color:#B3261E}
.ds__erro{margin:0;font:500 13px/1.35 var(--sans);color:#A1231B}
.ds__fichas{display:flex;flex-wrap:wrap;gap:8px;min-width:0;margin:0;padding:0;border:0}
.ds__fichas legend{margin-bottom:8px}
.ds__fichas label{position:relative;cursor:pointer}
.ds__fichas input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.ds__fichas span{display:flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid #CBD3DE;border-radius:999px;background:#fff;font:500 14px/1 var(--sans);color:var(--ink-2);transition:background-color .18s ease-out,border-color .18s ease-out,color .18s ease-out}
.ds__fichas input:checked + span{border-color:#E2C384;background:#F3D892;color:var(--navy);font-weight:600}
.ds__fichas input:focus-visible + span{outline:2px solid var(--gold);outline-offset:2px}
.ds__mais summary{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;font:600 14px/1.2 var(--sans);color:var(--navy)}
.ds__mais summary::-webkit-details-marker{display:none}
.ds__mais summary::before{content:"+";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#EEF1F6;font:500 16px/1 var(--sans)}
.ds__mais[open] summary::before{content:"\2212"}
.ds__mais .ds__campo{margin-top:12px}
.ds__iscas{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ds__aviso{margin:0;padding:12px 14px;border:1px solid #E9DFC9;border-radius:10px;background:#FBF6EA;font:400 14px/1.45 var(--sans);color:var(--ink)}
.ds__aviso a{color:var(--navy);font-weight:600}
.ds__enviar{display:flex;align-items:center;justify-content:center;gap:12px;min-height:54px;margin-top:2px;border:0;border-radius:999px;background:var(--navy);color:#fff;cursor:pointer;font:600 16px/1 var(--brand);letter-spacing:.02em;
  box-shadow:0 0 0 1px rgba(226,184,103,.55),0 14px 26px -16px rgba(11,39,71,.75);transition:background-color .18s ease-out,transform .12s ease-out}
.ds__enviar:hover{background:#12355E}
.ds__enviar:active{transform:translateY(1px)}
.ds__enviar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds__enviar.is-enviando{opacity:.72;cursor:progress}
.ds__enviar.is-enviando svg{display:none}
.ds__nota{margin:0;font:400 12.5px/1.45 var(--sans);color:var(--muted)}
.ds__nota a{color:var(--ink-2)}

.ds__fim{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:36px var(--ds-pad) 24px;animation:ds-entra .4s cubic-bezier(.16,1,.3,1) both}
.ds__selo{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 1.5px #D8B565,0 0 0 5px rgba(216,181,101,.18)}
.ds__selo svg{width:28px;height:28px;fill:none;stroke:#F3D892;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;animation:ds-traco .6s cubic-bezier(.16,1,.3,1) .15s both}
@keyframes ds-traco{from{stroke-dashoffset:24}to{stroke-dashoffset:0}}
.ds__fim-t{margin:8px 0 0;font:400 28px/1.12 var(--serif);color:var(--ink);outline:0}
.ds__fim-d{margin:0;font:400 15px/1.5 var(--sans);color:var(--ink-2)}
.ds__voltar{min-height:46px;margin-top:10px;padding:0 20px;border:1px solid #C9D0DC;border-radius:999px;background:#fff;color:var(--navy);cursor:pointer;font:600 14px/1 var(--sans)}

.ds__rota{margin:auto 0 0;padding:14px var(--ds-pad) calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);font:400 13px/1.5 var(--sans);color:var(--muted)}
.ds__email{color:var(--ink);font-weight:500;user-select:all}
.ds__copia{min-height:32px;padding:0 6px;border:0;background:none;color:var(--navy);cursor:pointer;font:600 13px/1 var(--sans);text-decoration:underline;text-underline-offset:.2em}

@media (max-width:600px){
  .ds{--ds-pad:20px;inset:auto 0 0;width:100vw;height:auto;max-height:100dvh}
  .ds__caixa{height:auto;max-height:calc(100dvh - 28px);margin-top:28px;border-radius:20px 20px 0 0;box-shadow:0 -20px 50px -20px rgba(7,18,38,.6);animation-name:ds-sobe}
  .ds.is-saindo .ds__caixa{animation-name:ds-desce}
  .ds__cab{border-radius:20px 20px 0 0;padding:26px 60px 20px var(--ds-pad)}
  .ds__fecha{top:8px;right:8px}
  .ds__t{font-size:26px}
  .ds__d{font-size:14px}
  .ds__form{gap:12px;padding-top:16px}
  .ds__campo input{min-height:46px;padding-block:10px}
  .ds__mais summary{min-height:40px}
  .ds__rota{padding-top:10px;font-size:12.5px}
  .ds__fim{padding-top:28px}
  @keyframes ds-sobe{from{transform:translateY(60px);opacity:.4}to{transform:none;opacity:1}}
  @keyframes ds-desce{to{transform:translateY(60px);opacity:0}}
}
@media (prefers-reduced-motion:reduce){
  .ds::backdrop,.ds__caixa,.ds__fim,.ds__selo svg{animation:none!important}
  .ds *{transition:none!important}
}
/* Sem serviço configurado, o e-mail é a ação principal da folha */
.ds--email .ds__rota{display:grid;gap:8px;justify-items:start;margin:8px var(--ds-pad) 0;padding:18px 0 0;border-top:1px solid rgba(198,154,75,.5);font-size:13px}
.ds--email .ds__rota-t{font:600 12px/1.3 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:#6E5120}
.ds--email .ds__email{font:400 clamp(21px,6vw,26px)/1.2 var(--serif);color:var(--navy);word-break:break-word}
.ds__abrir{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:0 26px;border-radius:999px;background:var(--navy);color:#fff;font:600 14.5px/1 var(--sans);text-decoration:none}
.ds__abrir[hidden]{display:none}
.ds__abrir:hover{background:#12355E}
.ds__abrir svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds--email .ds__copia{min-height:44px;padding:0 4px;font-size:14px}
