.hr-hero,.payroll-hero{background:linear-gradient(125deg,#eff4ff,#fff,#f5efff);border:1px solid #d8ddf0;border-radius:28px;padding:28px 34px;display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.hr-hero h1,.payroll-hero h1{font-weight:900;color:#172844;margin:5px 0}.hr-hero p,.payroll-hero p{color:#6c7990;margin:0}.hr-hero>strong,.payroll-hero>strong{font-size:28px}.hr-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.hr-metrics article{display:flex;gap:13px;background:#fff;border:1px solid #e0e6f0;border-radius:20px;padding:17px;font-size:27px}.hr-metrics div{display:grid}.hr-metrics small{font-size:12px;color:#748197}.hr-metrics strong{font-size:20px}.employee-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}.employee-grid article{display:flex;gap:13px;align-items:flex-start;background:#fff;border:1px solid #dfe6f0;border-radius:21px;padding:17px}.employee-grid article>span{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#eaf1ff;color:#263f76;font-size:20px;font-weight:900}.employee-grid article div{display:grid;flex:1}.employee-grid h3{font-size:16px;margin:2px 0}.employee-grid em{font-style:normal;color:#758197}.profile-data{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:20px}.profile-data article{display:grid;background:#fff;border-radius:17px;border:1px solid #dfe6f0;padding:15px}.payroll-form{max-width:850px;margin:auto;background:#fff;border:1px solid #dfe6f0;border-radius:24px;padding:26px}.payroll-receipt{max-width:900px;margin:auto;background:#fff;border:1px solid #dfe6f0;border-radius:22px;padding:32px}.payroll-receipt header{display:flex;align-items:center;gap:17px;border-bottom:3px solid #27375a;padding-bottom:18px}.payroll-receipt header img{width:70px}.payroll-receipt header div{flex:1}.receipt-employee{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin:20px 0}.receipt-employee div{display:grid;background:#f2f5f9;border-radius:13px;padding:12px}.payroll-receipt table{width:100%;border-collapse:collapse}.payroll-receipt th,.payroll-receipt td{padding:11px;border-bottom:1px solid #dfe5ec}.receipt-net{display:flex;align-items:center;gap:15px;justify-content:flex-end;margin-top:20px}.receipt-net strong{font-size:29px}.payroll-receipt footer{display:flex;justify-content:space-around;margin-top:65px}.payroll-receipt footer span{border-top:1px solid #333;padding:8px 45px}@media(max-width:800px){.hr-metrics,.profile-data,.receipt-employee{grid-template-columns:repeat(2,1fr)}}@media(max-width:550px){.hr-hero,.payroll-hero{align-items:flex-start;flex-direction:column}.hr-metrics,.profile-data,.receipt-employee{grid-template-columns:1fr}}@media print{.payroll-receipt{border:0;max-width:none}}
