@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

.cif-form-container {
    --cif-radius:12px; --cif-border:#e2e6ea; --cif-bg-field:#f8f9fb;
    --cif-text:#1a1d23; --cif-muted:#6b7280; --cif-err-clr:#dc2626; --cif-success:#16a34a;
    font-family:'DM Sans',sans-serif; max-width:780px; margin:0 auto;
    background:#fff; border-radius:20px; box-shadow:0 8px 40px rgba(0,0,0,.08); padding:40px 44px;
}
.cif-form-header { margin-bottom:28px; padding-bottom:20px; border-bottom:1px solid var(--cif-border); }
.cif-form-header h2 { margin:0 0 4px; font-size:22px; font-weight:700; color:var(--cif-text); }
.cif-form-header p  { margin:0; color:var(--cif-muted); font-size:14px; }
.cif-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px 24px; }
.cif-field { display:flex; flex-direction:column; gap:6px; }
.cif-full  { grid-column:1/-1; }
.cif-field label { font-size:13px; font-weight:600; color:var(--cif-text); }
.cif-req  { color:var(--cif-primary); }
.cif-opt  { color:var(--cif-muted); font-weight:400; font-size:11px; }
.cif-field input,.cif-field textarea,.cif-field select {
    width:100%; padding:11px 14px; background:var(--cif-bg-field); border:1.5px solid var(--cif-border);
    border-radius:var(--cif-radius); font-family:inherit; font-size:14px; color:var(--cif-text);
    transition:border-color .18s,box-shadow .18s; outline:none; box-sizing:border-box; -webkit-appearance:none; appearance:none;
}
.cif-field input:focus,.cif-field textarea:focus,.cif-field select:focus { border-color:var(--cif-primary); box-shadow:0 0 0 3px rgba(34,113,177,.15); background:#fff; }
.cif-field input.cif-invalid,.cif-field textarea.cif-invalid,.cif-field select.cif-invalid { border-color:var(--cif-err-clr); box-shadow:0 0 0 3px rgba(220,38,38,.1); }
.cif-field input.cif-valid,.cif-field textarea.cif-valid,.cif-field select.cif-valid { border-color:var(--cif-success); }
.cif-field textarea { resize:vertical; min-height:90px; line-height:1.55; }
.cif-select-wrap { position:relative; }
.cif-select-wrap::after { content:''; pointer-events:none; position:absolute; right:14px; top:50%; transform:translateY(-50%); width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid var(--cif-muted); }
.cif-select-wrap select { padding-right:36px; cursor:pointer; }
.cif-price-wrap { position:relative; }
.cif-price-sym { position:absolute; left:14px; top:50%; transform:translateY(-50%); font-size:14px; font-weight:600; color:var(--cif-muted); pointer-events:none; }
.cif-price-wrap input { padding-left:28px; }
.cif-err { font-size:11.5px; color:var(--cif-err-clr); min-height:16px; font-weight:500; }
.cif-submit-row { margin-top:28px; display:flex; justify-content:flex-end; }
.cif-submit-btn { background:var(--cif-primary); color:#fff; border:none; padding:13px 32px; border-radius:10px; font-family:inherit; font-size:15px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:10px; transition:opacity .18s,transform .12s; box-shadow:0 4px 14px rgba(34,113,177,.35); }
.cif-submit-btn:hover { opacity:.9; transform:translateY(-1px); }
.cif-submit-btn:disabled { opacity:.6; cursor:not-allowed; transform:none; }
@keyframes cif-spin { to { transform:rotate(360deg); } }
.cif-btn-loader svg { animation:cif-spin .7s linear infinite; }
.cif-message { margin-top:20px; padding:14px 18px; border-radius:var(--cif-radius); font-size:14px; font-weight:500; }
.cif-message.success { background:#f0fdf4; border:1.5px solid #bbf7d0; color:var(--cif-success); }
.cif-message.error   { background:#fef2f2; border:1.5px solid #fecaca; color:var(--cif-err-clr); }
.cif-form-success { text-align:center; padding:60px 40px; animation:cif-fade-in .4s ease; }
.cif-form-success .cif-check { width:68px; height:68px; border-radius:50%; background:rgba(34,113,177,.1); display:inline-flex; align-items:center; justify-content:center; margin-bottom:20px; }
.cif-form-success .cif-check svg { width:32px; height:32px; }
.cif-form-success h3 { font-size:22px; font-weight:700; color:var(--cif-text); margin:0 0 10px; }
.cif-form-success p  { font-size:15px; color:var(--cif-muted); margin:0; }
@keyframes cif-fade-in { from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:translateY(0);} }
@media (max-width:600px){
    .cif-form-container { padding:24px 18px; border-radius:14px; }
    .cif-form-grid { grid-template-columns:1fr; }
    .cif-submit-btn { width:100%; justify-content:center; }
}
