:root {
    --bg: #0a0d10;
    --panel: #11161b;
    --panel-2: #171d23;
    --line: rgba(255, 186, 31, .35);
    --gold: #ffb91f;
    --gold-2: #ffd66d;
    --text: #f8fafc;
    --muted: #a9b1bb;
    --danger: #ff6b6b;
    --success: #5fd39a;
    --radius: 20px;
    --shadow: 0 18px 50px rgba(0,0,0,.35);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at 85% 10%, rgba(255,185,31,.16), transparent 25%),
        linear-gradient(160deg, #090b0d 0%, #0d1217 45%, #080a0d 100%);
    color: var(--text);
    font-family: Tahoma, Arial, sans-serif;
    min-height: 100vh;
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
img { max-width: 100%; }

.container { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }

.site-header {
    min-height: 500px;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--line);
    background:
        linear-gradient(90deg, rgba(7,9,11,.98) 0%, rgba(7,9,11,.92) 42%, rgba(7,9,11,.50) 70%, rgba(7,9,11,.78) 100%),
        radial-gradient(circle at 80% 55%, rgba(255,185,31,.45), transparent 18%),
        linear-gradient(145deg, #252b31 0 52%, #101419 52% 100%);
}
.site-header::before,
.site-header::after {
    content: "";
    position: absolute;
    inset: auto -10% 0 auto;
    width: 68%;
    height: 65%;
    opacity: .72;
    pointer-events: none;
}
.site-header::before {
    background:
      linear-gradient(152deg, transparent 0 29%, rgba(255,185,31,.16) 29.5% 30%, transparent 30.5%),
      linear-gradient(25deg, transparent 0 38%, rgba(255,255,255,.08) 38.5% 39%, transparent 39.5%),
      linear-gradient(0deg, #171c21 0 28%, transparent 28%);
    clip-path: polygon(0 72%, 8% 64%, 18% 68%, 28% 52%, 38% 58%, 48% 35%, 59% 43%, 70% 18%, 84% 32%, 100% 12%, 100% 100%, 0 100%);
}
.site-header::after {
    width: 390px;
    height: 220px;
    right: 7%;
    bottom: 45px;
    border: 8px solid rgba(255,185,31,.65);
    border-radius: 28px 60px 24px 24px;
    transform: skewX(-7deg);
    box-shadow: -70px 70px 0 -45px rgba(255,185,31,.95), -160px 75px 0 -58px rgba(255,185,31,.75);
    opacity: .28;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 0;
    position: relative;
    z-index: 2;
}
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand-mark {
    width: 52px;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    font-weight: 900;
    font-size: 22px;
    color: #0c0d0f;
    background: linear-gradient(145deg, var(--gold-2), #e59300);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%);
    box-shadow: 0 0 30px rgba(255,185,31,.3);
}
.brand b { display:block; font-size: 18px; }
.brand small { display:block; color: var(--gold); letter-spacing: 2px; margin-top: 2px; }
.brand-small .brand-mark { width: 42px; }
.brand-small b { font-size: 15px; }
.brand-small small { font-size: 10px; }

.top-actions { display:flex; align-items:center; gap:10px; }
.btn {
    border: 1px solid var(--line);
    color: var(--text);
    background: rgba(255,255,255,.04);
    border-radius: 12px;
    padding: 12px 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 700;
    transition: .2s ease;
}
.btn:hover { transform: translateY(-2px); border-color: var(--gold); }
.btn-primary { color:#111; background: linear-gradient(135deg, var(--gold-2), var(--gold)); border-color: transparent; }
.btn-danger { background: rgba(255,107,107,.12); border-color: rgba(255,107,107,.5); color:#ffd1d1; }
.btn-sm { padding: 8px 11px; border-radius: 9px; font-size: 12px; }
.btn-block { width: 100%; }

.hero {
    padding: 50px 0 80px;
    position: relative;
    z-index: 2;
    max-width: 760px;
}
.eyebrow {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--gold-2);
    background: rgba(255,185,31,.07);
    font-size: 13px;
}
.hero h1 {
    margin: 20px 0 12px;
    font-size: clamp(38px, 6vw, 74px);
    line-height: 1.07;
    letter-spacing: -.8px;
}
.hero h1 span { color: var(--gold); display:block; direction:ltr; text-align:right; }
.hero p { color: #d8dde3; font-size: clamp(17px, 2vw, 22px); line-height: 1.8; max-width: 680px; }
.hero-stats { display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }
.hero-stat {
    min-width: 150px;
    background: rgba(12,15,18,.78);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 14px 16px;
    backdrop-filter: blur(8px);
}
.hero-stat b { display:block; font-size:25px; color:var(--gold); }
.hero-stat small { color:var(--muted); line-height:1.5; }

.search-wrap { margin-top:-42px; position:relative; z-index:5; }
.search-panel {
    background: rgba(17,22,27,.96);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 18px;
    box-shadow: var(--shadow);
    display:grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap:12px;
}
.field { display:flex; flex-direction:column; gap:7px; }
.field label { color:#e7ebef; font-size:13px; font-weight:700; line-height:1.5; }
.field label small { display:block; color:var(--muted); font-weight:400; direction:ltr; text-align:right; }
.input,
select,
textarea {
    width:100%;
    border:1px solid rgba(255,255,255,.11);
    background:#0d1216;
    color:var(--text);
    border-radius:12px;
    padding:13px 14px;
    outline:none;
}
.input:focus, select:focus, textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(255,185,31,.1); }
textarea { min-height:120px; resize:vertical; }

.main-section { padding: 62px 0 90px; }
.section-head { display:flex; justify-content:space-between; gap:20px; align-items:end; margin-bottom:22px; }
.section-head h2 { margin:0; font-size:32px; }
.section-head h2 span { display:block; color:var(--gold); direction:ltr; font-size:17px; margin-top:7px; }
.section-head p { color:var(--muted); margin:0; }

.jobs-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.job-card {
    background:linear-gradient(180deg, rgba(24,30,36,.97), rgba(13,17,21,.98));
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:0 15px 35px rgba(0,0,0,.18);
    transition:.22s ease;
    display:flex;
    flex-direction:column;
}
.job-card:hover { transform:translateY(-5px); border-color:var(--line); }
.job-card-top {
    padding:20px 20px 14px;
    position:relative;
    background:
      linear-gradient(135deg, rgba(255,185,31,.11), transparent 45%),
      rgba(255,255,255,.015);
}
.job-icon {
    width:48px; height:48px; display:grid; place-items:center;
    border-radius:14px; background:rgba(255,185,31,.1); color:var(--gold); border:1px solid var(--line); font-size:22px;
}
.job-openings { position:absolute; left:18px; top:18px; color:#111; background:var(--gold); border-radius:999px; padding:6px 10px; font-size:11px; font-weight:900; }
.job-card h3 { margin:16px 0 3px; font-size:23px; }
.job-title-en { color:var(--gold-2); direction:ltr; text-align:right; font-weight:700; }
.job-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.chip { background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.07); color:#dbe1e6; border-radius:999px; padding:7px 10px; font-size:11px; }
.job-body { padding:0 20px 18px; color:var(--muted); line-height:1.75; flex:1; }
.job-body .en { direction:ltr; text-align:left; font-size:13px; margin-top:5px; }
.job-actions { padding:14px 20px 20px; border-top:1px solid rgba(255,255,255,.06); display:flex; gap:10px; }
.job-actions .btn { flex:1; }

.empty-state { padding:50px 20px; text-align:center; border:1px dashed var(--line); border-radius:20px; color:var(--muted); grid-column:1/-1; }

.modal {
    position:fixed; inset:0; z-index:100;
    background:rgba(0,0,0,.75);
    display:none; align-items:center; justify-content:center;
    padding:20px;
    backdrop-filter:blur(8px);
}
.modal.open { display:flex; }
.modal-card {
    width:min(900px, 100%);
    max-height:92vh;
    overflow:auto;
    background:#11171c;
    border:1px solid var(--line);
    border-radius:24px;
    box-shadow:var(--shadow);
}
.modal-head { position:sticky; top:0; z-index:2; background:#11171c; display:flex; justify-content:space-between; align-items:center; padding:18px 22px; border-bottom:1px solid rgba(255,255,255,.08); }
.modal-head h2 { margin:0; font-size:22px; }
.close-modal { width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.12); background:transparent; color:#fff; font-size:24px; }
.modal-body { padding:22px; }
.details-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.detail-box { padding:16px; border:1px solid rgba(255,255,255,.08); border-radius:15px; background:rgba(255,255,255,.025); }
.detail-box h4 { color:var(--gold); margin:0 0 8px; }
.detail-box p { color:#d4d9de; line-height:1.75; margin:0; }
.detail-box .en { direction:ltr; text-align:left; margin-top:10px; color:var(--muted); }
.apply-divider { height:1px; background:linear-gradient(90deg, transparent, var(--line), transparent); margin:24px 0; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-grid .full { grid-column:1/-1; }
.check-row { display:flex; gap:10px; align-items:flex-start; color:#d6dce1; line-height:1.7; }
.check-row input { margin-top:5px; }
.helper { color:var(--muted); font-size:11px; line-height:1.5; margin-top:5px; }
.required { color:var(--gold); }

.flash { position:fixed; z-index:200; top:16px; left:50%; transform:translateX(-50%); min-width:min(520px, calc(100% - 30px)); padding:14px 18px; border-radius:12px; text-align:center; box-shadow:var(--shadow); }
.flash-success { background:#123525; border:1px solid #2b7b56; }
.flash-error { background:#401b1b; border:1px solid #9f4242; }
.flash-info { background:#1a2c42; border:1px solid #3b6ea8; }

.site-footer { border-top:1px solid rgba(255,255,255,.08); padding:30px 16px; text-align:center; color:var(--muted); }
.site-footer strong { color:var(--text); display:block; }
.site-footer span { color:var(--gold); direction:ltr; display:block; margin-top:3px; }
.site-footer p { margin-bottom:0; font-size:13px; }

/* Admin */
.admin-body { background:#0c1115; }
.admin-topbar {
    position:sticky; top:0; z-index:50;
    display:flex; justify-content:space-between; align-items:center; gap:20px;
    padding:13px 24px;
    background:rgba(10,14,18,.96);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(12px);
}
.admin-nav { display:flex; gap:5px; flex-wrap:wrap; }
.admin-nav a { padding:9px 13px; border-radius:10px; text-align:center; color:#dce2e7; font-size:12px; }
.admin-nav a:hover { background:rgba(255,185,31,.1); color:var(--gold-2); }
.admin-nav small { color:var(--muted); direction:ltr; }
.admin-main { width:min(1240px, calc(100% - 30px)); margin:30px auto 70px; }
.admin-title { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:20px; }
.admin-title h1 { margin:0; font-size:29px; }
.admin-title h1 small { display:block; color:var(--gold); font-size:14px; direction:ltr; margin-top:5px; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.stat-card { background:var(--panel); border:1px solid rgba(255,255,255,.08); border-radius:17px; padding:18px; }
.stat-card b { font-size:30px; color:var(--gold); display:block; }
.stat-card span { color:#e2e7eb; }
.stat-card small { display:block; color:var(--muted); direction:ltr; margin-top:4px; }
.admin-card { background:var(--panel); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:18px; margin-top:18px; overflow:auto; }
.admin-card h2 { margin-top:0; font-size:20px; }
.table { width:100%; border-collapse:collapse; min-width:850px; }
.table th, .table td { padding:12px 10px; border-bottom:1px solid rgba(255,255,255,.07); text-align:right; vertical-align:top; }
.table th { color:var(--gold-2); font-size:12px; background:rgba(255,185,31,.045); }
.table td { color:#e5e9ed; font-size:13px; }
.table td small { color:var(--muted); display:block; margin-top:4px; }
.table-actions { display:flex; gap:6px; flex-wrap:wrap; }
.badge { display:inline-flex; padding:6px 9px; border-radius:999px; font-size:11px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
.badge-open,.badge-hired,.badge-shortlisted { color:#9af0c4; border-color:rgba(95,211,154,.35); background:rgba(95,211,154,.08); }
.badge-new,.badge-screening,.badge-interview,.badge-offer { color:#ffe09a; border-color:rgba(255,185,31,.35); background:rgba(255,185,31,.08); }
.badge-closed,.badge-rejected { color:#ffb3b3; border-color:rgba(255,107,107,.35); background:rgba(255,107,107,.08); }
.admin-filter { display:grid; grid-template-columns:2fr 1fr 1fr auto; gap:10px; margin-bottom:15px; }
.login-shell { min-height:100vh; display:grid; place-items:center; padding:20px; }
.login-card { width:min(460px,100%); background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:26px; box-shadow:var(--shadow); }
.login-card .brand { margin-bottom:24px; }
.login-card h1 { margin-bottom:5px; }
.login-card > p { color:var(--muted); margin-top:0; }
.stack { display:grid; gap:14px; }
.form-section-title { grid-column:1/-1; margin:12px 0 -2px; color:var(--gold); border-bottom:1px solid rgba(255,185,31,.2); padding-bottom:9px; }
.note { padding:13px 15px; border-radius:12px; background:rgba(255,185,31,.07); border:1px solid var(--line); color:#f6dfad; line-height:1.7; }
.kv-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.kv { padding:13px; background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.07); border-radius:12px; }
.kv b { display:block; color:var(--gold-2); font-size:12px; margin-bottom:6px; }
.kv span { word-break:break-word; }

@media (max-width: 980px) {
    .jobs-grid { grid-template-columns:repeat(2,1fr); }
    .search-panel { grid-template-columns:1fr 1fr; }
    .search-panel .btn { width:100%; }
    .stats-grid { grid-template-columns:repeat(2,1fr); }
    .admin-filter { grid-template-columns:1fr 1fr; }
}
@media (max-width: 680px) {
    .topbar { align-items:flex-start; }
    .top-actions .btn:not(.btn-primary) { display:none; }
    .site-header { min-height:560px; }
    .hero { padding-top:35px; }
    .hero h1 span { text-align:right; }
    .search-wrap { margin-top:-24px; }
    .search-panel, .jobs-grid, .details-grid, .form-grid, .stats-grid, .admin-filter, .kv-grid { grid-template-columns:1fr; }
    .form-grid .full { grid-column:auto; }
    .section-head, .admin-title { align-items:flex-start; flex-direction:column; }
    .job-actions { flex-direction:column; }
    .admin-topbar { align-items:flex-start; flex-direction:column; }
    .admin-nav { width:100%; overflow-x:auto; flex-wrap:nowrap; }
    .admin-nav a { min-width:95px; }
}