.cos-overlay[hidden] { display: none !important; }
.cos-overlay { position: fixed; inset: 0; z-index: 999999; display: grid; place-items: center; padding: 20px; background: rgba(15, 23, 42, .68); }
.cos-modal { position: relative; width: min(100%, 520px); max-height: calc(100vh - 40px); overflow: auto; box-sizing: border-box; padding: 34px; border-radius: 16px; background: #fff; color: #172033; box-shadow: 0 24px 80px rgba(0,0,0,.3); font: 16px/1.5 system-ui, sans-serif; }
.cos-modal h2 { margin: 0 32px 10px 0; color: #111827; font-size: 28px; line-height: 1.2; }
.cos-subtitle { margin: -3px 32px 12px 0; color: #334155; font-size: 18px; font-weight: 650; }
.cos-description { margin-bottom: 20px; color: #4b5563; }
.cos-description p { margin: 0 0 10px; }
.cos-close { position: absolute; top: 14px; right: 16px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: #f1f5f9; color: #334155; font-size: 25px; cursor: pointer; }
.cos-form > label:not(.cos-consent) { display: block; margin: 13px 0 5px; font-weight: 650; }
.cos-form input[type="email"], .cos-form input[type="tel"] { width: 100%; box-sizing: border-box; min-height: 46px; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #111827; font: inherit; }
.cos-form input:focus { outline: 3px solid rgba(37, 99, 235, .2); border-color: #2563eb; }
.cos-note { margin: 6px 0 14px; color: #64748b; font-size: 13px; }
.cos-consent { display: flex; align-items: flex-start; gap: 9px; font-size: 14px; cursor: pointer; }
.cos-consent input { flex: 0 0 auto; margin-top: 4px; }
.cos-submit { width: 100%; margin-top: 18px; padding: 12px 18px; border: 0; border-radius: 8px; background: #2563eb; color: #fff; font: 700 16px/1.4 system-ui, sans-serif; cursor: pointer; }
.cos-submit:hover { background: #1d4ed8; }
.cos-submit:disabled { opacity: .65; cursor: wait; }
.cos-message { min-height: 24px; margin-top: 10px; font-size: 14px; }
.cos-message.is-error { color: #b91c1c; }
.cos-message.is-success { color: #15803d; }
body.cos-modal-open { overflow: hidden; }
@media (max-width: 520px) { .cos-modal { padding: 26px 20px; } .cos-modal h2 { font-size: 24px; } }
@media (prefers-reduced-motion: no-preference) { .cos-modal { animation: cos-in .22s ease-out; } @keyframes cos-in { from { opacity: 0; transform: translateY(12px) scale(.98); } } }