/* Site David v0.5 — social/contact UI and launch-ready contact form. */
:root { --quickbar-height: 76px; --contact-safe-bottom: env(safe-area-inset-bottom, 0px); --quickbar-total: calc(var(--quickbar-height) + var(--contact-safe-bottom)); }
.footer-main { padding-bottom: 26px; }
.footer-social-band { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 23px 0 27px; border-top: 1px solid #d1bc942a; }
.footer-social-intro .eyebrow { font-size: 9px; letter-spacing: .19em; margin: 0 0 8px; }
.footer-social-intro .eyebrow::before { width: 25px; }
#footer-social-title { font-family: var(--serif); font-size: 25px; color: var(--paper); line-height: 1.25; margin: 0; }
.footer-social-note { font-size: 11px; color: #adbdbf; margin: 9px 0 0; line-height: 1.6; }
.footer-socials { display: flex; align-items: flex-start; gap: 25px; }
.contact-action { -webkit-tap-highlight-color: transparent; }
.contact-action--social { display: flex; flex-direction: column; align-items: center; gap: 7px; min-width: 60px; color: var(--paper); }
.contact-action--social .contact-icon { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid #d1bc9459; border-radius: 50%; background: #e5d2a008; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.contact-icon svg { width: 23px; height: 23px; }
.contact-action--social .contact-action-label { font-size: 11px; letter-spacing: .02em; line-height: 1.5; }
.contact-action:focus-visible { outline: 2px solid #e4c78c; outline-offset: 5px; border-radius: 4px; }
@media (hover:hover) {
  .contact-action--social:hover .contact-icon { color: var(--gold-light); border-color: var(--gold-light); background: #e5d2a015; }
  .contact-action--social:hover .contact-action-label { color: var(--gold-light); }
}
/* Desktop: one persistent WhatsApp control, separate from preview controls. */
.mobile-quick-actions { display: none; }
.desktop-whatsapp { position: fixed; right: max(22px, env(safe-area-inset-right, 0px)); bottom: max(22px, env(safe-area-inset-bottom, 0px)); z-index: 27; }
.contact-action--floating { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #147647; color: #fff; border: 1px solid #90c49780; box-shadow: 0 5px 26px #04171b4d, inset 0 1px 0 #ffffff24; transition: background .2s ease, box-shadow .2s ease; }
.contact-action--floating .contact-icon svg { width: 31px; height: 31px; }
.contact-action--floating:focus-visible { outline-offset: 4px; border-radius: 50%; }
.whatsapp-hint { position: absolute; bottom: calc(100% + 12px); right: 0; width: max-content; max-width: 210px; padding: 9px 12px; border: 1px solid #b59c695c; border-radius: 4px; background: #0b2229; color: var(--paper); font-size: 12px; line-height: 1.4; pointer-events: none; visibility: hidden; opacity: 0; transition: opacity .15s; }
.contact-action--floating:hover .whatsapp-hint, .contact-action--floating:focus-visible .whatsapp-hint { visibility: visible; opacity: 1; }
@media (hover:hover) { .contact-action--floating:hover { background: #10623d; box-shadow: 0 7px 30px #04171b70; } }
.preview-dock { right: 98px; bottom: 28px; }
.footer-bottom { padding-right: 270px; }
.contact-channel-icon { display: flex; align-items: center; color: var(--ink); }
.contact-channel-icon svg { width: 26px; height: 26px; }
.contact-channel p { overflow-wrap: anywhere; }
.contact-channel--pending { align-items: flex-start; gap: 20px; }
.contact-channel--pending .channel-status { flex-shrink: 0; font-size: 9px; white-space: nowrap; padding-top: 4px; }
.contact-dialog { width: min(580px, calc(100% - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; }
.contact-dialog .eyebrow { font-size: 9px; margin: 16px 0 20px; }
.contact-dialog .dialog-head { gap: 18px; }
.contact-dialog .dialog-head h2 { font-size: clamp(26px, 4vw, 34px); }
.contact-dialog .dialog-close { flex-shrink: 0; }
.contact-dialog .button-row { flex-wrap: wrap; }
body.contact-dialog-open { overflow: hidden; }
/* Compact/touch layout: exactly Instagram | Telefone | WhatsApp. */
@media (max-width:960px) {
  html { scroll-padding-bottom: calc(var(--quickbar-total) + 74px); }
  body { padding-bottom: var(--quickbar-total); }
  .desktop-whatsapp { display: none; }
  .mobile-quick-actions { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); position: fixed; inset: auto 0 0; height: var(--quickbar-total); z-index: 27; align-items: stretch; padding: 7px max(10px, env(safe-area-inset-right, 0px)) calc(7px + var(--contact-safe-bottom)) max(10px, env(safe-area-inset-left, 0px)); background: linear-gradient(110deg,#0a232c,#102d36 48%,#091f27); border-top: 1px solid #bfa36e75; box-shadow: 0 -6px 25px #061a233b; }
  .contact-action--quick { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; min-width: 0; min-height: 60px; color: var(--paper); }
  .contact-action--quick + .contact-action--quick::before { content: ''; position: absolute; top: 8px; bottom: 8px; left: 0; width: 1px; background: #d1bc9438; }
  .contact-action--quick .contact-icon { color: #d1bc94; }
  .contact-action--quick .contact-icon svg { width: 25px; height: 25px; }
  .contact-action--quick .contact-action-label { line-height: 1.3; font-size: 12px; }
  .contact-action--quick:focus-visible { outline-offset: -3px; }
  .contact-action--quick:active { background: #ffffff0b; }
  .preview-dock { right: 12px; bottom: calc(var(--quickbar-total) + 12px); }
  .site-footer { padding-bottom: 80px; }
  .footer-bottom { padding-right: 0; padding-bottom: 0; }
  body.menu-open .contact-actions, body.menu-open .preview-dock { visibility: hidden; }
  body.editing-field .mobile-quick-actions, body.editing-field .preview-dock { visibility: hidden; pointer-events: none; }
}
@media (max-width:580px) {
  .footer-main { padding-bottom: 25px; }
  .footer-social-band { align-items: flex-start; flex-direction: column; gap: 22px; padding-block: 23px 29px; }
  #footer-social-title { font-size: 25px; }
  .footer-social-note { max-width: 295px; font-size: 10px; }
  .footer-socials { width: 100%; max-width: 310px; justify-content: space-between; gap: 18px; }
  .contact-channel--pending { gap: 10px; }
  .contact-channel--pending p { font-size: 12px; }
  .contact-dialog .button-row { align-items: flex-start; flex-direction: column; gap: 18px; }
}
@media (max-width:360px) { .contact-action--quick .contact-action-label { font-size: 11px; } .contact-dialog { padding: 20px; } }
@media (prefers-reduced-motion:reduce) { .contact-action, .contact-icon, .whatsapp-hint { transition: none; } }
@media (forced-colors:active) { .contact-action--floating, .mobile-quick-actions, .contact-action--social .contact-icon { border: 1px solid ButtonText; } }
@media print { body { padding-bottom: 0!important; } .contact-actions, .preview-dock, .contact-dialog { display: none!important; } }

/* v0.4.1: published email/phone labels wrap without displacing their icons. */
.contact-channel > div:first-child { min-width: 0; flex: 1; }
.contact-channel p { overflow-wrap: anywhere; }
.contact-channel-icon { flex: 0 0 24px; }
.contact-channel .channel-status { flex-shrink: 0; }

/* O envio só é liberado quando o Worker injeta a chave pública do Turnstile. */
.form-preview form { margin-top: 27px; }
.form-preview fieldset { margin-top: 0; }
.form-preview .form-field { margin-bottom: 17px; }
.form-preview .form-field label { color: var(--ink); line-height: 1.5; }
.form-field .optional { color: var(--muted); font-size: 9px; margin-left: 5px; text-transform: uppercase; letter-spacing: .06em; }
.form-preview .form-field input,
.form-preview .form-field textarea,
.form-preview .form-field select { width: 100%; min-height: 48px; border: 1px solid #bfc2b8; background: #f8f5ee; color: var(--ink); padding: 11px 13px; border-radius: 0; opacity: 1; -webkit-text-fill-color: currentColor; font: 13px/1.5 var(--sans); }
.form-preview .form-field textarea { min-height: 122px; resize: vertical; }
.form-preview .form-field select { appearance: none; padding-right: 38px; background-image: linear-gradient(45deg,transparent 50%,#5f6d68 50%),linear-gradient(135deg,#5f6d68 50%,transparent 50%); background-position: calc(100% - 18px) 20px,calc(100% - 13px) 20px; background-size: 5px 5px,5px 5px; background-repeat: no-repeat; }
.form-preview .form-field input:focus-visible,
.form-preview .form-field textarea:focus-visible,
.form-preview .form-field select:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-color: var(--ink); }
.form-preview .form-field input::placeholder,
.form-preview .form-field textarea::placeholder { color: #77817d; opacity: 1; }
.form-consent { display: grid; grid-template-columns: 20px 1fr; align-items: start; gap: 11px; margin: 6px 0 20px; color: var(--muted); font-size: 11px; line-height: 1.65; cursor: pointer; }
.form-consent input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ink); }
.form-consent a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.contact-honeypot { position: absolute!important; left: -10000px!important; width: 1px!important; height: 1px!important; overflow: hidden!important; }
.turnstile-slot { display: grid; align-items: center; min-height: 70px; margin-bottom: 17px; padding: 9px 11px; overflow: hidden; border: 1px dashed #b9b9aa; background: #f1ede4; color: var(--muted); font-size: 10px; line-height: 1.6; }
.form-preview .form-submit { justify-content: space-between; width: 100%; min-height: 50px; }
.form-preview .form-submit:disabled { cursor: not-allowed; opacity: .78; }
.form-status { min-height: 39px; margin: 12px 0 0!important; padding-left: 13px; border-left: 2px solid #9f9271; color: var(--muted)!important; font-size: 10px!important; line-height: 1.65!important; }
.form-status[data-state="ready"] { border-left-color: #47775b; color: #315a43!important; }
.form-status[data-state="sending"] { border-left-color: var(--gold); color: var(--ink)!important; }
.form-status[data-state="success"] { border-left-color: #167149; color: #15583c!important; }
.form-status[data-state="error"] { border-left-color: #994d40; color: #713a31!important; }
.form-footnote { border-top: 1px solid var(--line); padding-top: 17px; }

@media (max-width:360px) {
  .turnstile-slot { justify-items: start; }
  .form-consent { font-size: 10px; }
}