/* ══════════════════════════════════════════════════════════════
   APILOX JOB DESCRIPTION PAGE — apilox-jd.css
   Data Protection & Compliance Intern
   Brand: #1FBC51 · #E9F8EF · #FFFFFF
   Fonts: Montserrat (heading) + Poppins (body)
══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900&family=Poppins:wght@300;400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');

/* ── VARIABLES ───────────────────────────────────────────── */
:root {
  --green:           #1FBC51;
  --green-dark:      #17a044;
  --green-deep:      #0d8a38;
  --green-light:     #E9F8EF;
  --green-soft:      rgba(31,188,81,0.08);
  --green-mid:       rgba(31,188,81,0.15);
  --green-border:    rgba(31,188,81,0.22);
  --green-glow:      rgba(31,188,81,0.30);
  --white:           #ffffff;
  --off-white:       #f7fdf9;
  --gray-50:         #f0faf4;
  --gray-100:        #e8f5ed;
  --gray-200:        #d1e8d9;
  --gray-300:        #aecfba;
  --gray-500:        #5f7c69;
  --gray-700:        #354a3c;
  --ink:             #0d1f14;
  --dk-bg:           #0a1e10;
  --font-heading:    'Montserrat', sans-serif;
  --font-body:       'Poppins', sans-serif;
  --header-h:        72px;
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   22px;
  --r-xl:   32px;
  --r-xxl:  100px;
  --shadow-sm:       0 2px 12px rgba(0,0,0,0.05);
  --shadow-md:       0 8px 32px rgba(0,0,0,0.08);
  --shadow-lg:       0 20px 60px rgba(0,0,0,0.10);
  --shadow-green:    0 8px 32px rgba(31,188,81,0.28);
  --shadow-green-lg: 0 20px 60px rgba(31,188,81,0.18);
}

/* ── RESET ───────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family: var(--font-body);
  background: var(--white);
  color: var(--gray-700);
  line-height: 1.6;
  overflow-x: hidden;
  padding-top: var(--header-h);
}
h1,h2,h3,h4,h5,h6 { font-family:var(--font-heading); font-weight:700; color:var(--ink); line-height:1.15; }
ul { list-style:none; }
a  { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; height:auto; }
button { cursor:pointer; font-family:var(--font-body); border:none; outline:none; }

/* ── REVEAL ──────────────────────────────────────────────── */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1);
}
.reveal.active { opacity:1; transform:translateY(0); }
.reveal.delay-2 { transition-delay:0.18s; }

/* ── UTILITIES ───────────────────────────────────────────── */
.chip {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--green-soft); border:1px solid var(--green-border);
  color:var(--green-dark); font-family:var(--font-heading);
  font-size:0.72rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
  padding:6px 14px; border-radius:var(--r-xxl); width:max-content;
}
.chip::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--green); animation:blink 2s infinite; }
.chip-dark {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(31,188,81,0.12); border:1px solid rgba(31,188,81,0.28); color:var(--green);
  font-family:var(--font-heading); font-size:0.72rem; font-weight:700;
  letter-spacing:0.12em; text-transform:uppercase; padding:6px 14px; border-radius:var(--r-xxl); width:max-content;
}
.chip-dark::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--green); animation:blink 2s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

.gradient-text {
  background:linear-gradient(135deg,var(--green-deep) 0%,var(--green) 60%,#4ade80 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn-green {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--green); color:var(--ink);
  font-family:var(--font-heading); font-weight:700; font-size:0.88rem;
  padding:13px 26px; border-radius:var(--r-xxl); border:none;
  transition:all 0.28s ease; white-space:nowrap; position:relative; overflow:hidden;
}
.btn-green::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,0.2) 50%,transparent 70%);
  transform:translateX(-100%); transition:transform 0.5s;
}
.btn-green:hover { background:var(--green-dark); color:var(--white); box-shadow:var(--shadow-green); transform:translateY(-2px); }
.btn-green:hover::after { transform:translateX(100%); }
.btn-green i { font-size:1.05rem; }

.btn-outline {
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:var(--ink);
  font-family:var(--font-heading); font-weight:600; font-size:0.88rem;
  padding:12px 26px; border-radius:var(--r-xxl); border:1.5px solid var(--green-border);
  transition:all 0.25s;
}
.btn-outline:hover { border-color:var(--green-dark); color:var(--green-dark); background:var(--green-soft); }

.btn-outline-white {
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:rgba(255,255,255,0.75);
  font-family:var(--font-heading); font-weight:600; font-size:0.88rem;
  padding:12px 26px; border-radius:var(--r-xxl); border:1.5px solid rgba(255,255,255,0.2);
  transition:all 0.25s;
}
.btn-outline-white:hover { border-color:var(--green); color:var(--green); }

.btn-download {
  font-family:var(--font-heading); font-size:13px; font-weight:600;
  padding:9px 18px; border-radius:100px;
  background:var(--green-soft); color:var(--green-dark); border:1.5px solid var(--green-border); transition:all 0.2s;
}
.btn-download:hover { background:var(--green-light); border-color:var(--green); }

.btn-started {
  font-family:var(--font-heading); font-size:13px; font-weight:700;
  padding:9px 20px; border-radius:100px;
  background:var(--green); color:var(--ink); border:1.5px solid var(--green); transition:all 0.2s;
}
.btn-started:hover { background:var(--green-dark); color:var(--white); }

/* ══════════════════════════════════════════════════════════
   HEADER
══════════════════════════════════════════════════════════ */
#mainHeader {
  position:fixed; inset:0 0 auto 0; height:var(--header-h);
  background:rgba(255,255,255,0.97); backdrop-filter:blur(20px);
  border-bottom:1px solid var(--green-border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 40px; z-index:9000; transition:box-shadow 0.3s, background 0.3s;
}
#mainHeader.scrolled { box-shadow:0 2px 24px rgba(31,188,81,0.12); }
.nav-logo img { height:36px; display:block; }
.nav-links { display:flex; align-items:center; gap:4px; list-style:none; }
.nav-links > li { position:relative; }
.nav-link, .dropdown-trigger {
  font-family:var(--font-heading); font-size:14px; font-weight:500; color:var(--gray-700);
  padding:8px 14px; border-radius:8px; cursor:pointer;
  display:flex; align-items:center; gap:5px; transition:color 0.2s,background 0.2s;
}
.nav-link:hover,.dropdown-trigger:hover,.nav-link.active { color:var(--green-dark); background:var(--green-soft); }
.dropdown-trigger i { font-size:11px; transition:transform 0.3s; }
.dropdown-trigger.open i { transform:rotate(180deg); }
.nav-actions { display:flex; align-items:center; gap:10px; }
.lang-trigger {
  cursor:pointer; position:relative; display:flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:8px; font-size:13px; font-weight:500; color:var(--gray-700); transition:background 0.2s;
}
.lang-trigger:hover { background:var(--green-soft); }
.flag-circle { width:20px; height:20px; border-radius:50%; background:url('https://flagcdn.com/w40/tz.png') center/cover; flex-shrink:0; }
.lang-menu { display:none; position:absolute; top:calc(100% + 10px); right:0; background:var(--white); border:1px solid var(--green-border); border-radius:var(--r-md); box-shadow:var(--shadow-md); padding:8px; min-width:180px; z-index:9100; }
.lang-menu.open { display:block; }
.lang-menu li { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; cursor:pointer; font-size:14px; color:var(--gray-700); }
.lang-menu li:hover { background:var(--green-soft); }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:6px; border-radius:8px; }
.hamburger span { display:block; width:22px; height:2px; background:var(--ink); border-radius:2px; transition:transform 0.3s,opacity 0.3s; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ══════════════════════════════════════════════════════════
   MEGA MENU
══════════════════════════════════════════════════════════ */
.mega-menu { display:none; position:fixed; top:var(--header-h); left:0; right:0; background:var(--white); border-top:2px solid var(--green); border-bottom:1px solid var(--green-border); box-shadow:var(--shadow-lg); padding:36px 40px 40px; z-index:8999; animation:megaSlide 0.28s ease; }
.mega-menu.open { display:block; }
@keyframes megaSlide { from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }
.mega-inner { max-width:1160px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.mega-col-title { font-family:var(--font-heading); font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--green-dark); margin-bottom:16px; }
.category-cards { display:flex; flex-direction:column; gap:10px; }
.category-card { display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:var(--r-md); border:1px solid var(--gray-200); background:var(--white); transition:all 0.2s; }
.category-card:hover { background:var(--green-soft); border-color:var(--green-border); transform:translateX(4px); }
.cat-icon { width:40px; height:40px; border-radius:10px; background:var(--green-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.cat-icon i { font-size:16px; color:var(--green-dark); }
.cat-text h5 { font-size:14px; font-weight:600; color:var(--ink); margin-bottom:2px; }
.cat-text p  { font-size:12px; color:var(--gray-500); line-height:1.4; }
.solutions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:6px; margin-bottom:20px; }
.sol-item { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; cursor:pointer; transition:background 0.2s; }
.sol-item:hover { background:var(--green-soft); }
.sol-icon { width:32px; height:32px; border-radius:8px; background:var(--gray-100); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.sol-icon i { font-size:14px; color:var(--gray-500); }
.sol-item:hover .sol-icon { background:var(--green); }
.sol-item:hover .sol-icon i { color:var(--ink); }
.sol-item span { font-size:13px; font-weight:500; color:var(--gray-700); }
.contact-nudge { background:var(--green-light); border-radius:var(--r-md); padding:16px 18px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.contact-nudge-text p { font-size:13px; font-weight:600; color:var(--ink); }
.contact-nudge-text span { font-size:12px; color:var(--gray-500); }
.btn-contact-nudge { font-family:var(--font-heading); font-size:12px; font-weight:700; padding:8px 16px; border-radius:100px; background:var(--green); color:var(--ink); border:none; cursor:pointer; transition:all 0.2s; }
.btn-contact-nudge:hover { background:var(--green-dark); color:var(--white); }

/* ══════════════════════════════════════════════════════════
   MOBILE DRAWER
══════════════════════════════════════════════════════════ */
.mobile-drawer { display:none; position:fixed; inset:0; z-index:8500; }
.mobile-drawer.open { display:block; }
.drawer-overlay { position:absolute; inset:0; background:rgba(10,26,16,0.35); backdrop-filter:blur(4px); }
.drawer-panel { position:absolute; top:0; right:0; width:320px; max-width:92vw; height:100%; background:var(--white); overflow-y:auto; display:flex; flex-direction:column; transform:translateX(100%); transition:transform 0.38s cubic-bezier(0.4,0,0.2,1); box-shadow:var(--shadow-lg); border-left:1px solid var(--green-border); }
.mobile-drawer.open .drawer-panel { transform:translateX(0); }
.drawer-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid var(--green-border); }
.drawer-brand { font-family:var(--font-heading); font-weight:900; font-size:20px; color:var(--ink); }
.drawer-brand span { color:var(--green); }
.drawer-close { width:34px; height:34px; border:none; background:var(--green-soft); border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--green-dark); }
.drawer-body { padding:16px 20px 32px; flex:1; }
.drawer-nav { list-style:none; margin-bottom:16px; }
.drawer-nav li { border-bottom:1px solid var(--gray-100); }
.drawer-nav a,.drawer-company-trigger { display:flex; align-items:center; justify-content:space-between; padding:14px 4px; font-size:15px; font-weight:500; color:var(--ink); cursor:pointer; }
.drawer-nav a:hover,.drawer-company-trigger:hover { color:var(--green-dark); }
.drawer-nav i { font-size:12px; transition:transform 0.3s; }
.drawer-company-trigger.open i { transform:rotate(180deg); }
.drawer-submenu { display:none; padding:8px 0 12px 12px; background:var(--green-soft); border-radius:var(--r-md); margin-bottom:8px; }
.drawer-submenu.open { display:block; }
.drawer-submenu a { display:flex; align-items:center; gap:10px; padding:10px 12px; font-size:14px; color:var(--gray-700); border-radius:8px; }
.drawer-submenu a:hover { background:var(--white); color:var(--green-dark); }
.drawer-submenu a i { font-size:13px; color:var(--green-dark); width:16px; }
.drawer-lang { display:flex; align-items:center; gap:10px; padding:12px 4px; border-top:1px solid var(--gray-100); border-bottom:1px solid var(--gray-100); margin-bottom:16px; }
.drawer-lang span { font-size:14px; color:var(--gray-700); font-weight:500; }
.drawer-ctas { display:flex; flex-direction:column; gap:10px; margin-top:20px; }
.drawer-ctas .btn-download,.drawer-ctas .btn-started { display:block; text-align:center; padding:13px; font-size:14px; }

/* ══════════════════════════════════════════════════════════
   BREADCRUMB
══════════════════════════════════════════════════════════ */
.breadcrumb-bar {
  background: var(--green-light);
  border-bottom: 1px solid var(--green-border);
  padding: 12px 40px;
}
.breadcrumb-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-heading); font-size: 0.78rem; font-weight: 600;
  color: var(--gray-500);
}
.breadcrumb-inner a { color: var(--green-dark); transition: color 0.2s; display:flex; align-items:center; gap:5px; }
.breadcrumb-inner a:hover { color: var(--green); }
.breadcrumb-inner span { color: var(--ink); }
.sep { font-size: 0.9rem; color: var(--gray-300); }

/* ══════════════════════════════════════════════════════════
   JD HERO
══════════════════════════════════════════════════════════ */
.jd-hero {
  background: var(--white);
  position: relative; overflow: hidden;
  padding: 80px 40px 60px;
  border-bottom: 1px solid var(--green-border);
}
.hero-grid-bg {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(31,188,81,0.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,188,81,0.055) 1px,transparent 1px);
  background-size:64px 64px; z-index:0;
  animation: gridDrift 24s linear infinite;
}
@keyframes gridDrift { 0%{background-position:0 0} 100%{background-position:64px 64px} }
.hero-orb { position:absolute; border-radius:50%; pointer-events:none; z-index:0; }
.hero-orb--1 { width:600px; height:600px; background:radial-gradient(circle,rgba(31,188,81,0.09) 0%,transparent 65%); top:-150px; right:-100px; animation:orbDrift 14s ease-in-out infinite; }
.hero-orb--2 { width:350px; height:350px; background:radial-gradient(circle,rgba(233,248,239,0.8) 0%,transparent 70%); bottom:-60px; left:-60px; animation:orbDrift 18s ease-in-out infinite reverse; }
@keyframes orbDrift { 0%,100%{transform:translate(0,0)} 33%{transform:translate(16px,-24px)} 66%{transform:translate(-12px,16px)} }

.jd-hero__inner {
  max-width: 1280px; margin: 0 auto; position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.15fr 1fr; gap: 72px; align-items: center;
}

/* LEFT */
.jd-hero__left { display: flex; flex-direction: column; gap: 24px; }
.jd-eyebrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

.dept-badge {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--green-light); border: 1px solid var(--green-border);
  color: var(--green-dark); font-family: var(--font-heading);
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 6px 14px; border-radius: var(--r-xxl);
}
.dept-badge i { font-size: 0.85rem; }

.status-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(31,188,81,0.10); border: 1px solid rgba(31,188,81,0.25);
  color: var(--green-dark); font-family: var(--font-heading);
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 6px 14px; border-radius: var(--r-xxl);
}
.status-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--green);
  animation: blink 1.4s infinite;
}

.jd-hero__left h1 {
  font-size: clamp(2.8rem, 5vw, 5rem);
  font-weight: 900; letter-spacing: -0.04em; line-height: 1.02; color: var(--ink);
}
.jd-subtitle {
  font-family: var(--font-heading); font-size: 1rem; font-weight: 600;
  color: var(--green-dark); letter-spacing: 0.04em; text-transform: uppercase;
  margin-top: -10px;
}
.jd-meta-row {
  display: flex; flex-direction: column; gap: 10px;
}
.jd-meta-item {
  display: flex; align-items: center; gap: 10px;
  font-size: 0.88rem; color: var(--gray-700);
}
.jd-meta-item i { color: var(--green-dark); font-size: 1rem; flex-shrink: 0; width: 18px; }
.jd-hero__cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 8px; }

/* RIGHT */
.jd-hero__right { display: flex; flex-direction: column; }
.jd-summary-card {
  background: var(--white);
  border: 1.5px solid var(--green-border);
  border-radius: var(--r-xl); padding: 32px;
  box-shadow: var(--shadow-green);
  display: flex; flex-direction: column; gap: 20px;
  position: relative; overflow: hidden;
}
.jd-summary-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--green), var(--green-dark));
}
.jd-summary-card__header { display: flex; align-items: center; gap: 16px; }
.jd-summary-card__icon {
  width: 52px; height: 52px; border-radius: var(--r-md); flex-shrink: 0;
  background: var(--green-soft); border: 1.5px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 1.5rem;
}
.jd-summary-card__header h3 { font-size: 1rem; font-weight: 800; color: var(--ink); margin-bottom: 3px; }
.jd-summary-card__header p  { font-size: 0.82rem; color: var(--gray-500); }
.jd-summary-divider { height: 1px; background: var(--green-border); }
.jd-summary-list { display: flex; flex-direction: column; gap: 10px; }
.jd-summary-item {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 0.85rem; color: var(--gray-700);
}
.jd-summary-item i { color: var(--green-dark); font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
.jd-summary-note {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.78rem; color: var(--gray-500); justify-content: center; margin-top: -8px;
}
.jd-summary-note i { color: var(--green-dark); }

/* ══════════════════════════════════════════════════════════
   LAYOUT: CONTENT + SIDEBAR
══════════════════════════════════════════════════════════ */
.jd-layout { background: var(--off-white); border-top: 1px solid var(--green-border); }
.jd-layout__inner {
  max-width: 1280px; margin: 0 auto; padding: 80px 40px;
  display: grid; grid-template-columns: 1fr 340px;
  gap: 56px; align-items: start;
}

/* ── JD CONTENT ──────────────────────────────────────────── */
.jd-content { display: flex; flex-direction: column; gap: 64px; }

.jd-section { display: flex; flex-direction: column; gap: 20px; }
.jd-section__label {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-heading); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--green-dark);
}
.jd-section__label i { font-size: 0.9rem; }
.jd-section h2 {
  font-size: clamp(1.6rem, 2.8vw, 2.2rem); font-weight: 800; letter-spacing: -0.03em;
}
.jd-section > p { color: var(--gray-500); line-height: 1.8; max-width: 680px; }

.jd-highlight-box {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--green-light); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 20px 24px;
}
.jd-highlight-box > i { color: var(--green-dark); font-size: 1.4rem; flex-shrink: 0; margin-top: 2px; }
.jd-highlight-box strong { display: block; font-family: var(--font-heading); font-size: 0.9rem; color: var(--ink); margin-bottom: 6px; }
.jd-highlight-box p { font-size: 0.86rem; color: var(--gray-700); line-height: 1.7; }

/* Responsibilities grid */
.responsibilities-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.resp-card {
  background: var(--white); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 24px; display: flex; flex-direction: column; gap: 12px;
  position: relative; overflow: hidden; transition: all 0.28s;
}
.resp-card:hover { box-shadow: var(--shadow-green); border-color: var(--green); transform: translateY(-3px); }
.resp-card__num {
  font-family: var(--font-heading); font-size: 0.65rem; font-weight: 800;
  color: var(--green-dark); letter-spacing: 0.1em;
}
.resp-card__icon {
  width: 40px; height: 40px; border-radius: var(--r-sm);
  background: var(--green-soft); border: 1px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 1.1rem; transition: all 0.28s;
}
.resp-card:hover .resp-card__icon { background: var(--green); color: var(--ink); }
.resp-card h4 { font-size: 0.9rem; font-weight: 800; color: var(--ink); }
.resp-card p  { font-size: 0.82rem; color: var(--gray-500); line-height: 1.65; }

/* Qualifications */
.qual-block { background: var(--white); border: 1.5px solid var(--green-border); border-radius: var(--r-lg); padding: 24px; display: flex; flex-direction: column; gap: 14px; }
.qual-block h4 { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; font-weight: 800; color: var(--ink); }
.qual-block h4 i { color: var(--green-dark); font-size: 1.1rem; }
.qual-block > p { font-size: 0.85rem; color: var(--gray-500); margin-top: -4px; }
.qual-degrees { display: flex; gap: 12px; flex-wrap: wrap; }
.qual-degree {
  position: relative; display: flex; align-items: center; gap: 10px;
  background: var(--green-soft); border: 1.5px solid var(--green-border);
  border-radius: var(--r-md); padding: 12px 16px;
  font-family: var(--font-heading); font-size: 0.8rem; font-weight: 600; color: var(--ink);
  transition: all 0.2s; flex: 1; min-width: 160px;
}
.qual-degree i { color: var(--green-dark); font-size: 1.1rem; }
.qual-degree:hover { border-color: var(--green); background: var(--green-light); }
.qual-degree.preferred { border-color: var(--green); background: var(--green-light); }
.preferred-tag {
  position: absolute; top: -10px; right: 10px;
  font-family: var(--font-heading); font-size: 0.62rem; font-weight: 800;
  background: var(--green); color: var(--ink); padding: 2px 10px;
  border-radius: var(--r-xxl); letter-spacing: 0.08em; text-transform: uppercase;
}

.requirements-list { display: flex; flex-direction: column; gap: 12px; }
.req-item {
  display: flex; align-items: flex-start; gap: 14px;
  background: var(--white); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 18px 20px; transition: all 0.2s;
}
.req-item:hover { border-color: var(--green); background: var(--green-soft); }
.req-item__check {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--green-soft); border: 1.5px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 0.75rem; transition: all 0.2s;
}
.req-item:hover .req-item__check { background: var(--green); color: var(--ink); }
.req-item strong { display: block; font-family: var(--font-heading); font-size: 0.88rem; color: var(--ink); margin-bottom: 4px; }
.req-item p { font-size: 0.82rem; color: var(--gray-500); line-height: 1.6; }

/* Gains grid */
.gains-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.gain-card {
  background: var(--white); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 24px; display: flex; flex-direction: column; gap: 12px;
  transition: all 0.28s;
}
.gain-card:hover { box-shadow: var(--shadow-green); border-color: var(--green); transform: translateY(-3px); }
.gain-card__icon {
  width: 44px; height: 44px; border-radius: var(--r-sm);
  background: var(--green-soft); border: 1px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 1.2rem; transition: all 0.28s;
}
.gain-card:hover .gain-card__icon { background: var(--green); color: var(--ink); }
.gain-card h4 { font-size: 0.88rem; font-weight: 800; color: var(--ink); }
.gain-card p  { font-size: 0.8rem; color: var(--gray-500); line-height: 1.65; }

/* Work Structure */
.structure-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.structure-card {
  background: var(--white); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 24px;
  display: flex; flex-direction: column; gap: 8px;
  transition: all 0.25s;
}
.structure-card:hover { border-color: var(--green); background: var(--green-soft); }
.structure-card > i { color: var(--green-dark); font-size: 1.4rem; }
.structure-card h4 { font-size: 0.82rem; font-weight: 800; color: var(--gray-500); text-transform: uppercase; letter-spacing: 0.08em; font-family: var(--font-heading); }
.structure-card p  { font-size: 0.95rem; font-weight: 700; color: var(--ink); font-family: var(--font-heading); }
.structure-note { font-size: 0.78rem; color: var(--green-dark); font-weight: 500; }

.jd-note-box {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--green-soft); border: 1.5px solid var(--green-border);
  border-radius: var(--r-lg); padding: 20px 24px; margin-top: 8px;
}
.jd-note-box > i { color: var(--green-dark); font-size: 1.3rem; flex-shrink: 0; margin-top: 2px; }
.jd-note-box strong { display: inline-block; font-family: var(--font-heading); font-size: 0.88rem; color: var(--green-dark); margin-bottom: 6px; }
.jd-note-box p { font-size: 0.85rem; color: var(--gray-700); line-height: 1.7; }
.jd-note-box strong { font-weight: 800; }

/* Apply steps */
.apply-steps { display: flex; flex-direction: column; gap: 0; }
.apply-step {
  display: flex; gap: 20px; align-items: flex-start;
  padding: 24px 0; border-bottom: 1px solid var(--green-border);
}
.apply-step:last-child { border-bottom: none; }
.apply-step__num {
  font-family: var(--font-heading); font-size: 0.72rem; font-weight: 800;
  color: var(--green-dark); background: var(--green-soft); border: 1.5px solid var(--green-border);
  border-radius: var(--r-xxl); padding: 5px 12px; flex-shrink: 0; white-space: nowrap; letter-spacing: 0.08em;
}
.apply-step__body h4 { font-size: 0.95rem; font-weight: 800; color: var(--ink); margin-bottom: 6px; }
.apply-step__body p  { font-size: 0.85rem; color: var(--gray-500); line-height: 1.7; }

.apply-cta-card {
  background: var(--green-light); border: 2px solid var(--green-border);
  border-radius: var(--r-xl); padding: 28px 32px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  flex-wrap: wrap;
}
.apply-cta-card__left { display: flex; flex-direction: column; gap: 16px; }
.apply-cta-card__email-row, .apply-cta-card__subject {
  display: flex; align-items: center; gap: 12px;
}
.apply-cta-card__email-row i, .apply-cta-card__subject i {
  color: var(--green-dark); font-size: 1.2rem; flex-shrink: 0;
}
.apply-cta-card__label { display: block; font-size: 0.72rem; font-weight: 700; color: var(--gray-500); text-transform: uppercase; letter-spacing: 0.1em; font-family: var(--font-heading); margin-bottom: 2px; }
.apply-cta-card__email { display: block; font-size: 0.95rem; font-weight: 700; color: var(--green-dark); font-family: var(--font-heading); transition: color 0.2s; }
.apply-cta-card__email:hover { color: var(--green); }
.apply-cta-card__subj-text { display: block; font-size: 0.85rem; font-weight: 600; color: var(--ink); font-family: var(--font-heading); font-style: italic; }
.apply-btn { font-size: 0.95rem; padding: 15px 32px; }

/* ── SIDEBAR ─────────────────────────────────────────────── */
.jd-sidebar { display: flex; flex-direction: column; gap: 20px; }
.sidebar-card {
  background: var(--white); border: 1.5px solid var(--green-border);
  border-radius: var(--r-xl); padding: 28px;
  display: flex; flex-direction: column; gap: 16px;
}
.sticky-card { position: sticky; top: 96px; }
.sidebar-card h3 { font-size: 1rem; font-weight: 800; color: var(--ink); }
.sidebar-card h4 { font-size: 0.88rem; font-weight: 800; color: var(--ink); }
.sidebar-divider { height: 1px; background: var(--green-border); }

.sidebar-meta-list { display: flex; flex-direction: column; gap: 12px; }
.sidebar-meta-item { display: flex; align-items: flex-start; gap: 12px; }
.sidebar-meta-item__icon {
  width: 32px; height: 32px; border-radius: var(--r-sm); flex-shrink: 0;
  background: var(--green-soft); border: 1px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 0.9rem;
}
.sidebar-meta-item__label { display: block; font-size: 0.68rem; font-weight: 700; color: var(--gray-500); text-transform: uppercase; letter-spacing: 0.1em; font-family: var(--font-heading); margin-bottom: 2px; }
.sidebar-meta-item__value { display: block; font-size: 0.82rem; font-weight: 600; color: var(--ink); }

.sidebar-share { display: flex; flex-direction: column; gap: 10px; }
.sidebar-share span { font-size: 0.78rem; font-weight: 700; color: var(--gray-500); text-transform: uppercase; letter-spacing: 0.1em; font-family: var(--font-heading); }
.sidebar-share__icons { display: flex; gap: 8px; }
.sidebar-share__icons a {
  width: 36px; height: 36px; border-radius: var(--r-sm);
  background: var(--green-soft); border: 1px solid var(--green-border);
  display: flex; align-items: center; justify-content: center;
  color: var(--green-dark); font-size: 0.9rem; transition: all 0.2s;
}
.sidebar-share__icons a:hover { background: var(--green); color: var(--ink); transform: translateY(-2px); }

.skill-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.skill-tags span {
  background: var(--green-soft); border: 1px solid var(--green-border);
  color: var(--green-dark); font-family: var(--font-heading);
  font-size: 0.72rem; font-weight: 700; padding: 5px 12px;
  border-radius: var(--r-xxl); transition: all 0.2s;
}
.skill-tags span:hover { background: var(--green); color: var(--ink); border-color: var(--green); }

/* ══════════════════════════════════════════════════════════
   CTA BANNER
══════════════════════════════════════════════════════════ */
.jd-cta {
  padding: 60px 40px;
  background: var(--green-light);
  border-top: 1px solid var(--green-border);
}
.jd-cta__inner { max-width: 1280px; margin: 0 auto; }
.jd-cta__box {
  background: linear-gradient(135deg, var(--green-deep) 0%, var(--green-dark) 50%, #0f7a30 100%);
  border-radius: var(--r-xl); padding: 72px 64px;
  display: flex; flex-direction: column; align-items: center;
  gap: 24px; text-align: center; position: relative; overflow: hidden;
  box-shadow: var(--shadow-green-lg);
}
.cta-dots { position:absolute; inset:0; display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(3,1fr); padding:24px; pointer-events:none; }
.cta-dots span { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,0.1); margin:auto; animation:dotPulse 3s ease-in-out infinite; }
.cta-dots span:nth-child(odd) { animation-delay:-1.5s; }
.cta-dots span:nth-child(3n) { animation-delay:-0.8s; }
@keyframes dotPulse { 0%,100%{transform:scale(1);opacity:0.1} 50%{transform:scale(1.8);opacity:0.35} }
.jd-cta__box::before { content:''; position:absolute; top:-150px; left:50%; transform:translateX(-50%); width:600px; height:350px; background:radial-gradient(ellipse,rgba(255,255,255,0.07) 0%,transparent 70%); pointer-events:none; }
.jd-cta__box h2 { font-size:clamp(1.7rem,3vw,2.8rem); font-weight:800; color:var(--white); max-width:640px; letter-spacing:-0.03em; line-height:1.2; position:relative; z-index:1; }
.jd-cta__box > p { font-size:1rem; color:rgba(255,255,255,0.6); max-width:480px; line-height:1.75; position:relative; z-index:1; }
.cta-btns { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; position:relative; z-index:1; }
.cta-email-hint { display:flex; align-items:center; gap:8px; font-size:0.82rem; color:rgba(255,255,255,0.4); font-family:var(--font-heading); position:relative; z-index:1; }
.cta-email-hint i { color:rgba(255,255,255,0.5); }

/* ══════════════════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════════════════ */
.footer { background:var(--white); border-top:2px solid var(--green-border); padding-top:72px; }
.footer__inner { max-width:1280px; margin:0 auto; padding:0 40px; display:flex; flex-direction:column; gap:56px; }
.footer__top { display:grid; grid-template-columns:1.4fr 1fr; gap:80px; align-items:start; }
.footer__brand { display:flex; flex-direction:column; gap:18px; }
.footer__brand img { height:36px; width:auto; }
.footer__brand p { font-size:0.88rem; color:var(--gray-500); max-width:380px; line-height:1.7; }
.footer__social { display:flex; gap:10px; }
.footer__social a { width:38px; height:38px; border-radius:var(--r-sm); background:var(--green-soft); border:1px solid var(--green-border); display:flex; align-items:center; justify-content:center; color:var(--green-dark); font-size:1rem; transition:all 0.2s; }
.footer__social a:hover { background:var(--green); color:var(--ink); transform:translateY(-2px); }
.footer__newsletter { display:flex; flex-direction:column; gap:14px; }
.footer__newsletter h4 { font-size:1rem; font-weight:700; color:var(--ink); }
.footer__newsletter p  { font-size:0.82rem; color:var(--gray-500); }
.newsletter-form { display:flex; align-items:center; background:var(--green-soft); border:1.5px solid var(--green-border); border-radius:var(--r-xxl); padding:5px 5px 5px 18px; gap:8px; transition:border-color 0.2s; }
.newsletter-form:focus-within { border-color:var(--green); background:var(--white); }
.newsletter-form input { flex:1; border:none; outline:none; font-family:var(--font-body); font-size:0.85rem; color:var(--ink); background:transparent; }
.newsletter-form input::placeholder { color:var(--gray-300); }
.newsletter-form button { width:38px; height:38px; border-radius:50%; background:var(--green); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--ink); font-size:1.1rem; transition:all 0.2s; flex-shrink:0; }
.newsletter-form button:hover { background:var(--green-dark); color:var(--white); }
.footer__mid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; padding:40px 0; border-top:1px solid var(--green-border); border-bottom:1px solid var(--green-border); }
.footer__col h5 { font-family:var(--font-heading); font-size:0.72rem; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--green-dark); margin-bottom:16px; }
.footer__col a { display:block; font-size:0.85rem; color:var(--gray-500); margin-bottom:10px; transition:color 0.2s; }
.footer__col a:hover { color:var(--green-dark); }
.footer__col p { font-size:0.85rem; color:var(--gray-500); margin-bottom:8px; line-height:1.6; }
.footer__legal { display:flex; flex-direction:column; gap:20px; padding-bottom:40px; }
.footer__legal-links { display:flex; flex-wrap:wrap; gap:12px 24px; }
.footer__legal-links a { font-size:0.78rem; color:var(--gray-500); transition:color 0.2s; }
.footer__legal-links a:hover { color:var(--green-dark); }
.footer__legal-text { font-size:0.75rem; color:var(--gray-300); line-height:1.7; max-width:900px; }
.footer__legal-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer__copy { font-size:0.78rem; color:var(--gray-500); font-family:var(--font-heading); }
.footer__stores { display:flex; gap:10px; align-items:center; }
.footer__stores img { height:30px; width:auto; }

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .jd-hero__inner        { grid-template-columns:1fr; gap:48px; }
  .jd-hero__right        { display:none; }
  .jd-layout__inner      { grid-template-columns:1fr; }
  .jd-sidebar            { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .sticky-card           { position:static; }
  .gains-grid            { grid-template-columns:repeat(2,1fr); }
  .footer__top           { grid-template-columns:1fr; gap:40px; }
  .footer__mid           { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 900px) {
  #mainHeader { padding:0 20px; }
  .nav-links,.lang-trigger,.btn-download,.btn-started { display:none; }
  .hamburger { display:flex; }
  .breadcrumb-bar { padding:12px 24px; }
}
@media (max-width: 768px) {
  .jd-hero { padding:60px 24px 40px; }
  .jd-hero__left h1 { font-size:2.6rem; }
  .jd-layout__inner { padding:60px 24px; }
  .responsibilities-grid { grid-template-columns:1fr; }
  .gains-grid { grid-template-columns:1fr; }
  .structure-cards { grid-template-columns:1fr; }
  .jd-sidebar { grid-template-columns:1fr; }
  .apply-cta-card { flex-direction:column; align-items:flex-start; }
  .jd-cta { padding:48px 24px; }
  .jd-cta__box { padding:48px 28px; }
  .footer__inner { padding:0 24px; }
  .mega-inner { grid-template-columns:1fr; gap:28px; }
}
@media (max-width: 480px) {
  .qual-degrees { flex-direction:column; }
  .footer__mid  { grid-template-columns:1fr 1fr; }
}