*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #020101;--color-accent: #ffbc00;--color-text: #020101;--color-text-light: #666;--color-border: rgba(153, 153, 153, .1);--color-bg: #ffffff;--color-bg-alt: #f8f8f8;--color-button-bg: #32373c;--color-button-text: #fff;--font-family: "Roboto", sans-serif;--font-size-small: 13px;--font-size-base: 16px;--font-size-medium: 20px;--font-size-large: 36px;--font-size-xlarge: 42px;--spacing-xs: 10px;--spacing-sm: 15px;--spacing-md: 20px;--spacing-lg: 30px;--spacing-xl: 50px;--container-max-width: 1290px;--radius-sm: 10px;--radius-md: 20px;--radius-pill: 9999px}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.6;color:var(--color-text);background-color:var(--color-bg);min-height:100vh;display:flex;flex-direction:column}.container{width:100%;max-width:var(--container-max-width);margin:0 auto;padding:0 var(--spacing-md)}.header{background-color:var(--color-bg);border-bottom:1px solid var(--color-border);padding:var(--spacing-md) 0;position:sticky;top:0;z-index:999}.header-content{display:flex;align-items:center;justify-content:space-between}.logo{font-size:var(--font-size-medium);font-weight:700;color:var(--color-primary)}.main{flex:1;padding:var(--spacing-xl) 0}.hero{text-align:center;margin-bottom:var(--spacing-xl)}.hero-title{font-size:var(--font-size-large);font-weight:700;margin-bottom:var(--spacing-md);color:var(--color-primary)}.hero-subtitle{font-size:var(--font-size-medium);color:var(--color-text-light);margin-bottom:var(--spacing-lg)}.filters{margin-bottom:var(--spacing-lg);padding:var(--spacing-md);background-color:var(--color-bg-alt);border-radius:var(--radius-sm)}.filter-group{display:flex;align-items:center;gap:var(--spacing-sm)}.filter-label{font-weight:500;font-size:var(--font-size-base)}.filter-select{padding:10px 15px;border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-family);font-size:var(--font-size-base);background-color:var(--color-bg);cursor:pointer;min-width:200px}.filter-select:focus{outline:2px solid var(--color-accent);outline-offset:2px}.jobs-container{min-height:300px}.loading,.empty-state{text-align:center;padding:var(--spacing-xl);font-size:var(--font-size-medium);color:var(--color-text-light)}.jobs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.job-card{background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg);transition:transform .2s ease,box-shadow .2s ease;display:flex;flex-direction:column}.job-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001a}.job-title{font-size:24px;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-primary)}.job-meta{display:flex;flex-direction:column;gap:8px;margin-bottom:var(--spacing-md)}.job-meta-item{display:flex;align-items:center;gap:8px;font-size:var(--font-size-small);color:var(--color-text-light)}.job-meta-label{font-weight:500;color:var(--color-text)}.job-description{margin-bottom:var(--spacing-md);color:var(--color-text);font-size:var(--font-size-base);line-height:1.6;max-height:120px;overflow:hidden;position:relative}.job-description:after{content:"";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,transparent,var(--color-bg))}.job-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--spacing-md);margin-top:auto}.job-tag{padding:4px 12px;background-color:var(--color-bg-alt);border-radius:var(--radius-pill);font-size:var(--font-size-small);color:var(--color-text)}.job-details-btn{display:inline-block;padding:calc(.667em + 2px) calc(1.333em + 2px);background-color:var(--color-button-bg);color:var(--color-button-text);text-decoration:none;border-radius:var(--radius-pill);font-size:1.125em;font-weight:500;text-align:center;transition:background-color .2s ease,transform .2s ease;border:none;cursor:pointer;width:100%;margin-top:auto}.job-details-btn:hover{background-color:#1e2327;transform:scale(1.02)}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-sm);margin-top:var(--spacing-xl);flex-wrap:wrap}.pagination-btn{padding:10px 20px;background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-family);font-size:var(--font-size-base);cursor:pointer;transition:background-color .2s ease,border-color .2s ease}.pagination-btn:hover:not(:disabled){background-color:var(--color-bg-alt);border-color:var(--color-text-light)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-btn.active{background-color:var(--color-button-bg);color:var(--color-button-text);border-color:var(--color-button-bg)}.pagination-info{font-size:var(--font-size-base);color:var(--color-text-light)}.footer{background-color:var(--color-bg-alt);border-top:1px solid var(--color-border);padding:var(--spacing-lg) 0;margin-top:auto;text-align:center}.footer p{color:var(--color-text-light);font-size:var(--font-size-small)}@media(max-width:768px){:root{--font-size-large: 28px;--font-size-xlarge: 32px;--spacing-xl: 30px}.container{padding:0 var(--spacing-sm)}.jobs-grid{grid-template-columns:repeat(2,1fr)}.filter-group{flex-direction:column;align-items:flex-start}.filter-select{width:100%}.hero-title{font-size:var(--font-size-large)}.pagination{gap:8px}.pagination-btn{padding:8px 12px;font-size:var(--font-size-small)}}@media(max-width:480px){.logo{font-size:var(--font-size-base)}.jobs-grid{grid-template-columns:1fr}.pagination-info{width:100%;text-align:center}}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;opacity:0;transition:opacity .3s ease}.modal.active{display:block;opacity:1}.modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3}.modal-content{position:relative;background-color:var(--color-bg);max-width:1000px;max-height:90vh;margin:5vh auto;padding:var(--spacing-xl);border-radius:var(--radius-md);overflow-y:auto;z-index:10000;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close-btn{position:absolute;top:var(--spacing-md);right:var(--spacing-md);background:none;border:none;font-size:36px;line-height:1;color:var(--color-text-light);cursor:pointer;transition:color .2s ease;padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.modal-close-btn:hover{color:var(--color-text)}.modal-job-title{font-size:32px;font-weight:700;margin-bottom:var(--spacing-lg);color:var(--color-primary);padding-right:40px}.modal-job-description{margin-bottom:var(--spacing-lg);color:var(--color-text);font-size:var(--font-size-base);line-height:1.8}.modal-job-description h1,.modal-job-description h2,.modal-job-description h3,.modal-job-description h4{margin-top:var(--spacing-md);margin-bottom:var(--spacing-sm);color:var(--color-primary)}.modal-job-description p{margin-bottom:var(--spacing-sm)}.modal-job-description ul,.modal-job-description ol{margin-bottom:var(--spacing-sm);padding-left:var(--spacing-lg)}.modal-job-description li{margin-bottom:8px}.modal-apply-btn{display:inline-block;padding:calc(.667em + 2px) calc(1.333em + 2px);background-color:var(--color-button-bg);color:var(--color-button-text);text-decoration:none;border-radius:var(--radius-pill);font-size:1.125em;font-weight:500;text-align:center;transition:background-color .2s ease,transform .2s ease;border:none;cursor:pointer;width:100%}.modal-apply-btn:hover{background-color:#1e2327;transform:scale(1.02)}@media(max-width:768px){.modal-content{max-width:95%;margin:2.5vh auto;padding:var(--spacing-md);max-height:95vh}.modal-job-title{font-size:24px;padding-right:30px}.modal-close-btn{font-size:28px;width:32px;height:32px}}
