/* Contact dialog (contact.js), shared by the homepage and the legal pages. Premium tokens: warm paper,
   deep espresso, Inter. Mobile first: a bottom sheet on phones, a centered card from 600 px. */
.contact-modal{--cm-ink:#241f19;--cm-muted:#756a5d;--cm-line:#e7e0d6;--cm-paper:#f6f4f1;--cm-espresso:#17130f;--cm-espresso-hover:#2a211a;
  margin:auto auto 0;padding:0;border:0;background:none;width:100%;max-width:100%;color:var(--cm-ink);font-family:Inter,Arial,sans-serif;overflow:visible}
.contact-modal::backdrop{background:rgba(23,19,15,.42);backdrop-filter:blur(3px)}
.cm-card{position:relative;background:#fff;border-radius:20px 20px 0 0;padding:28px 20px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px -12px rgba(23,19,15,.3)}
.cm-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--cm-paper);border:1px solid var(--cm-line)}
.cm-icon svg{width:22px;height:22px;fill:none;stroke:#80664f;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cm-title{margin:16px 0 0;font-size:24px;line-height:1.15;font-weight:500;letter-spacing:-.035em}
.cm-text{margin:8px 0 0;font-size:15px;line-height:1.55;color:var(--cm-muted);text-wrap:pretty}
.cm-address{display:flex;align-items:center;gap:10px;margin-top:20px;padding:6px 6px 6px 16px;border:1px solid var(--cm-line);border-radius:12px;background:var(--cm-paper)}
.cm-email{flex:1;min-width:0;font-size:15px;font-weight:500;overflow-wrap:anywhere;user-select:all}
.cm-copy{flex:none;min-height:40px;padding:0 14px;border:1px solid #ddd2c4;border-radius:9px;background:#fff;color:#62503b;font:500 14px Inter,Arial,sans-serif;cursor:pointer;transition:background .2s,border-color .2s}
.cm-copy:hover{background:#f6f1ea;border-color:#c6b5a2}
.cm-actions{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.cm-open,.cm-cancel{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:11px;font:500 15px Inter,Arial,sans-serif;text-decoration:none;cursor:pointer;transition:background .2s}
.cm-open{background:var(--cm-espresso);color:#fff}
.cm-open:hover{background:var(--cm-espresso-hover)}
.cm-cancel{background:none;border:1px solid var(--cm-line);color:var(--cm-ink)}
.cm-cancel:hover{background:var(--cm-paper)}
.cm-close{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:none;color:var(--cm-muted);cursor:pointer}
.cm-close:hover{background:var(--cm-paper);color:var(--cm-ink)}
.cm-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.cm-status{min-height:0;margin:0;font-size:12px;color:var(--cm-muted);text-align:center}
.cm-status:not(:empty){margin-top:12px}
.contact-modal :focus-visible{outline:2px solid #947351;outline-offset:3px}
@media (min-width:600px){
  .contact-modal{margin:auto;max-width:440px}
  .cm-card{border-radius:20px;padding:32px 30px 28px;box-shadow:0 30px 80px -24px rgba(23,19,15,.45)}
  .cm-actions{flex-direction:row-reverse}
  .cm-open,.cm-cancel{flex:1}
}
/* Motion: the sheet rises on phones, the card settles from 600 px; both fade out on close. */
@media (prefers-reduced-motion:no-preference){
  .contact-modal[open] .cm-card{animation:cm-rise .32s cubic-bezier(.16,1,.3,1)}
  .contact-modal[open]::backdrop{animation:cm-fade .25s ease}
  .contact-modal.is-closing .cm-card{animation:cm-out .16s ease forwards}
  .contact-modal.is-closing::backdrop{animation:cm-fade .16s ease reverse forwards}
  @media (min-width:600px){.contact-modal[open] .cm-card{animation-name:cm-settle}}
}
@keyframes cm-rise{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes cm-settle{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:none;opacity:1}}
@keyframes cm-out{to{transform:translateY(8px);opacity:0}}
@keyframes cm-fade{from{opacity:0}to{opacity:1}}

/* Forms inside the dialog (launch, contact, support). */
.cm-form{margin-top:18px;display:flex;flex-direction:column;gap:14px}
.cm-field{display:flex;flex-direction:column;gap:6px}
.cm-field label{font-size:13px;font-weight:500;color:var(--cm-ink)}
.cm-field label span{font-weight:400;color:var(--cm-muted)}
.cm-field input,.cm-field select,.cm-field textarea{width:100%;min-height:46px;padding:11px 14px;border:1px solid #ddd2c4;border-radius:11px;background:#fff;color:var(--cm-ink);font:400 16px/1.4 Inter,Arial,sans-serif;transition:border-color .2s,box-shadow .2s}
.cm-field textarea{min-height:104px;resize:vertical}
.cm-field select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2380664f' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") right 12px center/16px no-repeat;padding-right:38px}
.cm-field input::placeholder,.cm-field textarea::placeholder{color:#9b8f7f}
.cm-field input:focus,.cm-field select:focus,.cm-field textarea:focus{outline:none;border-color:#947351;box-shadow:0 0 0 3px #94735126}
.cm-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* Dropdown (Nov 4): a calmer resting state with a hover, and where the browser lets the open list be styled
   (customizable select, Chrome 135 and later) the list becomes a warm card that matches the dialog: rounded,
   hairline border, soft shadow, roomy options, a quiet hover and a check on the chosen one. Other browsers keep
   their own list. */
.cm-field select{cursor:pointer;background-color:#fdfbf8}
.cm-field select:hover{border-color:#c9b9a5}
@supports (appearance:base-select){
  .cm-field select,.cm-field select::picker(select){appearance:base-select}
  .cm-field select{display:flex;align-items:center}
  .cm-field select::picker-icon{display:none}
  .cm-field select::picker(select){margin-block:6px;padding:6px;border:1px solid #e4ded3;border-radius:12px;background:#fff;
    box-shadow:0 1px 2px #34281908,0 18px 40px -16px #34281947;opacity:1;transform:none;transition:opacity .16s,transform .16s cubic-bezier(.16,1,.3,1),display .16s allow-discrete,overlay .16s allow-discrete}
  @starting-style{.cm-field select:open::picker(select){opacity:0;transform:translateY(-4px)}}
  .cm-field select option{display:flex;align-items:center;gap:10px;min-height:40px;padding:9px 12px;border-radius:8px;font-size:15px;color:var(--cm-ink);cursor:pointer}
  .cm-field select option:hover,.cm-field select option:focus-visible{background:#f6f1ea;outline:none}
  .cm-field select option:checked{font-weight:500}
  .cm-field select option::checkmark{order:1;margin-left:auto;color:#80664f}
}
@media (prefers-reduced-motion:reduce){.cm-field select::picker(select){transition:none}}

.cm-error{margin:0;font-size:13px;color:#9c4f3c}
.cm-error:empty{display:none}
.cm-form .cm-actions{margin-top:4px}
.cm-open:disabled{opacity:.7;cursor:progress}
button.cm-open{border:0}
.cm-note{margin:0;font-size:12px;line-height:1.5;color:var(--cm-muted);text-align:center}
.cm-note a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.cm-icon.is-done{background:#eef2ec;border-color:#d7e2d6}
.cm-icon.is-done svg{stroke:#4f7a5a;stroke-width:2}
.cm-card{max-height:calc(100dvh - 24px);overflow-y:auto}