/*
Theme Name: Guru Mauli Prostaff Services
Theme URI: https://gurumaulipss.com
Author: Guru Mauli Prostaff Services
Author URI: https://gurumaulipss.com
Description: Complete WordPress theme for Guru Mauli Prostaff Services — IT & Non-IT Recruitment. Features Home, About, Services, Career, Contact pages with Guest Registration, Job Applications, and Admin Job Management.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gmpss
Tags: business, recruitment, staffing, hr, responsive, custom-menu
*/

/* =====================================================
   CSS VARIABLES
===================================================== */
:root {
  --orange:        #F07B24;
  --orange-dark:   #D4651A;
  --orange-light:  #F5A05A;
  --orange-pale:   #FEF3E8;
  --dark:          #1A1A1A;
  --dark-2:        #2D2D2D;
  --gray-800:      #3D3D3D;
  --gray-700:      #555555;
  --gray-600:      #777777;
  --gray-300:      #DDDDDD;
  --gray-100:      #F5F5F5;
  --white:         #FFFFFF;
  --text-body:     #4A4A4A;
  --text-heading:  #1A1A1A;
  --gradient-hero: linear-gradient(135deg, #1A1A1A 0%, #2D2D2D 50%, #3A2010 100%);
  --gradient-btn:  linear-gradient(135deg, #F07B24, #D4651A);
  --gradient-card: linear-gradient(135deg, #F07B24 0%, #F5A05A 100%);
  --shadow-sm:     0 2px 8px rgba(240,123,36,0.08);
  --shadow-md:     0 8px 32px rgba(240,123,36,0.15);
  --shadow-lg:     0 16px 48px rgba(240,123,36,0.2);
  --radius:        12px;
  --radius-lg:     20px;
  --transition:    all 0.3s ease;
  --font-heading:  'Poppins', sans-serif;
  --font-body:     'Inter', sans-serif;
}

/* =====================================================
   RESET & BASE
===================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); font-size: 16px; color: var(--text-body); line-height: 1.6; background: var(--white); overflow-x: hidden; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); color: var(--text-heading); line-height: 1.2; font-weight: 700; }
a { text-decoration: none; color: inherit; transition: var(--transition); }
img { max-width: 100%; height: auto; }
ul { list-style: none; }
.container { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.section-pad { padding: 80px 0; }

/* =====================================================
   BUTTONS
===================================================== */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 28px; border-radius: 50px;
  font-family: var(--font-heading); font-weight: 600; font-size: 0.92rem;
  cursor: pointer; transition: var(--transition); border: none; text-decoration: none;
}
.btn-orange { background: var(--gradient-btn); color: var(--white); box-shadow: 0 4px 18px rgba(240,123,36,0.4); }
.btn-orange:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(240,123,36,0.5); color: var(--white); }
.btn-outline-white { background: transparent; color: var(--white); border: 2px solid rgba(255,255,255,0.55); }
.btn-outline-white:hover { background: rgba(255,255,255,0.1); border-color: var(--white); color: var(--white); }
.btn-outline-orange { background: transparent; color: var(--orange); border: 2px solid var(--orange); }
.btn-outline-orange:hover { background: var(--orange); color: var(--white); }
.btn-white { background: var(--white); color: var(--orange); font-weight: 700; }
.btn-white:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); }

/* =====================================================
   SECTION TITLES
===================================================== */
.section-title { text-align: center; margin-bottom: 52px; }
.section-title h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin-bottom: 12px; }
.section-title p { color: var(--gray-600); max-width: 580px; margin: 0 auto 16px; font-size: 0.95rem; }
.divider-orange { width: 52px; height: 4px; background: var(--gradient-btn); border-radius: 2px; margin: 0 auto; }

/* =====================================================
   HEADER / NAVBAR
===================================================== */
#masthead {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: rgba(255,255,255,0.97);
  box-shadow: 0 2px 20px rgba(240,123,36,0.1);
  backdrop-filter: blur(10px);
}
.navbar { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; }
.site-logo { display: flex; align-items: center; gap: 12px; }
.site-logo img { height: 52px; width: auto; object-fit: contain; }
.logo-text-wrap { display: flex; flex-direction: column; line-height: 1.1; }
.logo-name { font-family: var(--font-heading); font-weight: 800; font-size: 1rem; color: var(--dark); }
.logo-sub { font-size: 0.7rem; font-weight: 600; color: var(--orange); text-transform: uppercase; letter-spacing: 1px; }

.nav-menu { display: flex; align-items: center; gap: 4px; }
.nav-menu a { padding: 8px 14px; font-family: var(--font-heading); font-size: 0.88rem; font-weight: 500; color: var(--gray-700); border-radius: 8px; }
.nav-menu a:hover, .nav-menu a.current { color: var(--orange); }
.nav-menu a.current { background: var(--orange-pale); }
.nav-cta { background: var(--gradient-btn) !important; color: var(--white) !important; padding: 9px 20px !important; border-radius: 50px !important; font-weight: 600 !important; }
.nav-cta:hover { opacity: 0.9; transform: translateY(-1px); }

.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 8px; background: none; border: none; }
.hamburger span { display: block; width: 24px; height: 2px; background: var(--dark); border-radius: 2px; transition: var(--transition); }
.hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* =====================================================
   HERO
===================================================== */
.hero {
  background: var(--gradient-hero);
  min-height: 600px; display: flex; align-items: center;
  padding: 130px 0 90px; position: relative; overflow: hidden;
}
.hero::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 80% 50%, rgba(240,123,36,0.18) 0%, transparent 60%);
}
.hero::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 6px; background: var(--gradient-btn);
}
.hero-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; position: relative; z-index: 1; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(240,123,36,0.15); border: 1px solid rgba(240,123,36,0.35);
  padding: 6px 16px; border-radius: 50px; margin-bottom: 20px;
  font-size: 0.78rem; font-weight: 600; color: var(--orange-light); text-transform: uppercase; letter-spacing: 1px;
}
.hero-badge::before { content: '●'; font-size: 0.5rem; animation: pulse 1.5s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.3} }
.hero h1 { font-size: clamp(2rem, 4vw, 3.2rem); color: var(--white); font-weight: 800; margin-bottom: 20px; line-height: 1.15; }
.hero h1 span { color: var(--orange); }
.hero p { color: rgba(255,255,255,0.78); font-size: 1rem; margin-bottom: 32px; line-height: 1.8; }
.hero-btns { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-right { display: flex; flex-direction: column; gap: 16px; }
.hero-stat-card {
  background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius); padding: 20px 24px;
  display: flex; align-items: center; gap: 16px;
  backdrop-filter: blur(8px); transition: var(--transition);
}
.hero-stat-card:hover { background: rgba(240,123,36,0.12); border-color: rgba(240,123,36,0.3); transform: translateX(6px); }
.hsc-icon { width: 48px; height: 48px; border-radius: 12px; background: var(--gradient-btn); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; flex-shrink: 0; }
.hsc-num { font-family: var(--font-heading); font-size: 1.6rem; font-weight: 800; color: var(--white); line-height: 1; }
.hsc-label { font-size: 0.8rem; color: rgba(255,255,255,0.6); margin-top: 3px; }

/* =====================================================
   TICKER / MARQUEE
===================================================== */
.ticker-wrap { background: var(--orange); padding: 12px 0; overflow: hidden; }
.ticker-inner { display: flex; gap: 0; animation: ticker 30s linear infinite; white-space: nowrap; }
.ticker-item { color: white; font-size: 0.85rem; font-weight: 600; padding: 0 32px; display: flex; align-items: center; gap: 10px; }
.ticker-item::after { content: '◆'; color: rgba(255,255,255,0.5); font-size: 0.5rem; }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* =====================================================
   STATS STRIP
===================================================== */
.stats-strip { background: var(--white); padding: 56px 0; }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.stat-card {
  text-align: center; padding: 28px 20px;
  border-radius: var(--radius); border: 1px solid var(--gray-300);
  transition: var(--transition); position: relative; overflow: hidden;
}
.stat-card::before { content:''; position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-btn); }
.stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--orange-light); }
.stat-icon-sq { width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 4px 12px rgba(240,123,36,0.25); }
.stat-number { font-family:var(--font-heading);font-size:2.2rem;font-weight:800;color:var(--text-heading);line-height:1;margin-bottom:6px; }
.stat-label { font-size:0.83rem;color:var(--gray-600); }

/* =====================================================
   SERVICES
===================================================== */
.services-section { background: var(--gray-100); }
.services-tabs { display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:40px; }
.svc-tab {
  padding:10px 22px;border-radius:50px;
  font-family:var(--font-heading);font-weight:600;font-size:0.88rem;
  cursor:pointer;border:2px solid var(--gray-300);background:var(--white);
  color:var(--gray-700);transition:var(--transition);
}
.svc-tab.active, .svc-tab:hover { background:var(--gradient-btn);border-color:var(--orange);color:var(--white); }
.services-panel { display:none; }
.services-panel.active { display:block; }
.services-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.service-card {
  background:var(--white);border-radius:var(--radius);padding:28px 24px;
  border:1px solid var(--gray-300);transition:var(--transition);
}
.service-card:hover { transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--orange-light); }
.service-card.featured { border:2px solid var(--orange);box-shadow:var(--shadow-sm); }
.svc-icon { width:50px;height:50px;border-radius:13px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;box-shadow:0 4px 12px rgba(240,123,36,0.2); }
.service-card h3 { font-size:1rem;font-weight:700;margin-bottom:8px;color:var(--text-heading); }
.service-card p { font-size:0.85rem;color:var(--gray-600);line-height:1.65; }

/* =====================================================
   WHY CHOOSE US
===================================================== */
.why-section { background:var(--white); }
.why-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.why-card {
  background:var(--white);border:1px solid var(--gray-300);
  border-radius:var(--radius);padding:22px;
  display:flex;align-items:flex-start;gap:14px;
  transition:var(--transition);
}
.why-card:hover { box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--orange-light); }
.why-icon { width:40px;height:40px;min-width:40px;border-radius:10px;background:var(--gradient-btn);display:flex;align-items:center;justify-content:center; }
.why-card h4 { font-size:0.9rem;font-weight:700;margin-bottom:4px;color:var(--text-heading); }
.why-card p { font-size:0.83rem;color:var(--gray-600);line-height:1.6; }

/* =====================================================
   ABOUT STRIP
===================================================== */
.about-strip { background:var(--dark);padding:80px 0; }
.about-strip-inner { display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center; }
.about-strip h2 { color:var(--white);font-size:clamp(1.6rem,2.8vw,2.2rem);margin-bottom:18px; }
.about-strip h2 span { color:var(--orange); }
.about-strip p { color:rgba(255,255,255,0.7);line-height:1.8;margin-bottom:14px;font-size:0.93rem; }
.about-points { margin-top:24px;display:flex;flex-direction:column;gap:10px; }
.about-point { display:flex;align-items:center;gap:10px;color:rgba(255,255,255,0.85);font-size:0.88rem; }
.about-point::before { content:'✓';min-width:22px;height:22px;background:var(--gradient-btn);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.7rem;font-weight:700;color:white; }
.about-cards { display:flex;flex-direction:column;gap:16px; }
.about-card {
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--radius);padding:20px 24px;
  display:flex;align-items:center;gap:16px;
  transition:var(--transition);
}
.about-card:hover { background:rgba(240,123,36,0.1);border-color:rgba(240,123,36,0.3); }
.ac-icon { width:44px;height:44px;border-radius:11px;background:var(--gradient-btn);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.ac-title { color:var(--white);font-family:var(--font-heading);font-weight:700;font-size:0.95rem; }
.ac-desc { color:rgba(255,255,255,0.6);font-size:0.82rem;margin-top:3px; }

/* =====================================================
   ROLES WE HIRE
===================================================== */
.roles-section { background:var(--orange-pale); }
.roles-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:32px; }
.roles-col h3 { font-size:1.15rem;font-weight:700;margin-bottom:20px;display:flex;align-items:center;gap:10px; }
.roles-col h3 .col-icon { width:36px;height:36px;border-radius:9px;background:var(--gradient-btn);display:flex;align-items:center;justify-content:center; }
.role-pills { display:flex;flex-wrap:wrap;gap:10px; }
.role-pill {
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 16px;background:var(--white);
  border:1px solid rgba(240,123,36,0.2);border-radius:50px;
  font-size:0.83rem;font-weight:600;color:var(--text-heading);
  transition:var(--transition);cursor:default;
}
.role-pill:hover { background:var(--orange);color:var(--white);border-color:var(--orange); }
.role-pill::before { content:'▸';color:var(--orange);font-size:0.7rem; }
.role-pill:hover::before { color:rgba(255,255,255,0.8); }

/* =====================================================
   CTA SECTION
===================================================== */
.cta-section { background:var(--gradient-btn);padding:80px 0;text-align:center;position:relative;overflow:hidden; }
.cta-section::before { content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='20'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.cta-section h2 { color:var(--white);font-size:clamp(1.8rem,3vw,2.5rem);margin-bottom:14px;position:relative; }
.cta-section p { color:rgba(255,255,255,0.88);margin-bottom:36px;font-size:0.98rem;position:relative; }
.cta-info-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:700px;margin:0 auto 36px;position:relative; }
.cta-info-box { background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.2);border-radius:var(--radius);padding:18px 16px;text-align:center;backdrop-filter:blur(8px); }
.cta-info-box .cib-icon { font-size:1.4rem;margin-bottom:8px; }
.cta-info-box .cib-label { color:rgba(255,255,255,0.65);font-size:0.73rem;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px; }
.cta-info-box .cib-val { color:var(--white);font-weight:700;font-size:0.9rem; }

/* =====================================================
   FOOTER
===================================================== */
#colophon { background:#111;padding:64px 0 0; }
.footer-grid { display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,0.08); }
.footer-brand img { height:56px;margin-bottom:16px; }
.footer-brand p { color:rgba(255,255,255,0.5);font-size:0.85rem;line-height:1.7;margin-bottom:20px; }
.social-row { display:flex;gap:10px; }
.social-btn { width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,0.07);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.55);font-size:0.82rem;font-weight:700;transition:var(--transition); }
.social-btn:hover { background:var(--orange);color:white; }
.footer-col h4 { color:var(--white);font-size:0.95rem;font-weight:700;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid var(--orange);display:inline-block; }
.footer-col ul li { margin-bottom:10px; }
.footer-col ul li a { color:rgba(255,255,255,0.5);font-size:0.85rem;display:flex;align-items:center;gap:6px; }
.footer-col ul li a:hover { color:var(--orange); }
.footer-col ul li a::before { content:'›';color:var(--orange); }
.footer-contact-item { display:flex;align-items:flex-start;gap:10px;margin-bottom:14px; }
.fci-icon { width:32px;height:32px;border-radius:8px;background:rgba(240,123,36,0.15);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.fci-val { color:rgba(255,255,255,0.65);font-size:0.83rem;line-height:1.5; }
.fci-val a { color:var(--orange); }
.footer-bottom { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:20px 0; }
.footer-bottom p { color:rgba(255,255,255,0.35);font-size:0.8rem; }
.footer-bottom-links { display:flex;gap:20px; }
.footer-bottom-links a { color:rgba(255,255,255,0.35);font-size:0.8rem; }
.footer-bottom-links a:hover { color:var(--orange); }

/* =====================================================
   CAREER PAGE
===================================================== */
.page-hero { background:var(--gradient-hero);padding:120px 0 64px;text-align:center;position:relative;overflow:hidden; }
.page-hero::after { content:'';position:absolute;bottom:0;left:0;right:0;height:5px;background:var(--gradient-btn); }
.page-hero::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 60%,rgba(240,123,36,0.2) 0%,transparent 65%); }
.page-hero-inner { position:relative;z-index:1; }
.page-hero h1 { color:var(--white);font-size:clamp(2rem,4vw,3rem);margin-bottom:14px; }
.page-hero h1 span { color:var(--orange); }
.page-hero p { color:rgba(255,255,255,0.75);max-width:560px;margin:0 auto 28px;font-size:0.97rem; }

.jobs-section { background:var(--gray-100);padding:72px 0; }
.jobs-filter { display:flex;gap:12px;flex-wrap:wrap;margin-bottom:36px;align-items:center; }
.jobs-filter input { flex:1;min-width:200px;padding:12px 18px;border:1.5px solid var(--gray-300);border-radius:50px;font-family:var(--font-body);font-size:0.9rem;outline:none;transition:var(--transition); }
.jobs-filter input:focus { border-color:var(--orange); }
.jobs-filter select { padding:12px 18px;border:1.5px solid var(--gray-300);border-radius:50px;font-family:var(--font-body);font-size:0.9rem;outline:none;cursor:pointer;background:var(--white);transition:var(--transition); }
.jobs-filter select:focus { border-color:var(--orange); }

.jobs-grid { display:grid;gap:20px; }
.job-card { background:var(--white);border:1.5px solid var(--gray-300);border-radius:var(--radius);padding:26px;display:flex;align-items:flex-start;gap:18px;transition:var(--transition);position:relative; }
.job-card:hover { border-color:var(--orange);box-shadow:var(--shadow-md);transform:translateY(-2px); }
.job-card-icon { width:54px;height:54px;min-width:54px;background:var(--orange-pale);border:1px solid rgba(240,123,36,0.2);border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.4rem; }
.job-card-info { flex:1; }
.job-card-info h3 { font-size:1.05rem;font-weight:700;margin-bottom:4px;color:var(--text-heading); }
.job-card-info h3 a { color:inherit; }
.job-card-info h3 a:hover { color:var(--orange); }
.job-meta { display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 12px; }
.jbadge { display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:50px;font-size:0.77rem;font-weight:600; }
.jbadge-type { background:rgba(240,123,36,0.1);color:var(--orange); }
.jbadge-loc { background:rgba(59,130,246,0.08);color:#2563EB; }
.jbadge-sal { background:rgba(16,185,129,0.08);color:#059669; }
.jbadge-exp { background:rgba(139,92,246,0.08);color:#7C3AED; }
.job-desc { font-size:0.87rem;color:var(--gray-600);margin-bottom:12px;line-height:1.65; }
.job-skills { display:flex;gap:7px;flex-wrap:wrap; }
.job-skill { padding:3px 10px;background:var(--gray-100);border-radius:50px;font-size:0.75rem;color:var(--gray-700);font-weight:500; }
.job-actions { display:flex;flex-direction:column;align-items:flex-end;gap:8px; }
.job-date { font-size:0.77rem;color:var(--gray-600); }
.admin-job-btns { display:flex;gap:6px;margin-top:6px; }
.admin-edit-btn, .admin-del-btn { padding:6px 13px;border-radius:6px;font-size:0.77rem;font-weight:600;cursor:pointer;border:none;transition:var(--transition); }
.admin-edit-btn { background:rgba(240,123,36,0.1);color:var(--orange); }
.admin-edit-btn:hover { background:var(--orange);color:white; }
.admin-del-btn { background:rgba(239,68,68,0.08);color:#DC2626; }
.admin-del-btn:hover { background:#DC2626;color:white; }
.no-jobs { text-align:center;padding:72px 20px;color:var(--gray-600); }
.no-jobs .nj-icon { font-size:3.5rem;margin-bottom:16px; }
.no-jobs h3 { font-size:1.2rem;color:var(--text-heading);margin-bottom:8px; }

/* =====================================================
   SINGLE JOB DETAIL
===================================================== */
.job-detail-hero { background:var(--gradient-hero);padding:120px 0 60px;position:relative; }
.job-detail-hero::after { content:'';position:absolute;bottom:0;left:0;right:0;height:5px;background:var(--gradient-btn); }
.job-detail-hero::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 50%,rgba(240,123,36,0.18) 0%,transparent 60%); }
.jd-breadcrumb { color:rgba(255,255,255,0.55);font-size:0.83rem;margin-bottom:20px;position:relative; }
.jd-breadcrumb a { color:rgba(255,255,255,0.55); }
.jd-breadcrumb a:hover { color:var(--orange); }
.jd-header { display:flex;align-items:flex-start;gap:20px;position:relative; }
.jd-logo { width:70px;height:70px;min-width:70px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:2rem;backdrop-filter:blur(8px); }
.jd-title-wrap h1 { color:white;font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:8px; }
.jd-metas { display:flex;flex-wrap:wrap;gap:10px;margin-top:12px; }
.jd-meta-badge { display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:50px;font-size:0.79rem;font-weight:600;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.18);color:rgba(255,255,255,0.88);backdrop-filter:blur(6px); }

.jd-layout { display:grid;grid-template-columns:1fr 330px;gap:30px;align-items:start; }
.jd-main { background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden; }
.jd-section { padding:30px;border-bottom:1px solid var(--gray-300); }
.jd-section:last-child { border-bottom:none; }
.jd-section h2 { font-size:1.05rem;font-weight:700;margin-bottom:16px;display:flex;align-items:center;gap:8px;color:var(--text-heading); }
.jd-section h2::before { content:'';width:4px;height:18px;background:var(--gradient-btn);border-radius:2px; }
.jd-content { font-size:0.9rem;color:var(--text-body);line-height:1.8; }
.jd-content p { margin-bottom:10px; }
.jd-list li { padding:5px 0;font-size:0.88rem;color:var(--text-body);display:flex;align-items:flex-start;gap:8px; }
.jd-list li::before { content:'✓';color:var(--orange);font-weight:700;min-width:14px; }
.skills-wrap { display:flex;flex-wrap:wrap;gap:8px; }
.skill-pill { padding:5px 14px;background:var(--orange-pale);border:1px solid rgba(240,123,36,0.2);border-radius:50px;font-size:0.79rem;font-weight:600;color:var(--orange); }

.jd-sidebar { display:flex;flex-direction:column;gap:18px; }
.jds-card { background:var(--white);border-radius:var(--radius);box-shadow:0 2px 12px rgba(0,0,0,0.06);border:1px solid var(--gray-300); }
.jds-head { padding:16px 20px;border-bottom:1px solid var(--gray-300);font-family:var(--font-heading);font-weight:700;font-size:0.92rem;color:var(--text-heading); }
.jds-body { padding:18px 20px; }
.jds-row { display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--gray-100);font-size:0.83rem; }
.jds-row:last-child { border-bottom:none; }
.jds-row .key { color:var(--gray-600);font-weight:500; }
.jds-row .val { font-weight:600;color:var(--text-heading); }
.apply-cta { background:var(--gradient-btn);border-radius:var(--radius);padding:22px;text-align:center; }
.apply-cta h3 { color:white;font-size:0.98rem;margin-bottom:8px; }
.apply-cta p { color:rgba(255,255,255,0.8);font-size:0.8rem;margin-bottom:16px; }
.login-prompt { background:var(--orange-pale);border:1px dashed rgba(240,123,36,0.4);border-radius:var(--radius);padding:20px;text-align:center; }
.login-prompt p { font-size:0.84rem;color:var(--gray-600);margin-bottom:12px; }

/* =====================================================
   AUTH (LOGIN / REGISTER)
===================================================== */
.auth-page { min-height:100vh;background:var(--gradient-hero);display:flex;align-items:center;justify-content:center;padding:90px 20px 60px;position:relative; }
.auth-page::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(240,123,36,0.2) 0%,transparent 55%); }
.auth-box { background:var(--white);border-radius:var(--radius-lg);padding:44px 40px;width:100%;max-width:460px;box-shadow:0 28px 80px rgba(0,0,0,0.3);position:relative; }
.auth-logo { text-align:center;margin-bottom:28px; }
.auth-logo img { height:64px;margin-bottom:8px; }
.auth-logo p { font-size:0.8rem;color:var(--gray-600); }
.auth-tabs { display:flex;background:var(--gray-100);border-radius:50px;padding:4px;margin-bottom:26px; }
.auth-tab { flex:1;padding:10px;border:none;background:transparent;border-radius:50px;font-family:var(--font-heading);font-weight:600;font-size:0.87rem;cursor:pointer;color:var(--gray-600);transition:var(--transition); }
.auth-tab.active { background:var(--white);color:var(--orange);box-shadow:0 2px 8px rgba(0,0,0,0.1); }
.auth-form { display:none; }
.auth-form.active { display:block; }
.auth-group { margin-bottom:16px; }
.auth-group label { display:block;font-size:0.82rem;font-weight:600;color:var(--text-heading);margin-bottom:6px; }
.auth-group label span { color:#DC2626; }
.auth-row2 { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.auth-input { width:100%;padding:12px 15px;border:1.5px solid var(--gray-300);border-radius:10px;font-family:var(--font-body);font-size:0.9rem;outline:none;transition:var(--transition); }
.auth-input:focus { border-color:var(--orange);box-shadow:0 0 0 3px rgba(240,123,36,0.1); }
.auth-btn { width:100%;padding:14px;background:var(--gradient-btn);border:none;border-radius:50px;color:white;font-family:var(--font-heading);font-weight:700;font-size:1rem;cursor:pointer;transition:var(--transition);margin-top:4px; }
.auth-btn:hover { opacity:0.9;transform:translateY(-1px); }
.auth-alert { padding:11px 15px;border-radius:9px;font-size:0.83rem;margin-bottom:16px;display:none; }
.auth-alert.show { display:block; }
.auth-alert.error { background:rgba(239,68,68,0.08);border:1px solid rgba(239,68,68,0.25);color:#DC2626; }
.auth-alert.success { background:rgba(16,185,129,0.08);border:1px solid rgba(16,185,129,0.25);color:#065F46; }
.auth-switch { text-align:center;margin-top:18px;font-size:0.84rem;color:var(--gray-600); }
.auth-switch a { color:var(--orange);font-weight:600;cursor:pointer; }

/* =====================================================
   APPLY MODAL
===================================================== */
.apply-modal-overlay { display:none;position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:3000;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(5px); }
.apply-modal-overlay.open { display:flex; }
.apply-modal { background:white;border-radius:var(--radius-lg);max-width:640px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 32px 100px rgba(0,0,0,0.25); }
.apply-modal-head { padding:22px 26px;border-bottom:1px solid var(--gray-300);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:white;z-index:1; }
.apply-modal-head h2 { font-size:1.1rem; }
.apply-modal-head p { font-size:0.8rem;color:var(--gray-600);margin-top:2px; }
.modal-x { background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--gray-600); }
.modal-x:hover { color:var(--text-heading); }
.apply-modal-body { padding:26px; }
.apply-row { display:grid;grid-template-columns:1fr 1fr;gap:15px; }
.apply-group { margin-bottom:16px; }
.apply-group label { display:block;font-size:0.82rem;font-weight:600;color:var(--text-heading);margin-bottom:6px; }
.apply-group label span { color:#DC2626; }
.apply-input { width:100%;padding:12px 14px;border:1.5px solid var(--gray-300);border-radius:9px;font-family:var(--font-body);font-size:0.88rem;outline:none;transition:var(--transition); }
.apply-input:focus { border-color:var(--orange);box-shadow:0 0 0 3px rgba(240,123,36,0.1); }
textarea.apply-input { resize:vertical;min-height:100px; }
.file-drop { border:2px dashed var(--gray-300);border-radius:9px;padding:22px;text-align:center;cursor:pointer;transition:var(--transition);position:relative; }
.file-drop:hover { border-color:var(--orange);background:var(--orange-pale); }
.file-drop input[type=file] { position:absolute;inset:0;opacity:0;cursor:pointer; }
.file-drop p { font-size:0.83rem;color:var(--gray-600); }
.file-drop .fname { font-size:0.78rem;color:var(--orange);font-weight:600;margin-top:5px; }
.apply-submit { width:100%;padding:14px;background:var(--gradient-btn);border:none;border-radius:50px;color:white;font-family:var(--font-heading);font-weight:700;font-size:1rem;cursor:pointer;transition:var(--transition); }
.apply-submit:hover { opacity:0.9;transform:translateY(-1px); }
.apply-submit:disabled { opacity:0.6;cursor:not-allowed;transform:none; }
.apply-success { text-align:center;padding:40px 20px;display:none; }
.apply-success.show { display:block; }
.apply-success .suc-icon { font-size:3.5rem;margin-bottom:14px; }
.apply-success h3 { font-size:1.2rem;margin-bottom:8px; }
.apply-success p { color:var(--gray-600);font-size:0.88rem; }

/* =====================================================
   USER DASHBOARD
===================================================== */
.dash-page { min-height:100vh;background:var(--gray-100);padding:100px 0 60px; }
.dash-header-row { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:28px; }
.dash-header-row h1 { font-size:1.7rem; }
.dash-header-row p { color:var(--gray-600);font-size:0.9rem; }
.dash-tabs { display:flex;gap:4px;background:white;border-radius:var(--radius);padding:6px;box-shadow:0 2px 8px rgba(0,0,0,0.06);margin-bottom:28px;flex-wrap:wrap; }
.dash-tab { padding:10px 20px;border:none;background:transparent;border-radius:8px;font-family:var(--font-heading);font-weight:600;font-size:0.87rem;cursor:pointer;color:var(--gray-600);transition:var(--transition); }
.dash-tab.active { background:var(--gradient-btn);color:white; }
.dash-panel { display:none; }
.dash-panel.active { display:block; }

.admin-card { background:white;border-radius:var(--radius);box-shadow:0 2px 12px rgba(0,0,0,0.06);overflow:hidden;margin-bottom:24px; }
.admin-card-head { padding:18px 24px;border-bottom:1px solid var(--gray-300);display:flex;align-items:center;justify-content:space-between; }
.admin-card-head h2 { font-size:1.02rem;font-weight:700; }
.admin-card-body { padding:24px; }

.app-card { background:white;border:1px solid var(--gray-300);border-radius:var(--radius);padding:18px 22px;display:flex;align-items:center;gap:16px;margin-bottom:12px;transition:var(--transition); }
.app-card:hover { box-shadow:var(--shadow-sm);border-color:var(--orange-light); }
.app-card-info { flex:1; }
.app-card-info h3 { font-size:0.93rem;font-weight:700;margin-bottom:3px; }
.app-card-info p { font-size:0.8rem;color:var(--gray-600); }
.app-status { display:inline-flex;align-items:center;padding:4px 12px;border-radius:50px;font-size:0.74rem;font-weight:700; }
.st-new       { background:rgba(240,123,36,0.1);color:var(--orange); }
.st-reviewed  { background:rgba(245,158,11,0.1);color:#D97706; }
.st-shortlist { background:rgba(16,185,129,0.1);color:#059669; }
.st-rejected  { background:rgba(239,68,68,0.1);color:#DC2626; }
.st-hired     { background:rgba(139,92,246,0.12);color:#7C3AED; }

/* Profile form */
.profile-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.pf-group { margin-bottom:0; }
.pf-label { display:block;font-size:0.82rem;font-weight:600;color:var(--text-heading);margin-bottom:6px; }
.pf-input { width:100%;padding:12px 14px;border:1.5px solid var(--gray-300);border-radius:9px;font-family:var(--font-body);font-size:0.88rem;outline:none;transition:var(--transition); }
.pf-input:focus { border-color:var(--orange); }
.notif-bar { padding:12px 16px;border-radius:9px;font-size:0.84rem;margin-bottom:16px;display:flex;align-items:center;gap:8px; }
.notif-ok  { background:rgba(16,185,129,0.08);border:1px solid rgba(16,185,129,0.25);color:#065F46; }
.notif-err { background:rgba(239,68,68,0.08);border:1px solid rgba(239,68,68,0.2);color:#991B1B; }

/* =====================================================
   ABOUT PAGE
===================================================== */
.about-hero { background:var(--gradient-hero);padding:120px 0 64px;text-align:center;position:relative;overflow:hidden; }
.about-hero::after { content:'';position:absolute;bottom:0;left:0;right:0;height:5px;background:var(--gradient-btn); }
.about-hero::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 60%,rgba(240,123,36,0.2) 0%,transparent 65%); }
.about-hero-inner { position:relative;z-index:1; }
.about-hero h1 { color:var(--white);font-size:clamp(2rem,4vw,3rem);margin-bottom:14px; }
.about-hero h1 span { color:var(--orange); }
.about-hero p { color:rgba(255,255,255,0.75);max-width:560px;margin:0 auto;font-size:0.97rem; }
.hero-stats-row { display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:36px; }
.hs-badge { background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:12px;padding:14px 22px;text-align:center;backdrop-filter:blur(8px); }
.hs-num { font-size:1.6rem;font-weight:800;color:var(--white);font-family:var(--font-heading);line-height:1; }
.hs-lbl { font-size:0.75rem;color:rgba(255,255,255,0.6);margin-top:3px; }

/* =====================================================
   CONTACT PAGE
===================================================== */
.contact-info-cards { display:grid;grid-template-columns:repeat(4,1fr);gap:20px; }
.ci-card { background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius);padding:26px 18px;text-align:center;transition:var(--transition); }
.ci-card:hover { transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--orange-light); }
.ci-card-icon { width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 4px 12px rgba(240,123,36,0.2); }
.ci-card h3 { font-size:0.93rem;font-weight:700;margin-bottom:6px; }
.ci-card p { font-size:0.84rem;color:var(--gray-700);font-weight:600; }
.ci-card .sub { font-size:0.77rem;color:var(--gray-600);font-weight:400;margin-top:3px; }
.contact-layout { display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:start; }
.contact-form-box { background:var(--white);border-radius:var(--radius-lg);padding:34px;box-shadow:var(--shadow-md);border:1px solid var(--gray-300); }
.contact-form-box h2 { font-size:1.3rem;margin-bottom:6px; }
.contact-form-box>p { color:var(--gray-600);font-size:0.88rem;margin-bottom:24px; }
.cf-row { display:grid;grid-template-columns:1fr 1fr;gap:15px; }
.cf-group { margin-bottom:16px; }
.cf-label { display:block;font-size:0.82rem;font-weight:600;color:var(--text-heading);margin-bottom:6px; }
.cf-input { width:100%;padding:12px 14px;border:1.5px solid var(--gray-300);border-radius:9px;font-family:var(--font-body);font-size:0.88rem;outline:none;transition:var(--transition); }
.cf-input:focus { border-color:var(--orange);box-shadow:0 0 0 3px rgba(240,123,36,0.1); }
textarea.cf-input { resize:vertical;min-height:120px; }
.contact-sidebar { display:flex;flex-direction:column;gap:18px; }
.cs-card { background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius);padding:22px; }
.cs-card.orange-bg { background:var(--gradient-btn);border:none; }
.cs-card.orange-bg h3, .cs-card.orange-bg .check-row { color:white; }
.cs-card h3 { font-size:0.95rem;font-weight:700;margin-bottom:14px; }
.check-row { display:flex;align-items:center;gap:8px;font-size:0.85rem;margin-bottom:9px;color:var(--text-body); }
.check-row::before { content:'✓';font-weight:700;color:var(--orange);min-width:16px; }
.cs-card.orange-bg .check-row::before { color:rgba(255,255,255,0.8); }

/* =====================================================
   ADMIN APPLICATIONS TABLE
===================================================== */
.app-table-wrap { overflow-x:auto; }
.app-tbl { width:100%;border-collapse:collapse;font-size:0.84rem; }
.app-tbl th { padding:11px 14px;text-align:left;font-size:0.77rem;font-weight:700;color:var(--gray-600);text-transform:uppercase;letter-spacing:0.5px;background:var(--gray-100);border-bottom:2px solid var(--gray-300); }
.app-tbl td { padding:13px 14px;border-bottom:1px solid var(--gray-300);vertical-align:middle; }
.app-tbl tr:last-child td { border-bottom:none; }
.app-tbl tr:hover td { background:var(--orange-pale); }
.view-btn { padding:5px 13px;background:rgba(240,123,36,0.1);color:var(--orange);border:none;border-radius:6px;font-size:0.77rem;font-weight:600;cursor:pointer;transition:var(--transition); }
.view-btn:hover { background:var(--orange);color:white; }

/* =====================================================
   BACK TO TOP
===================================================== */
#back-to-top { position:fixed;bottom:28px;right:28px;width:44px;height:44px;background:var(--gradient-btn);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;cursor:pointer;box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:var(--transition);z-index:500;border:none;font-size:1.1rem; }
#back-to-top.visible { opacity:1;pointer-events:auto; }
#back-to-top:hover { transform:translateY(-3px); }

/* =====================================================
   RESPONSIVE
===================================================== */
@media(max-width:1024px){
  .hero-inner { grid-template-columns:1fr; }
  .hero-right { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .why-grid { grid-template-columns:repeat(2,1fr); }
  .about-strip-inner { grid-template-columns:1fr; }
  .roles-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .cta-info-grid { grid-template-columns:1fr; }
  .contact-info-cards { grid-template-columns:repeat(2,1fr); }
  .jd-layout { grid-template-columns:1fr; }
  .contact-layout { grid-template-columns:1fr; }
}
@media(max-width:768px){
  .nav-menu { display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:white;padding:16px;box-shadow:var(--shadow-md);gap:4px; }
  .nav-menu.open { display:flex; }
  .hamburger { display:flex; }
  .stats-grid,.services-grid,.why-grid { grid-template-columns:1fr; }
  .hero-right { grid-template-columns:1fr; }
  .auth-box { padding:30px 22px; }
  .auth-row2,.apply-row,.cf-row,.profile-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .hero-stats-row { gap:10px; }
  .contact-info-cards { grid-template-columns:1fr 1fr; }
}
@media(max-width:480px){
  .contact-info-cards { grid-template-columns:1fr; }
  .cta-info-grid { grid-template-columns:1fr; }
  .job-card { flex-direction:column; }
  .job-actions { flex-direction:row;align-items:center; }
}
