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

:root{
  --primary:#003215;
  --primary-light:#668473;
  --primary-dark:#002811;
  --secondary:#1B365D;
  --secondary-soft:#8290A6;
  --accent:#EAC632;
  --accent-light:#F2DD84;
  --ink:#333333;
  --grey:#666666;
  --bg:#FAFAF7;
  --bg-soft:#F2F0E8;
  --border:#E4E1D6;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:'Inter',Arial,Helvetica,sans-serif;
  color:var(--ink);line-height:1.65;background:var(--bg);font-size:16px;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
h1,h2,h3{font-family:'Space Grotesk','Inter',Arial,sans-serif;}
a{color:var(--secondary);text-decoration:none;font-weight:600;}
.container{max-width:1160px;margin:0 auto;padding:0 20px;}

/* header / nav */
header{background:var(--primary);color:var(--bg);position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,.08);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1160px;margin:0 auto;}
.logo{display:inline-flex;align-items:center;gap:12px;color:var(--bg);}
.logo img{height:50px;width:auto;display:block;flex:0 0 auto;background:var(--bg);border-radius:10px;padding:7px;box-sizing:content-box;}
.logo-text{display:flex;flex-direction:column;line-height:1.2;}
.logo-name{font-size:27px;font-weight:700;letter-spacing:.5px;}
.logo-i{color:var(--accent);}
.logo-dot{color:var(--secondary-soft);}
.logo-tagline{font-size:11px;font-weight:500;letter-spacing:.2px;color:rgba(255,255,255,.72);}
.nav-links{display:flex;gap:32px;list-style:none;}
.nav-links a{color:var(--bg);font-weight:500;font-size:15px;letter-spacing:.2px;}
/* intentionally no :hover rule here — nav links must look identical on hover */
.nav-toggle{display:none;background:none;border:none;color:var(--bg);font-size:24px;cursor:pointer;}

/* hero */
.hero{
  position:relative;overflow:hidden;color:var(--bg);text-align:center;
  padding:150px 20px 130px;
  background-image:linear-gradient(160deg,rgba(0, 50, 21, 0.895),rgba(0, 40, 17, 0.933)),url('assets/hero-banner.jpg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(255, 255, 255, 0) 1px,transparent 1px);
  background-size:26px 26px;
}
.hero .container{position:relative;}
.hero h1{font-size:clamp(28px,4vw,42px);font-weight:700;letter-spacing:-.5px;margin-bottom:16px;max-width:820px;margin-left:auto;margin-right:auto;}
.hero p{font-size:15px;color:#c4b367;max-width:680px;margin:0 auto 30px;font-weight:700;}

.btn{display:inline-block;background:var(--bg);color:var(--primary);padding:13px 28px;border-radius:8px;font-weight:700;margin:6px;font-size:15px;border:2px solid var(--bg);}
.btn:hover{background:transparent;color:#fff;border-color:#fff;}
.btn.outline{background:transparent;border:2px solid #fff;color:#fff;}
.btn.outline:hover{background:#fff;color:var(--primary);}

/* sections */
section{padding:64px 20px;}
h2{color:var(--primary);font-size:28px;font-weight:700;letter-spacing:-.3px;margin-bottom:14px;padding-top:18px;position:relative;}
h2::before{content:"";position:absolute;top:0;left:0;width:44px;height:4px;border-radius:2px;background:var(--accent);}
h3{color:var(--primary);font-size:19px;font-weight:700;margin-bottom:8px;}
.lead{color:var(--grey);max-width:760px;margin-bottom:34px;font-size:16px;}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.card{position:relative;background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:32px 28px 28px;box-shadow:0 1px 3px rgba(16,24,40,.05);}
.card-index{
  position:absolute;top:-14px;left:24px;background:var(--primary);color:var(--bg);
  font-family:'Space Grotesk','Inter',sans-serif;font-weight:700;font-size:13px;letter-spacing:.5px;
  padding:4px 10px;border-radius:6px;
}
.card ul{margin:14px 0 0 20px;color:var(--grey);}
.card ul li{margin-bottom:8px;}

.tag-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.tag{background:var(--bg-soft);border:1px solid var(--border);color:var(--primary);padding:7px 16px;border-radius:20px;font-size:13px;font-weight:600;letter-spacing:.2px;}

.announcement-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-top:10px;}
.announcement-card{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:26px;box-shadow:0 1px 3px rgba(16,24,40,.05);display:flex;flex-direction:column;}
.announcement-card h3{margin-top:12px;}
.announcement-sector{color:var(--primary);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.3px;margin:6px 0;}
.announcement-meta{color:var(--grey);font-size:13px;margin-bottom:8px;}
.announcement-desc{color:var(--grey);font-size:14px;margin-bottom:8px;flex:1;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.announcement-toggle{display:none;background:none;border:none;color:var(--primary);font-weight:600;font-size:13px;cursor:pointer;padding:0;margin:0 0 14px;align-self:flex-start;}
.btn-apply{display:inline-block;background:var(--primary);color:#fff;padding:10px 20px;border-radius:8px;font-weight:700;font-size:14px;align-self:flex-start;}
.btn-apply:hover{background:var(--primary-light);}
.announcement-status{color:var(--grey);font-size:15px;grid-column:1/-1;}

.steps{counter-reset:step;list-style:none;position:relative;max-width:760px;}
.steps::before{content:"";position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:var(--border);}
.steps li{position:relative;padding:0 0 32px 56px;}
.steps li:last-child{padding-bottom:0;}
.steps li::before{
  counter-increment:step;content:counter(step);position:absolute;left:0;top:0;
  width:40px;height:40px;background:var(--primary);color:#fff;border-radius:10px;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;
  font-family:'Space Grotesk','Inter',sans-serif;z-index:1;
  box-shadow:0 0 0 3px rgba(234,198,50,.22);
}
.steps li strong{color:var(--ink);display:block;margin-bottom:4px;font-size:16px;}
.steps li span{color:var(--grey);display:block;}

.alt-bg{background:var(--bg-soft);}

/* forms */
form{max-width:640px;background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:34px;box-shadow:0 1px 3px rgba(16,24,40,.05);}
.form-row{margin-bottom:20px;}
label{display:block;font-weight:600;margin-bottom:7px;font-size:13px;color:var(--ink);text-transform:uppercase;letter-spacing:.4px;}
input[type=text],input[type=email],input[type=tel],input[type=number],select,textarea{
  width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:8px;font-size:15px;font-family:inherit;color:var(--ink);background:var(--bg);
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--secondary);box-shadow:0 0 0 3px rgba(27,54,93,.15);}
textarea{resize:vertical;min-height:100px;}
.required{color:#c0392b;}

.file-drop{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:28px 20px;border:2px dashed var(--border);border-radius:10px;
  background:var(--bg-soft);cursor:pointer;
}
.file-drop input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;}
.file-drop-icon{width:40px;height:40px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;margin-bottom:12px;box-shadow:0 1px 2px rgba(16,24,40,.06);}
.file-drop-icon::before{content:"";width:16px;height:16px;background:linear-gradient(135deg,var(--secondary-soft),var(--secondary));clip-path:polygon(50% 0%,100% 100%,50% 76%,0% 100%);}
.file-drop-text{font-size:14px;color:var(--grey);}
.file-drop-text strong{color:var(--secondary);font-weight:700;}
.file-drop-hint{display:inline-block;margin-top:4px;font-size:12px;color:#999691;}
.file-drop-name{margin-top:10px;font-size:13px;font-weight:600;color:var(--primary);word-break:break-all;padding:0 10px;}
.file-drop.dragover{border-color:var(--secondary);background:#EDEFF2;}
.file-drop.has-file{border-style:solid;border-color:var(--secondary);}
.submit-row{margin-top:26px;}
.submit-btn{background:var(--primary);color:#fff;border:none;padding:14px 32px;border-radius:8px;font-weight:700;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;}
.submit-btn:hover{background:var(--primary-light);}
.submit-btn:disabled{opacity:.6;cursor:not-allowed;}
.btn-spinner{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:btn-spin .7s linear infinite;}
.submit-btn.loading .btn-spinner{display:inline-block;}
@keyframes btn-spin{to{transform:rotate(360deg);}}
.form-msg{margin-top:18px;padding:13px 16px;border-radius:8px;font-size:14px;display:none;}
.form-msg.success{display:block;background:#e6f4ea;color:#1e7e34;border:1px solid #b9e0c3;}
.form-msg.error{display:block;background:#fdecea;color:#b3261e;border:1px solid #f6c1bc;}

.popup-overlay{position:fixed;inset:0;background:rgba(0,40,17,.55);display:none;align-items:center;justify-content:center;z-index:1000;padding:20px;}
.popup-overlay.open{display:flex;}
.popup-card{background:var(--bg);border-radius:14px;padding:36px 32px;max-width:380px;width:100%;text-align:center;box-shadow:0 20px 50px rgba(0,40,17,.35);animation:popup-in .25s ease-out;}
@keyframes popup-in{from{opacity:0;transform:translateY(12px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}

.popup-card.announcement-modal{position:relative;text-align:left;max-width:560px;max-height:80vh;overflow-y:auto;padding:40px 32px 32px;}
.popup-x{position:absolute;top:14px;right:14px;background:none;border:none;font-size:24px;line-height:1;color:var(--grey);cursor:pointer;padding:6px;}
.announcement-modal h3{margin-top:10px;}
.announcement-modal .announcement-meta{margin-bottom:14px;}
.announcement-full-desc{color:var(--grey);font-size:15px;line-height:1.7;margin-bottom:26px;white-space:pre-line;}
.popup-icon{position:relative;display:block;width:56px;height:56px;border-radius:50%;margin:0 auto 18px;}
.popup-icon.success{background:#E6F4EA;}
.popup-icon.success::before{content:"";position:absolute;left:19px;top:17px;width:20px;height:11px;border-left:3px solid #1E7E34;border-bottom:3px solid #1E7E34;transform:rotate(-45deg);}
.popup-icon.error{background:#FDECEA;}
.popup-icon.error::before,.popup-icon.error::after{content:"";position:absolute;left:16px;top:26px;width:24px;height:3px;border-radius:2px;background:#B3261E;}
.popup-icon.error::before{transform:rotate(45deg);}
.popup-icon.error::after{transform:rotate(-45deg);}
.popup-title{color:var(--primary);font-size:19px;margin-bottom:8px;}
.popup-text{color:var(--grey);font-size:14px;margin-bottom:24px;}
.popup-close{background:var(--primary);color:#fff;border:none;padding:10px 28px;border-radius:8px;font-weight:700;font-size:14px;cursor:pointer;}
.popup-close:hover{background:var(--primary-light);}

footer{background:var(--primary-dark);color:#CED7D3;font-size:14px;border-top:1px solid rgba(255,255,255,.06);}
footer a{color:#CED7D3;font-weight:600;}
footer strong{font-weight:600;}
.footer-grid{display:grid;grid-template-columns:0.8fr 1.1fr 1.1fr 1.1fr;gap:32px;text-align:left;padding:48px 20px 32px;}
.footer-col h4{color:var(--bg);font-size:15px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:16px;font-family:'Space Grotesk','Inter',sans-serif;}
.footer-col p{margin-bottom:8px;line-height:1.6;}
.footer-logo{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:16px;}
.footer-logo img{height:110px;width:auto;display:block;background:var(--bg);border-radius:16px;padding:13px;box-sizing:content-box;}
.footer-logo-name{color:var(--bg);font-size:46px;font-weight:700;letter-spacing:.5px;font-family:'Space Grotesk','Inter',sans-serif;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:16px 20px;text-align:center;font-size:13px;}
.footer-bottom p{margin:0;}

@media (max-width:760px){
  .grid-2{grid-template-columns:1fr;}
  .nav-links{position:fixed;top:64px;left:0;right:0;background:var(--primary);flex-direction:column;padding:16px 20px;gap:0;display:none;border-top:1px solid rgba(255,255,255,.08);}
  .nav-links.open{display:flex;}
  .nav-links a{display:block;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);}
  .nav-toggle{display:block;}
  .hero{padding:100px 20px 80px;}
  form{padding:24px;}
  .footer-grid{grid-template-columns:1fr;gap:28px;}
}
