/* =====================================================
   COMPLAINT HERO
===================================================== */
.complaint-hero{background:linear-gradient(135deg,#CD202C 0%,#B01B26 100%);padding:120px 0 80px;margin-top:72px;text-align:center}
.complaint-hero-content{max-width:800px;margin:0 auto;padding:0 32px}
.complaint-hero h1{font-family:'Nexa Demo',sans-serif;font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;color:#fff;margin-bottom:16px;letter-spacing:-0.02em;line-height:1.1}
.complaint-subtitle{font-family:'Figtree',sans-serif;font-size:20px;font-weight:500;color:rgba(255,255,255,.95);letter-spacing:-0.01em;margin:0 0 8px}
.complaint-desc{font-family:'Figtree',sans-serif;font-size:16px;font-weight:400;color:rgba(255,255,255,.85);letter-spacing:-0.01em;margin:0}

/* =====================================================
   COMPLAINT FORM SECTION
===================================================== */
.complaint-form-sec{padding:80px 0;background:#F3F4F6}
.complaint-container{max-width:800px;margin:0 auto;padding:0 32px}

.complaint-form-card{background:#fff;border-radius:16px;padding:60px;box-shadow:0 8px 32px rgba(0,0,0,.08)}

.complaint-form{display:flex;flex-direction:column;gap:24px}

.complaint-form .form-group{display:flex;flex-direction:column}

.complaint-form label{font-family:'Figtree',sans-serif;font-size:14px;font-weight:500;color:#0D0E48;margin-bottom:10px;display:flex;align-items:center;gap:8px}

.complaint-form label i{color:#CD202C;font-size:16px}

.complaint-form label .required{color:#CD202C;margin-left:2px}

.complaint-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}

.complaint-form input,
.complaint-form textarea{font-family:'Figtree',sans-serif;font-size:15px;padding:16px 18px;border:1.5px solid #D1D5DB;border-radius:8px;outline:none;transition:all .3s;background:#fff;color:#0D0E48}

.complaint-form input::placeholder,
.complaint-form textarea::placeholder{color:#9CA3AF}

.complaint-form input:focus,
.complaint-form textarea:focus{border-color:#CD202C;box-shadow:0 0 0 3px rgba(205,32,44,.1)}

.complaint-form textarea{resize:vertical;min-height:140px;font-family:'Figtree',sans-serif}

.form-actions{display:flex;justify-content:flex-end;margin-top:12px}

.btn-submit{font-family:'Figtree',sans-serif;font-size:16px;font-weight:700;color:#fff;background:#CD202C;border:none;padding:16px 48px;border-radius:8px;cursor:pointer;transition:all .3s;box-shadow:0 4px 16px rgba(205,32,44,.3);text-transform:uppercase;letter-spacing:0.5px}

.btn-submit:hover{background:#B01B26;box-shadow:0 6px 24px rgba(205,32,44,.4);transform:translateY(-2px)}

/* =====================================================
   RESPONSIVE
===================================================== */
@media(max-width:768px){
  .complaint-hero{padding:100px 0 60px}
  .complaint-hero h1{font-size:2rem}
  .complaint-subtitle{font-size:18px}
  .complaint-desc{font-size:15px}
  
  .complaint-form-sec{padding:60px 0}
  .complaint-container{padding:0 20px}
  .complaint-form-card{padding:40px 24px}
  
  .complaint-form .form-row{grid-template-columns:1fr}
}

@media(max-width:520px){
  .complaint-hero{padding:80px 0 40px}
  .complaint-hero h1{font-size:1.75rem}
  .complaint-form-card{padding:32px 20px}
  .btn-submit{width:100%;padding:14px 32px}
}
