
/* ════════════════════════════════════════════════════
   QFYRE V7, DESIGN SYSTEM
   Montserrat (headings) + Inter (body)
   Updated: white backgrounds, mnemonic eyebrows,
            domain strip, dark inner heroes
════════════════════════════════════════════════════ */
:root {
  --q-black:      #0A0A08;
  --q-white:      #FFFFFF;
  --q-off-white:  #F7F5F0;
  --q-green:      #00C47A;
  --q-green-dim:  #00A865;
  --q-green-pale: #E6F9F2;
  --q-ink:        #111110;
  --q-body:       #2D2D2A;
  --q-body-dark:  #E8E6E0;
  --q-muted:      #5A5A54;
  --q-muted-dark: #9A9A90;
  --q-border:     #DEDAD0;
  --q-surface:    #FFFFFF;
  --q-surface2:   #FFFFFF;
  --nav-h:        96px;
  --font-head:    'Montserrat', sans-serif;
  --font-body:    'Inter', 'Montserrat', sans-serif;
  /* Brand mnemonic data URIs */
  --mnemonic-green: url("/mnemonic-green-light.png");
  --mnemonic-green-dk: url("/mnemonic-green-dark.png");
  --mnemonic-white: url("/mnemonic-white-dark.png");
  --mnemonic-dark: url("/mnemonic-dark-light.png");
}
*,*::before,*::after {box-sizing:border-box;margin:0;padding:0;}
html {scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body {
  font-family:var(--font-body);
  background:#fff;
  color:var(--q-body);
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img {max-width:100%;height:auto;display:block;}
a {color:inherit;}
button {font-family:var(--font-body);}

/* ── SKIP LINK ── */
.skip-link {
  position:absolute;top:-100px;left:1rem;z-index:9999;
  background:var(--q-green);color:var(--q-black);
  padding:.5rem 1rem;border-radius:2px;
  font-weight:700;font-size:.8rem;text-decoration:none;
  transition:top .2s;
}
.skip-link:focus {top:8px;}

/* Focus styles for keyboard navigation */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--q-green);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ── HEADER ── */
.site-header {position:sticky;top:0;z-index:200;}
.site-nav {
  background:#fff;
  border-bottom:1px solid var(--q-border);
  height:var(--nav-h);
  display:flex;align-items:center;
  padding:0 3rem;
  justify-content:space-between;
  box-shadow:0 1px 0 rgba(0,0,0,0.04);
  max-width:100%;
}
.nav-logo {display:block;flex-shrink:0;}
.nav-logo img {
  height:72px;
  width:auto;
  max-width:270px;
  object-fit:contain;
}
.nav-links {display:flex;align-items:center;gap:2.25rem;}
.nav-links a {
  font-family:var(--font-head);
  font-size:.78rem;font-weight:500;color:var(--q-muted);
  text-decoration:none;transition:color .2s;letter-spacing:.03em;
  white-space:nowrap;
}
.nav-links a:hover {color:var(--q-ink);}
.nav-links a.active {color:var(--q-green);font-weight:600;}
.nav-cta {
  display:inline-flex;align-items:center;
  background:var(--q-green)!important;color:var(--q-black)!important;
  font-family:var(--font-head);font-size:.75rem;font-weight:700;
  padding:.55rem 1.35rem;border-radius:2px;
  text-decoration:none;white-space:nowrap;
  transition:background .2s,transform .15s;
  letter-spacing:.04em;text-transform:uppercase;
}
.nav-cta:hover {background:var(--q-green-dim)!important;transform:translateY(-1px);}
.nav-hamburger {
  display:none;flex-direction:column;gap:5px;
  cursor:pointer;background:none;border:none;padding:4px;flex-shrink:0;
}
.nav-hamburger span {
  display:block;width:24px;height:2px;
  background:var(--q-ink);border-radius:1px;transition:all .3s;
}
.nav-hamburger.open span:nth-child(1) {transform:translateY(7px) rotate(45deg);}
.nav-hamburger.open span:nth-child(2) {opacity:0;}
.nav-hamburger.open span:nth-child(3) {transform:translateY(-7px) rotate(-45deg);}
.nav-drawer {
  display:none;flex-direction:column;
  background:#fff;border-bottom:1px solid var(--q-border);
  padding:1.25rem 1.5rem;
  box-shadow:0 8px 24px rgba(0,0,0,.07);
}
.nav-drawer.open {display:flex;}
.nav-drawer a {
  font-family:var(--font-head);font-size:.9rem;font-weight:500;
  color:var(--q-ink);text-decoration:none;
  padding:.75rem 0;border-bottom:1px solid var(--q-border);
}
.nav-drawer a:last-child {border-bottom:none;}
.nav-cta-mob {
  margin-top:.75rem!important;text-align:center;
  border:none!important;background:var(--q-green)!important;
  color:var(--q-black)!important;border-radius:2px!important;
  padding:.75rem 1rem!important;font-weight:700!important;
}

/* ── FOOTER ── */
.site-footer {
  background:var(--q-black);color:var(--q-muted-dark);
  padding:5rem 3rem 2.5rem;margin-top:0;
}
.footer-inner {max-width:1280px;margin:0 auto;}
.footer-grid {
  display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;
  gap:3rem;padding-bottom:3rem;border-bottom:1px solid #1e1e1e;
}
.footer-logo img {
  height:64px;width:auto;max-width:260px;
  object-fit:contain;margin-bottom:1.25rem;
}
.footer-tagline {font-size:.875rem;line-height:1.7;color:var(--q-muted-dark);max-width:280px;}
.footer-social {display:flex;gap:.75rem;margin-top:1.75rem;}
.footer-social a {
  width:36px;height:36px;border:1px solid #2a2a2a;border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  color:#555;text-decoration:none;font-family:var(--font-head);
  font-size:.72rem;font-weight:700;transition:all .2s;
}
.footer-social a:hover {border-color:var(--q-green);color:var(--q-green);background:rgba(0,196,122,.05);}
.footer-col h4 {
  font-family:var(--font-head);font-size:.7rem;font-weight:700;
  color:#fff;text-transform:uppercase;letter-spacing:.12em;margin-bottom:1.25rem;
}
.footer-col a {
  display:block;font-size:.875rem;color:var(--q-muted-dark);
  text-decoration:none;margin-bottom:.6rem;transition:color .2s;line-height:1.4;
}
.footer-col a:hover {color:var(--q-green);}
.footer-bottom {
  padding-top:1.75rem;display:flex;
  justify-content:space-between;align-items:center;
  font-size:.78rem;color:#444;flex-wrap:wrap;gap:.75rem;
}
.footer-bottom a {color:#444;text-decoration:none;margin-left:1.25rem;}
.footer-bottom a:hover {color:var(--q-green);}

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5 {
  font-family:var(--font-head);font-weight:700;
  line-height:1.15;color:var(--q-ink);
}
.display-1 {font-size:clamp(2.8rem,5.5vw,5rem);font-weight:900;letter-spacing:-.02em;}
.display-2 {font-size:clamp(2rem,4vw,3.25rem);font-weight:800;letter-spacing:-.01em;}
.display-3 {font-size:clamp(1.6rem,2.5vw,2.25rem);font-weight:700;}
.lead {
  font-family:var(--font-body);font-size:1.0625rem;
  color:var(--q-muted);line-height:1.8;max-width:640px;
}
.on-dark {color:var(--q-body-dark);}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4 {color:#fff;}
.on-dark .lead,.on-dark p {color:var(--q-muted-dark);}
.on-dark .section-label {color:var(--q-green);}

/* ── UTILITIES ── */
.container {max-width:1180px;margin:0 auto;padding:0 2rem;}
.section {padding:6rem 0;background:#fff;}
.section-sm {padding:4rem 0;background:#fff;}
.section-xs {padding:2.5rem 0;background:#fff;}
.section-dark {background:var(--q-black);}
.section-tinted {background:#F8F7F4;}

/* ── SECTION LABEL (replaces eyebrow) ── */
/* Unique to Qfyre: vertical green bar + small label */
.section-label {
  display:inline-flex;align-items:center;gap:.75rem;
  font-family:var(--font-head);font-size:.68rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.18em;color:var(--q-green);
  margin-bottom:1.25rem;
  padding-left:1rem;
  border-left:3px solid var(--q-green);
  line-height:1;
}
/* Mnemonic variant for section headings */
.section-label-mark {
  display:inline-flex;align-items:center;gap:.625rem;
  font-family:var(--font-head);font-size:.68rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.18em;color:var(--q-green);
  margin-bottom:1.25rem;
}
.section-label-mark::before {
  content:'';
  display:inline-block;
  width:16px;height:16px;
  background-image:var(--mnemonic-green);
  background-size:contain;
  background-repeat:no-repeat;
  flex-shrink:0;
}
.on-dark .section-label {
  color:var(--q-green);
  border-left-color:var(--q-green);
}
.on-dark .section-label-mark::before {
  background-image:var(--mnemonic-green-dk);
}

/* Keep .eyebrow as alias for backwards compat */
.eyebrow {
  display:inline-block;
  font-family:'Playfair Display', Georgia, serif;
  font-size:1.35rem;
  font-weight:700;
  font-style:italic;
  letter-spacing:0;
  color:var(--q-green);
  margin-bottom:1rem;
  line-height:1.3;
}
.eyebrow::before { display:none; }
.section-label {
  display:inline-block;
  font-family:'Playfair Display', Georgia, serif;
  font-size:1.25rem;
  font-weight:400;
  font-style:italic;
  color:var(--q-green);
  margin-bottom:1rem;
  line-height:1.3;
}
.section-label::before { display:none; }
.on-dark .eyebrow,
.on-dark .section-label { color:var(--q-green); }

/* ── DOMAIN STRIP (replaces marquee) ── */
/* Scrolling domain/sector logos on dark bg */
.domain-strip {
  background:var(--q-black);
  border-top:1px solid #171714;
  border-bottom:1px solid #171714;
  padding:0;
  overflow:hidden;
  position:relative;
}
.domain-strip::before,
.domain-strip::after {
  content:'';
  position:absolute;top:0;bottom:0;width:120px;z-index:2;
  pointer-events:none;
}
.domain-strip::before {left:0;background:linear-gradient(to right,var(--q-black),transparent);}
.domain-strip::after {right:0;background:linear-gradient(to left,var(--q-black),transparent);}
.domain-track {
  display:flex;
  animation:domainScroll 32s linear infinite;
  width:max-content;
}
.domain-track:hover {animation-play-state:paused;}
@keyframes domainScroll {
  from {transform:translateX(0);}
  to {transform:translateX(-50%);}
}
.domain-item {
  display:flex;align-items:center;gap:1.25rem;
  padding:1.5rem 3rem;
  border-right:1px solid #1e1e1e;
  white-space:nowrap;
  flex-shrink:0;
  transition:background .2s;
}
.domain-item:hover {background:#0f0f0d;}
.domain-item-mark {
  width:20px;height:20px;
  background-image:var(--mnemonic-green-dk);
  background-size:contain;
  background-repeat:no-repeat;
  flex-shrink:0;
  opacity:.7;
}
.domain-item-label {
  font-family:var(--font-head);
  font-size:.75rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.14em;
  color:#888;
  transition:color .2s;
}
.domain-item:hover .domain-item-label {color:var(--q-green);}
.domain-item:hover .domain-item-mark {opacity:1;}

/* ── TAG (service tags) ── */
.tag {
  display:inline-flex;align-items:center;
  font-family:var(--font-head);font-size:.62rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;
  padding:.28rem .7rem;border-radius:2px;
  background:#fff;color:var(--q-muted);border:1px solid var(--q-border);
  text-decoration:none;transition:all .2s;
}
.tag:hover {border-color:var(--q-green);color:var(--q-green-dim);}
.tag.green {background:var(--q-green-pale);color:var(--q-green-dim);border-color:rgba(0,196,122,.25);}
.tag.blue  {background:#EBF3FB;color:#185FA5;border-color:rgba(24,95,165,.2);}
/* Tags in service cards are always linked - cursor pointer */
.service-tags a.tag {cursor:pointer;}
.service-tags span.tag {cursor:default;opacity:.7;}

/* ── BUTTONS ── */
.btn {
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-head);font-size:.75rem;font-weight:700;
  padding:.8rem 1.875rem;border-radius:2px;
  text-decoration:none;transition:all .2s;border:none;
  letter-spacing:.06em;text-transform:uppercase;cursor:pointer;
  line-height:1;
}
.btn-primary {background:var(--q-green);color:var(--q-black);}
.btn-primary:hover {background:var(--q-green-dim);transform:translateY(-1px);}
.btn-outline {background:transparent;color:var(--q-ink);border:1.5px solid var(--q-border);}
.btn-outline:hover {border-color:var(--q-ink);background:#f5f5f5;}
.btn-outline-light {background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.3);}
.btn-outline-light:hover {border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.07);}
.btn-ghost {background:transparent;color:var(--q-muted);padding-left:0;padding-right:0;}
.btn-ghost::after {content:' →';}
.btn-ghost:hover {color:var(--q-green);}
.btn-dark {background:var(--q-black);color:#fff;}
.btn-dark:hover {background:#222;transform:translateY(-1px);}

/* ── HERO (Home) ── */
.hero {
  min-height:88vh;display:flex;align-items:center;
  position:relative;overflow:hidden;background:var(--q-black);
}
.hero-content {position:relative;z-index:2;padding:5rem 0;}
.hero-kicker {
  display:inline-flex;align-items:center;gap:.75rem;
  font-family:var(--font-head);font-size:.65rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.12em;color:#888;
  margin-bottom:2rem;padding:.4rem 1rem .4rem .5rem;
  border:1px solid #2a2a2a;border-radius:2px;background:#111;
}
.hero-kicker-dot {
  width:7px;height:7px;border-radius:50%;
  background:var(--q-green);
  animation:pulse 2s infinite;flex-shrink:0;
}
@keyframes pulse {
  0%,100% {opacity:1;box-shadow:0 0 0 0 rgba(0,196,122,.4);}
  70% {box-shadow:0 0 0 6px rgba(0,196,122,0);}
}
.hero-title {
  font-size:clamp(2.8rem,5.5vw,5rem);font-weight:900;
  line-height:1.05;margin-bottom:1.5rem;letter-spacing:-.02em;color:#fff;
}
.hero-title em {font-style:normal;color:var(--q-green);}
.hero-desc {font-size:1.125rem;color:#aaa;line-height:1.8;max-width:560px;margin-bottom:2.5rem;}
.hero-actions {display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:4rem;}
.hero-proof {
  padding-top:2.5rem;border-top:1px solid #1e1e1e;
  display:flex;gap:3rem;flex-wrap:wrap;
}
.hero-stat-label {
  font-family:var(--font-head);font-size:.63rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;color:#555;margin-bottom:.3rem;
}
.hero-stat-val {
  font-family:var(--font-head);font-size:1.875rem;font-weight:800;color:#fff;
}

/* ── INNER PAGE HERO (dark, full-width, like home but compact) ── */
.inner-hero {
  background:#fff;
  border-bottom:1px solid var(--q-border);
  padding:4.5rem 0 4rem;
  position:relative;overflow:hidden;
}
.inner-hero-grid {
  display:grid;
  grid-template-columns:1fr 380px;
  gap:4rem;
  align-items:center;
}
.inner-hero-svg {
  display:flex;align-items:center;justify-content:flex-end;
}
.inner-hero-svg svg {
  width:100%;max-width:360px;height:auto;
  opacity:.85;
}
.inner-hero-content {}
.inner-hero h1 {color:var(--q-ink);margin-bottom:1.25rem;}
.inner-hero .lead {color:var(--q-muted);max-width:600px;}
.inner-hero .eyebrow {color:var(--q-green);}
.inner-hero-actions {
  display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.5rem;
}
@media (max-width:1024px) {
  .inner-hero-grid {grid-template-columns:1fr;gap:2rem;}
  .inner-hero-svg {justify-content:flex-start;}
  .inner-hero-svg svg {max-width:280px;}
}
@media (max-width:768px) {
  .inner-hero {padding:3rem 0 2.5rem;}
  .inner-hero-svg {display:none;}
  .inner-hero-actions {flex-direction:column;align-items:stretch;}
  .inner-hero-actions .btn {justify-content:center;}
}

/* ── PROBLEM/PROMISE ── */
.problem-strip {background:#fff;}
.problem-inner {display:grid;grid-template-columns:1fr 1fr;}
.problem-col {padding:4.5rem 3rem;background:#fff;}
.problem-col:first-child {border-right:1px solid var(--q-border);}
.problem-col h3 {font-size:1.125rem;margin-bottom:1.25rem;}
.problem-list {list-style:none;}
.problem-list li {
  padding:.65rem 0;border-bottom:1px solid var(--q-border);
  color:var(--q-body);font-size:.9375rem;
  display:flex;align-items:flex-start;gap:.75rem;line-height:1.55;
}
.problem-list li:last-child {border-bottom:none;}
.problem-list li::before {content:'✕';color:#D94040;font-size:.7rem;flex-shrink:0;margin-top:.25rem;font-weight:800;}
.promise-list li::before {content:'✓';color:var(--q-green)!important;}

/* ── SERVICE CARDS ── */
.services-cards {
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--q-border);border:1px solid var(--q-border);
}
.service-card {
  background:#fff;padding:2.75rem 2.25rem;transition:background .2s;
}
.service-card:hover {background:#FAFAF8;}
.service-num {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--q-muted);margin-bottom:1.5rem;
}
.service-card h3 {font-size:1.0625rem;margin-bottom:.875rem;color:var(--q-ink);}
.service-card p {font-size:.9rem;color:var(--q-body);line-height:1.7;margin-bottom:1.75rem;}
.service-tags {display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.5rem;}
.service-card .btn {font-size:.7rem;padding:.6rem 1.25rem;}

/* ── WHY QFYRE ── */
.why-grid {display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
.why-features {display:grid;gap:0;}
.why-feat {
  padding:1.5rem 0;border-bottom:1px solid var(--q-border);
  display:grid;grid-template-columns:2.75rem 1fr;gap:1rem;align-items:start;
}
.why-feat:last-child {border-bottom:none;}
.why-feat-icon {
  width:2.25rem;height:2.25rem;background:var(--q-green-pale);border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-size:.72rem;font-weight:800;color:var(--q-green-dim);flex-shrink:0;
}
.why-feat h4 {font-size:.9375rem;margin-bottom:.4rem;color:var(--q-ink);}
.why-feat p {font-size:.875rem;color:var(--q-body);line-height:1.65;}

/* ── FYRE DARK BLOCK ── */
.fyre-block {background:var(--q-black);}
.fyre-grid {display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center;padding:6rem 0;}
.fyre-left h2 {color:#fff;margin-bottom:1rem;}
.fyre-left p {color:var(--q-muted-dark);margin-bottom:2.25rem;font-size:.9375rem;line-height:1.75;}
.fyre-letters {border:1px solid #1e1e1e;}
.fyre-letter {display:grid;grid-template-columns:4.5rem 1fr;border-bottom:1px solid #1e1e1e;transition:background .2s;}
.fyre-letter:last-child {border-bottom:none;}
.fyre-letter:hover {background:#0f0f0d;}
.fyre-char {
  font-family:var(--font-head);font-size:2rem;font-weight:900;color:var(--q-green);
  padding:1.25rem;border-right:1px solid #1e1e1e;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.fyre-detail {padding:1.25rem 1.5rem;}
.fyre-detail h4 {font-family:var(--font-head);font-size:.875rem;color:#fff;margin-bottom:.35rem;}
.fyre-detail p {font-size:.83rem;color:var(--q-muted-dark);line-height:1.65;}

/* ── INSIGHT CARDS ── */
.insight-cards {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.insight-card {
  border:1px solid var(--q-border);border-radius:2px;overflow:hidden;
  transition:border-color .25s,transform .25s;
  background:#fff;text-decoration:none;color:inherit;display:block;
}
.insight-card:hover {border-color:var(--q-green);transform:translateY(-3px);}
.insight-card-thumb {height:4px;background:var(--q-green);}
.insight-card-body {padding:1.625rem;}
.insight-card-type {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;color:var(--q-muted);margin-bottom:.875rem;
}
.insight-card h4 {font-size:.9375rem;margin-bottom:.65rem;line-height:1.35;color:var(--q-ink);}
.insight-card p {font-size:.855rem;color:var(--q-body);line-height:1.65;margin-bottom:1.25rem;}
.insight-card-meta {
  font-family:var(--font-head);font-size:.65rem;font-weight:500;
  color:var(--q-muted);display:flex;justify-content:space-between;
}

/* ── CTA BANNER ── */
.cta-banner {background:var(--q-green);padding:5.5rem 0;text-align:center;}
.cta-banner h2 {color:var(--q-black);font-size:clamp(1.75rem,3vw,2.5rem);margin-bottom:1rem;}
.cta-banner p {
  color:rgba(10,10,8,.65);font-size:1.0625rem;margin-bottom:2.25rem;
  max-width:520px;margin-left:auto;margin-right:auto;line-height:1.7;
}

/* ── FAQ ACCORDION (single column) ── */
.faq-list {display:grid;grid-template-columns:1fr;gap:1px;background:var(--q-border);border:1px solid var(--q-border);margin-top:2.5rem;}
details {background:#fff;padding:0;}
details[open] {background:#FAFAF8;}
summary {
  font-family:var(--font-head);font-weight:600;font-size:.9375rem;
  cursor:pointer;list-style:none;display:flex;
  justify-content:space-between;align-items:center;gap:1rem;
  padding:1.375rem 1.75rem;color:var(--q-ink);user-select:none;
}
summary::-webkit-details-marker {display:none;}
.faq-icon {color:var(--q-green);font-size:1.25rem;flex-shrink:0;font-weight:300;transition:transform .2s;line-height:1;}
details[open] .faq-icon {transform:rotate(45deg);}
details p {padding:0 1.75rem 1.5rem;font-size:.9375rem;color:var(--q-body);line-height:1.8;}
details p strong {color:var(--q-ink);font-weight:600;}

/* ── SERVICES PAGE ── */
.service-row {
  display:grid;grid-template-columns:1fr 2fr;gap:4.5rem;
  padding:5rem 0;border-bottom:1px solid var(--q-border);align-items:start;
  background:#fff;
}
.service-row:last-child {border-bottom:none;}
.service-row-label {position:sticky;top:calc(var(--nav-h) + 1.5rem);}
.service-row-num {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--q-muted);margin-bottom:.75rem;
}
.service-row-label h2 {font-size:1.625rem;margin-bottom:.875rem;color:var(--q-ink);}
.service-row-label p {font-size:.9rem;color:var(--q-body);line-height:1.7;margin-bottom:1.75rem;}
.service-detail-cols {display:grid;gap:1.5rem;}
.service-sub-card {
  background:#fff;border:1px solid var(--q-border);border-radius:2px;
  padding:2rem;transition:border-color .2s;
}
.service-sub-card:hover {border-color:var(--q-green);}
.service-sub-card h4 {font-size:.9375rem;margin-bottom:.65rem;color:var(--q-ink);}
.service-sub-card p {font-size:.875rem;color:var(--q-body);line-height:1.7;margin-bottom:1rem;}
.service-sub-card ul {list-style:none;}
.service-sub-card ul li {
  font-size:.875rem;color:var(--q-body);padding:.35rem 0;
  display:flex;align-items:flex-start;gap:.625rem;
  border-bottom:1px solid var(--q-border);line-height:1.5;
}
.service-sub-card ul li:last-child {border-bottom:none;}
.service-sub-card ul li::before {content:'-';color:var(--q-green);flex-shrink:0;font-weight:700;margin-top:.05rem;}
.how-works {background:#F8F7F4;padding:4rem 0;}
.steps {display:grid;grid-template-columns:repeat(5,1fr);}
.step {padding:2.25rem 1.75rem;background:#fff;border-right:1px solid var(--q-border);}
.step:last-child {border-right:none;}
.step-num {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  color:var(--q-green);margin-bottom:1rem;letter-spacing:.14em;text-transform:uppercase;
}
.step h4 {font-size:.9375rem;margin-bottom:.5rem;color:var(--q-ink);}
.step p {font-size:.85rem;color:var(--q-body);line-height:1.65;}

/* ── FYRE MODEL PAGE ── */
.fyre-meta-grid {display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:3.5rem;}
.fyre-meta-card {
  background:#fff;border:1px solid var(--q-border);border-radius:2px;
  padding:2.25rem;transition:border-color .2s;
}
.fyre-meta-card:hover {border-color:var(--q-green);}
.fyre-meta-letter {
  font-family:var(--font-head);font-size:3rem;font-weight:900;
  color:var(--q-green);line-height:1;margin-bottom:.5rem;display:block;
}
.fyre-meta-card h3 {font-size:1.125rem;margin-bottom:.875rem;color:var(--q-ink);}
.fyre-meta-card p {font-size:.9rem;color:var(--q-body);line-height:1.75;}
.fyre-meta-card ul {list-style:none;margin-top:1.25rem;}
.fyre-meta-card ul li {
  font-size:.875rem;color:var(--q-body);padding:.4rem 0;
  border-bottom:1px solid var(--q-border);
  display:flex;align-items:flex-start;gap:.5rem;
}
.fyre-meta-card ul li:last-child {border-bottom:none;}
.fyre-meta-card ul li::before {content:'-';color:var(--q-green);flex-shrink:0;font-weight:700;}
.fyre-shifts {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:3.5rem;}
.fyre-shift-card {
  border:1px solid var(--q-border);border-radius:2px;
  padding:2rem;transition:border-color .2s;background:#fff;
}
.fyre-shift-card:hover {border-color:var(--q-green);}
.fyre-shift-num {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.14em;color:var(--q-green);margin-bottom:1rem;
}
.fyre-shift-card h4 {font-size:1.0625rem;margin-bottom:.65rem;color:var(--q-ink);}
.fyre-shift-card p {font-size:.9rem;color:var(--q-body);line-height:1.7;}
.fyre-pitfalls {
  background:var(--q-black);border-radius:2px;
  padding:3.5rem;margin-bottom:3.5rem;
}
.fyre-pitfalls h3 {color:#fff;font-size:1.375rem;margin-bottom:2rem;}
.pitfall-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.pitfall-card {background:#111;border:1px solid #222;border-radius:2px;padding:1.75rem;}
.pitfall-stat {font-family:var(--font-head);font-size:2.25rem;font-weight:900;color:var(--q-green);margin-bottom:.4rem;}
.pitfall-card h4 {font-size:.9375rem;color:#fff;margin-bottom:.5rem;}
.pitfall-card p {font-size:.83rem;color:var(--q-muted-dark);line-height:1.65;}
.fyre-table {width:100%;border-collapse:collapse;margin-bottom:3.5rem;font-size:.9rem;}
.fyre-table th {
  background:var(--q-black);color:#fff;padding:1.125rem 1.5rem;text-align:left;
  font-family:var(--font-head);font-weight:700;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.1em;
}
.fyre-table td {
  padding:1.125rem 1.5rem;border-bottom:1px solid var(--q-border);
  color:var(--q-body);vertical-align:top;background:#fff;
}
.fyre-table tr:nth-child(even) td {background:#FAFAF8;}
.fyre-table tr:last-child td {border-bottom:none;}
.fyre-table td:first-child {color:var(--q-ink);font-weight:600;}
.fyre-quote {
  background:var(--q-green-pale);border-left:3px solid var(--q-green);
  padding:2.25rem 3rem;margin-bottom:3.5rem;border-radius:0 2px 2px 0;
}
.fyre-quote p {
  font-size:1.0625rem;color:var(--q-ink);line-height:1.75;
  font-style:italic;font-weight:500;margin-bottom:.625rem;
}
.fyre-quote small {
  font-family:var(--font-head);font-size:.72rem;color:var(--q-muted);
  font-weight:600;text-transform:uppercase;letter-spacing:.1em;
}

/* ── BLOG MAIN ── */
.blog-layout {display:grid;grid-template-columns:1fr 300px;gap:4.5rem;padding:4rem 0;align-items:start;}
.blog-featured {
  border:1px solid var(--q-border);border-radius:2px;overflow:hidden;
  margin-bottom:3rem;display:grid;grid-template-columns:1fr 1fr;
  text-decoration:none;color:inherit;transition:border-color .2s;background:#fff;
}
.blog-featured:hover {border-color:var(--q-green);}
.blog-feat-img {
  background:var(--q-black);min-height:280px;position:relative;
  overflow:hidden;display:flex;align-items:flex-end;padding:2rem;
}
.blog-feat-img-bg {position:absolute;inset:0;background:linear-gradient(135deg,#0A2A1A 0%,#0A0A08 100%);}
.blog-feat-watermark {
  position:relative;z-index:1;font-family:var(--font-head);
  font-size:2.5rem;font-weight:900;color:var(--q-green);opacity:.15;
  line-height:1;user-select:none;
}
.blog-feat-body {
  padding:2.5rem;display:flex;flex-direction:column;
  justify-content:center;background:#fff;
}
.blog-feat-body h3 {font-size:1.25rem;line-height:1.3;margin-bottom:1rem;color:var(--q-ink);}
.blog-feat-body p {font-size:.9375rem;color:var(--q-body);line-height:1.75;margin-bottom:1.5rem;}
.blog-feat-meta {font-family:var(--font-head);font-size:.68rem;color:var(--q-muted);}
.blog-list {display:grid;gap:0;}
.blog-card {
  display:grid;grid-template-columns:2.5rem 1fr;gap:1.375rem;
  padding:1.625rem 0;border-bottom:1px solid var(--q-border);
  text-decoration:none;color:inherit;transition:opacity .2s;align-items:start;
}
.blog-card:hover {opacity:.75;}
.blog-card:last-child {border-bottom:none;}
.blog-card-num {font-family:var(--font-head);font-size:.68rem;font-weight:700;color:var(--q-muted);padding-top:.15rem;}
.blog-card h4 {font-size:.9375rem;line-height:1.35;margin-bottom:.5rem;color:var(--q-ink);}
.blog-card p {font-size:.875rem;color:var(--q-body);line-height:1.65;margin-bottom:.875rem;}
.blog-card-meta {
  display:flex;align-items:center;gap:1rem;
  font-family:var(--font-head);font-size:.65rem;color:var(--q-muted);flex-wrap:wrap;
}
.blog-sidebar {}
.sidebar-block {margin-bottom:2.5rem;}
.sidebar-block-title {
  font-family:var(--font-head);font-size:.65rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;color:var(--q-muted);
  margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--q-border);
}
.sidebar-topics {display:flex;flex-wrap:wrap;gap:.5rem;}
.sidebar-topic {
  font-family:var(--font-head);font-size:.65rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.06em;
  padding:.35rem .75rem;border:1px solid var(--q-border);border-radius:2px;
  color:var(--q-muted);text-decoration:none;transition:all .2s;cursor:pointer;
  background:#fff;
}
.sidebar-topic:hover,.sidebar-topic.active {border-color:var(--q-green);color:var(--q-green);background:var(--q-green-pale);}
.sidebar-box {background:#F8F7F4;border:1px solid var(--q-border);padding:1.75rem;border-radius:2px;}
.sidebar-box h4 {font-size:1rem;margin-bottom:.5rem;color:var(--q-ink);}
.sidebar-box p {font-size:.875rem;color:var(--q-body);margin-bottom:1.25rem;line-height:1.65;}
.sidebar-box input {
  width:100%;padding:.65rem 1rem;border:1px solid var(--q-border);
  background:#fff;font-family:var(--font-body);font-size:.9rem;
  color:var(--q-ink);margin-bottom:.875rem;border-radius:2px;outline:none;
}
.sidebar-box input:focus {border-color:var(--q-green);}

/* ── BLOG SINGLE ── */
.blog-single-layout {display:grid;grid-template-columns:1fr 260px;gap:5.5rem;padding:4rem 0;align-items:start;}
.blog-single-aside {position:sticky;top:calc(var(--nav-h) + 1.5rem);align-self:start;}
.blog-byline {
  display:flex;align-items:center;gap:1rem;
  font-family:var(--font-head);font-size:.75rem;color:var(--q-muted);
  padding:1.125rem 0;border-top:1px solid var(--q-border);border-bottom:1px solid var(--q-border);
  margin-bottom:2.75rem;
}
.blog-avatar {
  width:34px;height:34px;border-radius:50%;background:var(--q-green-pale);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-size:.72rem;font-weight:800;
  color:var(--q-green-dim);flex-shrink:0;
}
.blog-content {font-size:1rem;line-height:1.85;color:var(--q-body);}
.blog-content h2 {font-size:1.375rem;margin:2.75rem 0 1rem;color:var(--q-ink);}
.blog-content h3 {font-size:1.125rem;margin:2.25rem 0 .875rem;color:var(--q-ink);}
.blog-content p {margin-bottom:1.375rem;}
.blog-content ul,.blog-content ol {margin:1rem 0 1.375rem 1.75rem;}
.blog-content li {margin-bottom:.625rem;}
.blog-content blockquote {
  border-left:3px solid var(--q-green);padding:1.25rem 1.75rem;
  margin:2.25rem 0;background:#F8F7F4;font-style:italic;
  color:var(--q-body);font-size:1.0625rem;
}
.blog-content .callout {
  background:var(--q-green-pale);border:1px solid rgba(0,196,122,.2);
  border-radius:2px;padding:1.375rem 1.75rem;margin:2.25rem 0;
  font-size:.9375rem;color:var(--q-ink);
}
.blog-content .callout strong {color:var(--q-green-dim);}
.blog-related {margin-top:4rem;padding-top:3.5rem;border-top:1px solid var(--q-border);}
.blog-related h3 {font-size:1.25rem;margin-bottom:1.75rem;color:var(--q-ink);}
.related-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.related-card {
  border:1px solid var(--q-border);padding:1.5rem;border-radius:2px;
  text-decoration:none;color:inherit;display:block;transition:border-color .2s;background:#fff;
}
.related-card:hover {border-color:var(--q-green);}
.related-card h4 {font-size:.9rem;line-height:1.4;margin-bottom:.5rem;color:var(--q-ink);margin-top:.875rem;}
.blog-toc {}
.blog-toc-title {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;color:var(--q-muted);margin-bottom:1rem;
}
.toc-list {list-style:none;border-left:2px solid var(--q-border);}
.toc-list li a {
  display:block;padding:.45rem 1rem;font-size:.875rem;color:var(--q-muted);
  text-decoration:none;transition:all .2s;
  border-left:2px solid transparent;margin-left:-2px;line-height:1.4;
}
.toc-list li a:hover,.toc-list li a.active {color:var(--q-green);border-left-color:var(--q-green);}
.share-btn {
  font-family:var(--font-head);font-size:.7rem;font-weight:600;
  padding:.55rem 1rem;border:1px solid var(--q-border);border-radius:2px;
  color:var(--q-muted);cursor:pointer;background:#fff;text-align:left;
  transition:all .2s;width:100%;margin-bottom:.4rem;
  text-transform:uppercase;letter-spacing:.06em;
}
.share-btn:hover {border-color:var(--q-green);color:var(--q-green);}

/* ── INSIGHTS ── */
.insights-filter {display:flex;gap:.5rem;padding:2rem 0 1.25rem;flex-wrap:wrap;}
.filter-btn {
  font-family:var(--font-head);font-size:.65rem;font-weight:700;
  padding:.45rem 1.125rem;border:1px solid var(--q-border);border-radius:2px;
  background:#fff;color:var(--q-muted);cursor:pointer;transition:all .2s;
  text-transform:uppercase;letter-spacing:.08em;
}
.filter-btn:hover,.filter-btn.active {background:var(--q-ink);color:#fff;border-color:var(--q-ink);}
.insights-featured {
  display:grid;grid-template-columns:1fr 1fr;
  border:1px solid var(--q-border);margin-bottom:3.5rem;
  border-radius:2px;overflow:hidden;color:inherit;transition:border-color .2s;
  cursor:pointer;
}
.insights-featured:hover {border-color:var(--q-green);}
.insights-feat-cover {
  background:var(--q-black);padding:3.5rem;display:flex;
  flex-direction:column;justify-content:space-between;
  min-height:340px;position:relative;overflow:hidden;
}
.insights-feat-glow {
  position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 80% at 50% 50%,rgba(0,196,122,.08) 0%,transparent 70%);
  pointer-events:none;
}
.insights-feat-cover h2 {position:relative;font-size:1.75rem;color:#fff;line-height:1.2;max-width:340px;}
.insights-feat-cover-meta {
  position:relative;font-family:var(--font-head);font-size:.68rem;color:#555;display:flex;gap:1.5rem;
}
.insights-feat-body {
  padding:3.5rem;display:flex;flex-direction:column;
  justify-content:flex-start;background:#fff;border-left:1px solid var(--q-border);
}
.insights-feat-body p {font-size:.9375rem;color:var(--q-body);line-height:1.75;margin-bottom:2rem;}
.insights-feat-body ul {list-style:none;margin-bottom:2.25rem;}
.insights-feat-body ul li {
  font-size:.9rem;color:var(--q-body);padding:.4rem 0;
  display:flex;align-items:flex-start;gap:.625rem;
  border-bottom:1px solid var(--q-border);line-height:1.55;
}
.insights-feat-body ul li:last-child {border-bottom:none;}
.insights-feat-body ul li::before {content:'-';color:var(--q-green);flex-shrink:0;font-weight:700;}
.insights-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.insight-list-card {
  border:1px solid var(--q-border);border-radius:2px;overflow:hidden;
  text-decoration:none;color:inherit;display:block;transition:all .2s;background:#fff;
}
.insight-list-card:hover {border-color:var(--q-green);transform:translateY(-2px);}
.insight-list-card-stripe {height:4px;}
.insight-list-card-stripe.wp {background:var(--q-green);}
.insight-list-card-stripe.rr {background:#185FA5;}
.insight-list-card-body {padding:1.875rem;}
.insight-list-card-type {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;color:var(--q-muted);margin-bottom:.875rem;
}
.insight-list-card h3 {font-size:1.0625rem;line-height:1.35;margin-bottom:.65rem;color:var(--q-ink);}
.insight-list-card p {font-size:.875rem;color:var(--q-body);line-height:1.65;margin-bottom:1.375rem;}
.insight-list-card-footer {
  font-family:var(--font-head);font-size:.65rem;color:var(--q-muted);
  display:flex;justify-content:space-between;
  padding-top:1.125rem;border-top:1px solid var(--q-border);
}

/* ── GATED / DOWNLOAD ── */
.gated-layout {display:grid;grid-template-columns:1fr 1fr;min-height:80vh;}
.gated-form-col {
  padding:5rem 4rem;display:flex;flex-direction:column;
  justify-content:center;border-right:1px solid var(--q-border);background:#fff;
}
.gated-form-col h1 {font-size:clamp(1.5rem,2.5vw,2.125rem);margin-bottom:1rem;line-height:1.2;}
.gated-form-col > p {font-size:.9375rem;color:var(--q-body);line-height:1.75;margin-bottom:2.25rem;}
.gated-benefits {margin-bottom:2.75rem;list-style:none;}
.gated-benefits li {
  font-size:.9rem;color:var(--q-body);padding:.4rem 0;
  display:flex;align-items:flex-start;gap:.65rem;line-height:1.55;
}
.gated-benefits li::before {content:'✓';color:var(--q-green);font-weight:800;flex-shrink:0;font-size:.75rem;margin-top:.1rem;}
.form-field {display:grid;gap:.4rem;margin-bottom:1.125rem;}
.form-field label {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;color:var(--q-muted);
}
.form-field input,.form-field select,.form-field textarea {
  padding:.75rem 1.125rem;border:1px solid var(--q-border);
  background:#fff;font-family:var(--font-body);font-size:.9375rem;
  color:var(--q-ink);border-radius:2px;outline:none;transition:border-color .2s;width:100%;
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus {
  border-color:var(--q-green);background:#fff;
}
.form-field textarea {resize:vertical;min-height:120px;}
.form-privacy {font-size:.78rem;color:var(--q-muted);margin-top:.875rem;line-height:1.6;}
.gated-preview-col {
  background:var(--q-black);padding:5rem 4rem;
  display:flex;flex-direction:column;justify-content:center;
}
.wp-cover {
  background:#0F1F17;border:1px solid #222;border-radius:2px;
  padding:3.5rem;margin-bottom:2.25rem;position:relative;overflow:hidden;
}
.wp-cover-glow {
  position:absolute;inset:0;
  background:radial-gradient(ellipse 100% 80% at 50% 100%,rgba(0,196,122,.07) 0%,transparent 60%);
}
.wp-cover-logo {
  font-family:var(--font-head);font-size:.85rem;font-weight:800;
  color:var(--q-green);margin-bottom:3rem;position:relative;
  letter-spacing:.06em;text-transform:uppercase;
}
.wp-cover h2 {position:relative;color:#fff;font-size:1.625rem;line-height:1.25;margin-bottom:.875rem;}
.wp-cover-sub {position:relative;color:#555;font-size:.9rem;}
.wp-cover-badge {
  position:absolute;top:2rem;right:2rem;
  background:var(--q-green);color:var(--q-black);
  font-family:var(--font-head);font-size:.6rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.1em;padding:.35rem .75rem;border-radius:2px;
}
.wp-desc {color:var(--q-muted-dark);font-size:.9rem;line-height:1.75;}
.wp-stats {display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.25rem;}
.wp-stat {background:#111;border:1px solid #1e1e1e;border-radius:2px;padding:1.125rem;}
.wp-stat-val {font-family:var(--font-head);font-size:1.625rem;font-weight:900;color:#fff;}
.wp-stat-label {
  font-family:var(--font-head);font-size:.62rem;font-weight:600;
  color:#555;text-transform:uppercase;letter-spacing:.08em;margin-top:.25rem;
}

/* ── CONTACT ── */
.contact-layout {display:grid;grid-template-columns:1fr 1fr;}
.contact-info {padding:5.5rem 4rem;border-right:1px solid var(--q-border);background:#fff;}
.contact-info h1 {font-size:clamp(2rem,3.5vw,3rem);margin-bottom:1rem;line-height:1.1;}
.contact-info > p.contact-intro {font-size:.9375rem;color:var(--q-body);line-height:1.75;margin-bottom:3rem;max-width:400px;}
.contact-detail-item {
  display:flex;gap:1.125rem;padding:1.375rem 0;
  border-bottom:1px solid var(--q-border);align-items:flex-start;
}
.contact-detail-item:first-of-type {border-top:1px solid var(--q-border);}
.contact-icon {
  width:2.25rem;height:2.25rem;border:1px solid var(--q-border);border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-size:.65rem;color:var(--q-muted);flex-shrink:0;font-weight:700;
}
.contact-detail-label {
  font-family:var(--font-head);font-size:.62rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;color:var(--q-muted);margin-bottom:.25rem;
}
.contact-detail-val {font-size:.9375rem;color:var(--q-ink);font-weight:500;line-height:1.5;}
.intent-label {
  font-family:var(--font-head);font-size:.68rem;font-weight:700;
  color:var(--q-muted);text-transform:uppercase;letter-spacing:.1em;
  margin-bottom:1rem;margin-top:2.75rem;
}
.intent-options {display:grid;grid-template-columns:1fr 1fr;gap:.625rem;}
.intent-opt {
  padding:1rem 1.125rem;border:1px solid var(--q-border);border-radius:2px;
  cursor:pointer;transition:all .2s;background:#fff;
}
.intent-opt:hover,.intent-opt.active {border-color:var(--q-green);background:var(--q-green-pale);}
.intent-opt-title {font-family:var(--font-head);font-size:.875rem;font-weight:700;margin-bottom:.2rem;color:var(--q-ink);}
.intent-opt-sub {font-size:.78rem;color:var(--q-muted);}
.contact-form-col {padding:5.5rem 4rem;background:#F8F7F4;}
.contact-form-col h2 {font-size:1.625rem;margin-bottom:.625rem;}
.contact-form-col > p {font-size:.9rem;color:var(--q-body);margin-bottom:2rem;line-height:1.65;}
.form-row {display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.fds-note {
  background:var(--q-green-pale);border:1px solid rgba(0,196,122,.2);
  border-radius:2px;padding:1.125rem 1.375rem;font-size:.9rem;
  color:var(--q-ink);margin-bottom:2rem;line-height:1.65;
}
.fds-note strong {color:var(--q-green-dim);}

/* ── INDIVIDUAL SERVICE PAGES ── */
.service-page-hero {padding:5rem 0 4rem;background:#fff;}
.benefit-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:3rem;}
.benefit-card {background:#fff;border:1px solid var(--q-border);border-radius:2px;padding:1.875rem;}
.benefit-card-icon {
  font-family:var(--font-head);font-size:1.5rem;font-weight:900;
  color:var(--q-green);margin-bottom:.875rem;
}
.benefit-card h4 {font-size:1rem;margin-bottom:.625rem;color:var(--q-ink);}
.benefit-card p {font-size:.875rem;color:var(--q-body);line-height:1.7;}
.process-steps {display:grid;gap:0;border:1px solid var(--q-border);}
.process-step {
  display:grid;grid-template-columns:4rem 1fr;gap:0;
  border-bottom:1px solid var(--q-border);background:#fff;
}
.process-step:last-child {border-bottom:none;}
.process-step:hover {background:#FAFAF8;}
.process-step-num {
  font-family:var(--font-head);font-size:1.5rem;font-weight:900;
  color:var(--q-green);padding:1.875rem 1.25rem;
  border-right:1px solid var(--q-border);
  display:flex;align-items:center;justify-content:center;
}
.process-step-body {padding:1.875rem 2rem;}
.process-step-body h4 {font-size:1rem;margin-bottom:.5rem;color:var(--q-ink);}
.process-step-body p {font-size:.9rem;color:var(--q-body);line-height:1.7;}
.model-compare {display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:3rem;}
.model-card {border:1px solid var(--q-border);border-radius:2px;padding:2rem;background:#fff;}
.model-card.featured {border-color:var(--q-green);background:var(--q-green-pale);}
.model-card h4 {font-size:1.0625rem;margin-bottom:.875rem;color:var(--q-ink);}
.model-card ul {list-style:none;}
.model-card ul li {
  font-size:.875rem;color:var(--q-body);padding:.35rem 0;
  display:flex;gap:.625rem;border-bottom:1px solid var(--q-border);line-height:1.5;
}
.model-card ul li:last-child {border-bottom:none;}
.model-card ul li::before {content:'-';color:var(--q-green);font-weight:700;flex-shrink:0;}

/* ── THANK YOU ── */
.thankyou-wrap {min-height:80vh;display:flex;align-items:center;justify-content:center;padding:4rem 0;background:#fff;}
.thankyou-box {text-align:center;max-width:560px;}
.thankyou-icon {
  width:72px;height:72px;background:var(--q-green-pale);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 2rem;font-size:2rem;
}
.thankyou-box h1 {font-size:2rem;margin-bottom:1rem;color:var(--q-ink);}
.thankyou-box p {font-size:1rem;color:var(--q-body);line-height:1.75;margin-bottom:2rem;}
.thankyou-actions {display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}

/* ── 404 ── */
.not-found-wrap {
  min-height:80vh;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;background:var(--q-black);
}
.not-found-content {text-align:center;position:relative;z-index:2;}
.not-found-number {
  font-family:var(--font-head);font-size:clamp(8rem,20vw,16rem);font-weight:900;
  color:var(--q-green);opacity:.12;line-height:1;margin-bottom:-2rem;
}
.not-found-content h1 {font-size:clamp(1.75rem,3vw,2.5rem);margin-bottom:1rem;color:#fff;}
.not-found-content p {font-size:1rem;color:#888;max-width:400px;margin:0 auto 2.5rem;line-height:1.75;}

/* ── LEGAL ── */
.legal-layout {display:grid;grid-template-columns:240px 1fr;gap:5rem;padding:4rem 0;align-items:start;}
.legal-nav {position:sticky;top:calc(var(--nav-h) + 1.5rem);}
.legal-nav a {
  display:block;font-family:var(--font-head);font-size:.8rem;
  color:var(--q-muted);text-decoration:none;padding:.5rem 0;
  border-bottom:1px solid var(--q-border);transition:color .2s;
}
.legal-nav a:hover {color:var(--q-green);}
.legal-content h2 {
  font-size:1.375rem;margin-top:3rem;margin-bottom:1rem;
  padding-top:1.5rem;border-top:1px solid var(--q-border);color:var(--q-ink);
}
.legal-content h2:first-child {margin-top:0;border-top:none;padding-top:0;}
.legal-content p {font-size:.9375rem;color:var(--q-body);line-height:1.85;margin-bottom:1.25rem;}
.legal-content ul {margin:0 0 1.25rem 1.75rem;}
.legal-content ul li {font-size:.9375rem;color:var(--q-body);margin-bottom:.5rem;line-height:1.65;}
.legal-content a {color:var(--q-green-dim);text-decoration:underline;}

/* ══ RESPONSIVE ══════════════════════════════════ */
@media (max-width:1024px) {
  .site-nav {padding:0 1.75rem;}
  .site-footer {padding:4rem 1.75rem 2rem;}
  .container {padding:0 1.5rem;}
  .footer-grid {grid-template-columns:1fr 1fr;gap:2.5rem;}
  .why-grid {grid-template-columns:1fr;gap:3.5rem;}
  .fyre-grid {grid-template-columns:1fr;gap:3.5rem;}
  .fyre-meta-grid {grid-template-columns:1fr 1fr;}
  .problem-inner {grid-template-columns:1fr;}
  .problem-col:first-child {border-right:none;border-bottom:1px solid var(--q-border);}
  .services-cards {grid-template-columns:1fr;background:none;gap:1.25rem;}
  .service-card {border:1px solid var(--q-border);}
  .service-row {grid-template-columns:1fr;gap:2.5rem;}
  .service-row-label {position:static;}
  .steps {grid-template-columns:repeat(3,1fr);}
  .insights-featured {grid-template-columns:1fr;}
  .insights-grid {grid-template-columns:1fr 1fr;}
  .related-grid {grid-template-columns:1fr 1fr;}
  .fyre-shifts {grid-template-columns:1fr 1fr;}
  .pitfall-grid {grid-template-columns:1fr 1fr;}
  .blog-featured {grid-template-columns:1fr;}
  .blog-feat-img {min-height:200px;}
  .gated-layout {grid-template-columns:1fr;}
  .gated-preview-col {display:none;}
  .contact-layout {grid-template-columns:1fr;}
  .benefit-grid {grid-template-columns:1fr 1fr;}
  .model-compare {grid-template-columns:1fr;}
  .legal-layout {grid-template-columns:1fr;}
  .legal-nav {position:static;display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem;}
  .legal-nav a {border-bottom:none;}
  .inner-hero {padding:4rem 0 3rem;}
}
@media (max-width:768px) {
  :root {--nav-h:68px;}
  .site-nav {padding:0 1.125rem;}
  .nav-logo img {height:52px;max-width:200px;}
  .nav-links {display:none;}
  .nav-hamburger {display:flex;}
  .site-footer {padding:3.5rem 1.25rem 2rem;margin-top:0;}
  .container {padding:0 1.125rem;}
  .section {padding:4rem 0;}
  .hero {min-height:auto;padding:1rem 0;}
  .hero-content {padding:3.5rem 0;}
  .hero-title {font-size:clamp(2.2rem,8vw,2.8rem);}
  .hero-proof {gap:2rem;}
  .hero-proof > div {min-width:calc(50% - 1rem);}
  .hero-actions {flex-direction:column;align-items:stretch;}
  .hero-actions .btn {text-align:center;justify-content:center;}
  .inner-hero {padding:3rem 0 2.5rem;}
  .inner-hero h1 {font-size:clamp(1.75rem,6vw,2.5rem);}
  .inner-hero-actions {flex-direction:column;align-items:stretch;}
  .inner-hero-actions .btn {justify-content:center;}
  .footer-grid {grid-template-columns:1fr;gap:2.5rem;}
  .footer-bottom {flex-direction:column;gap:1rem;text-align:center;}
  .footer-bottom div {display:flex;gap:1rem;justify-content:center;}
  .fyre-meta-grid {grid-template-columns:1fr;}
  .fyre-shifts {grid-template-columns:1fr;}
  .pitfall-grid {grid-template-columns:1fr;}
  .insight-cards {grid-template-columns:1fr;}
  .insights-grid {grid-template-columns:1fr;}
  .related-grid {grid-template-columns:1fr;}
  .fyre-grid {padding:3.5rem 0;gap:2.5rem;}
  .steps {grid-template-columns:1fr 1fr;}
  .blog-layout {grid-template-columns:1fr;}
  .blog-sidebar {display:none;}
  .blog-single-layout {grid-template-columns:1fr;gap:2.5rem;}
  .blog-single-aside {position:static;}
  .faq-list {margin-top:2rem;}
  .form-row {grid-template-columns:1fr;}
  .contact-info {padding:3.5rem 1.5rem;}
  .contact-form-col {padding:3.5rem 1.5rem;}
  .gated-form-col {padding:3.5rem 1.5rem;}
  .cta-banner {padding:4rem 0;}
  .benefit-grid {grid-template-columns:1fr;}
  .thankyou-actions {flex-direction:column;align-items:center;}
  .intent-options {grid-template-columns:1fr;}
  .wp-stats {grid-template-columns:1fr 1fr;}
  .fyre-pitfalls {padding:2.5rem 1.5rem;}
  .domain-item {padding:1.25rem 2rem;}
  .domain-item-label {font-size:.68rem;}
}
@media (max-width:420px) {
  .hero-title {font-size:1.9rem;}
  .hero-proof > div {min-width:100%;}
  .steps {grid-template-columns:1fr;}
  .wp-stats {grid-template-columns:1fr;}
  .nav-logo img {height:44px;max-width:168px;}
}
@media (prefers-reduced-motion:reduce) {
  .domain-track {animation:none;}
  * {transition-duration:.01ms!important;animation-duration:.01ms!important;}
}

.careers-layout{display:grid;grid-template-columns:260px 1fr;gap:3rem;align-items:start;margin-top:3rem;}
.careers-sidebar{position:sticky;top:5rem;}
.careers-sidebar-block{background:var(--q-surface);border:1px solid var(--q-border);border-radius:4px;padding:1.5rem;margin-bottom:1.5rem;}
.careers-sidebar-block h4{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--q-muted);margin-bottom:1rem;}
.filter-pills{display:flex;flex-wrap:wrap;gap:.5rem;}
.filter-pill{font-size:.72rem;font-weight:600;padding:.35rem .85rem;border-radius:2px;border:1px solid var(--q-border);background:transparent;color:var(--q-body);cursor:pointer;transition:all .2s;}
.filter-pill.active,.filter-pill:hover{background:var(--q-green);border-color:var(--q-green);color:#0A0A08;}
.job-cards{display:flex;flex-direction:column;gap:1rem;}
.job-card{background:var(--q-surface);border:1px solid var(--q-border);border-radius:4px;padding:1.5rem;transition:border-color .2s,box-shadow .2s;}
.job-card:hover{border-color:var(--q-green);box-shadow:0 2px 12px rgba(0,196,122,.08);}
.job-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.875rem;}
.job-card-title{font-size:1rem;font-weight:700;color:var(--q-ink);text-decoration:none;}
.job-card-title:hover{color:var(--q-green);}
.job-card-meta{display:flex;gap:1.25rem;flex-wrap:wrap;font-size:.75rem;color:var(--q-muted);margin-bottom:.875rem;}
.job-tag-list{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;}
.job-card-footer{display:flex;justify-content:flex-end;}
.careers-main-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--q-border);}
.job-count{font-size:.75rem;color:var(--q-muted);}
@media(max-width:1024px){.careers-layout{grid-template-columns:220px 1fr;gap:2rem;}}
@media(max-width:768px){.careers-layout{grid-template-columns:1fr;}.careers-sidebar{position:static;}}



/* ── Careers pages (from careers.py inline) ── */
e_v7_careers.py
Builds:
- /careers/ main page (two-column layout)
- 12 individual job pages (/careers/[slug]/)
- /careers/apply/thank-you/ 
- /insights/tech-talent-pulse/ (survey hub)
- /insights/tech-talent-pulse/candidate/ (Google Form embed)
- /insights/tech-talent-pulse/hiring-leader/ (Google Form embed)
- /insights/tech-talent-pulse/ta-practitioner/ (Google Form embed)
"""

import sys, os
sys.path.insert(0, '/home/claude')
exec(open('/home/claude/qfyre_v7_shared.py').read())

OUT = '/mnt/user-data/outputs/'

# ═══════════════════════════════════════════════════════════
# JOB DATA — 12 roles rebuilt from project JDs
# ═══════════════════════════════════════════════════════════
JOBS = [
    {
        'id': 'cloud-architect-aws',
        'title': 'Cloud Architect, AWS and Mobile Platforms',
        'category': 'Architecture and Cloud',
        'location': 'Bengaluru / Hyderabad',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '10+ years',
        'slug': 'cloud-architect-aws-mobile',
        'summary': 'Own the technical direction of cloud and mobile platform strategy for a global enterprise. Define architecture patterns, drive cloud-native adoption, and lead a team of senior engineers across AWS-based solutions.',
        'about': 'This is a senior technical leadership role embedded within a fast-moving enterprise engineering organisation. You will own the architecture and technical decision-making for Digital Mobile and AWS cloud strategy, working across complex, cross-functional programmes at enterprise scale.',
        'responsibilities': [
            'Own technical decisions and direction of the Digital Mobile and AWS cloud strategy for enterprise-facing applications',
            'Define and drive overall technical architecture across cloud and non-cloud solutions, owning responsibility for delivery quality',
            'Oversee each phase of the software application development lifecycle, planning, design, build, test, deploy, and operate',
            'Develop and enforce business and technical operating procedures, standards, and architectural governance',
            'Create architectural diagrams, technical documentation, and design specifications for complex multi-system solutions',
            'Identify application and business requirements through structured engagement with technical teams, product owners, and client stakeholders',
            'Evaluate, recommend, and drive adoption of new technologies, from infrastructure to application frameworks',
            'Provide technical mentorship to senior and mid-level engineers, establishing best practices across the team',
            'Architect specialisations covering Application and Integration, AWS, DevSecOps, Site Reliability Engineering, Platform, and Security',
        ],
        'must_have': [
            "Bachelor's degree in Computer Science, Information Systems, or related technical field",
            '10+ years in a Mobile Architecture or Lead Software Engineering capacity at enterprise scale',
            'Deep experience with enterprise software architecture, applications, integrations, security, and platform engineering for mobile and web',
            'Expert proficiency in cloud-native development: JavaScript/TypeScript, Java, Swift, Node.js',
            'Hands-on expertise with AWS Serverless Architecture, CDK, S3, Route53, Lambda, KMS, EC2, IAM, ELB',
            'Strong command of REST APIs, GraphQL, Gitlab, and 12-factor application development principles',
            'Proven ability to design highly performant networking systems, load balancing, reverse-proxying, gateway auto-scaling',
            'Advanced proficiency in Agile methodologies, DevOps principles, and object-oriented design patterns',
            'Application Security expertise including secure-by-design and zero-trust architecture principles',
            'Strong communication and stakeholder management skills across technical and business audiences',
        ],
        'nice_to_have': [
            'Experience with microservice development on cloud platforms using 12-factor architectural patterns',
            'Full SDLC experience including planning, design, implementation, testing, deployment, monitoring, and maintenance',
            'Ability to assess and communicate financial implications of architectural decisions',
            'Experience building flexible APIs and microservice solutions for mobile application consumers',
        ],
        'what_qfyre_offers': [
            'Placement within a high-growth global enterprise or GCC environment',
            'Technical leadership remit with genuine architectural ownership, not just advisory',
            'Competitive compensation benchmarked against market leaders',
            'Hybrid working with flexibility built into the engagement',
            'Access to cutting-edge cloud and AI/ML infrastructure at enterprise scale',
        ],
        'tags': ['AWS', 'Cloud Architecture', 'Mobile', 'DevSecOps', 'Enterprise'],
    },
    {
        'id': 'senior-ml-engineer-azure',
        'title': 'Senior Machine Learning Engineer, Azure MLOps',
        'category': 'AI and Machine Learning',
        'location': 'Bengaluru / Hyderabad',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '5+ years',
        'slug': 'senior-ml-engineer-azure-mlops',
        'summary': 'Design and operate end-to-end ML pipelines on Azure at enterprise scale. Own the MLOps infrastructure, from CI/CD pipelines and containerised model deployment to cost governance and cross-team technical liaison.',
        'about': 'A senior engineering role for an ML practitioner who is as strong on operations and deployment as they are on modelling. You will own the production reliability of ML systems, build reusable pipeline frameworks, and work as the technical bridge between data science, DevOps, and IT teams.',
        'responsibilities': [
            'Design and manage end-to-end ML pipelines using Azure ML, Databricks, and PySpark for large-scale data processing and model training',
            'Build and maintain automated CI/CD pipelines using GitHub Actions with SonarQube integration for code quality and security',
            'Develop reusable, modular ML pipeline templates to drive deployment efficiency across the enterprise',
            'Containerise and deploy ML models using Azure Kubernetes Service (AKS) and Docker, ensuring high availability and auto-scaling',
            'Design and manage secure APIs for ML model interaction with downstream applications',
            'Perform model lifecycle management, optimisation, data drift monitoring, and automated data refresh checks',
            'Implement cost-monitoring strategies for high-compute training and deployment phases',
            'Maintain detailed technical documentation for workflows, pipeline templates, and optimisation strategies',
            'Act as the technical liaison between Data Scientists, DevOps, and IT teams across Dev, QA, and Production environments',
        ],
        'must_have': [
            "Bachelor's degree in Engineering, Computer Science, or related field",
            '5+ years of experience with deep focus on the Azure MLOps toolstack',
            'Proven track record of deploying and maintaining ML models in high-scale production environments',
            'Hands-on expertise with Azure Machine Learning and Databricks',
            'Strong command of Kubernetes (AKS) and API-based deployment platforms',
            'Solid grasp of DevOps practices and containerisation with Docker',
            'Experience with code quality automation tools including SonarQube',
            'Exceptional problem-solving skills with the ability to operate in a fast-paced collaborative environment',
        ],
        'nice_to_have': [
            'Familiarity with broader solution architecture principles',
            'Azure certifications: AI-900, DP-100, or AZ-305',
            'Experience with PySpark and large-scale distributed data processing',
        ],
        'what_qfyre_offers': [
            'Placement in a high-impact MLOps role within an enterprise AI programme',
            'Genuine ownership of production ML infrastructure, not a support role',
            'Market-competitive compensation with flexibility on hybrid working',
            'Exposure to cutting-edge Azure AI toolstack at scale',
        ],
        'tags': ['Azure ML', 'MLOps', 'Databricks', 'AKS', 'CI/CD', 'AI'],
    },
    {
        'id': 'ml-lead-analyst-genai',
        'title': 'Machine Learning Lead Analyst, Generative AI',
        'category': 'AI and Machine Learning',
        'location': 'Bengaluru / Remote',
        'type': 'Full Time',
        'mode': 'Remote-first / Hybrid',
        'experience': '6+ years',
        'slug': 'ml-lead-analyst-generative-ai',
        'summary': 'Lead the design and delivery of enterprise-grade Generative AI and LLM solutions, from scalable ML pipelines and RAG architectures to responsible AI governance and real-time insight dashboards.',
        'about': 'This role sits at the intersection of Generative AI engineering and enterprise product development. You will serve as a GenAI subject matter expert and hands-on architect, building production-ready solutions that combine LLMs, vector databases, and API integrations with a focus on privacy, security, and business outcomes.',
        'responsibilities': [
            'Build scalable software solutions using LLMs and other ML models to solve complex enterprise challenges',
            'Architect and develop enterprise-grade AI solutions with focus on privacy, security, fairness, and responsible AI practices',
            'Design AI output structures (JSON, HTML, nested nodes) that can be consumed directly by downstream dashboards with minimal development overhead',
            'Build extensible API integrations and low-code UI/UX solutions to extract, process, and surface AI insights in high-performing dashboards',
            'Work with Product Development as a GenAI subject matter expert, envision solution outcomes and design viable architectures to meet them',
            'Understand how AI models interpret datasets and build prompts that reliably produce expected outcomes',
            'Architect and develop infrastructure for scalable, distributed ML systems',
            'Work with frameworks including TensorFlow, PyTorch, Hugging Face, LangChain, and LlamaIndex',
            'Optimise generative AI models for performance, scalability, and efficiency',
            'Develop and maintain AI pipelines, data preprocessing, feature extraction, model training, evaluation, and deployment',
            'Contribute to the establishment of best practices and standards for GenAI development',
        ],
        'must_have': [
            '6+ years overall experience; 5+ years full-stack engineering (C#, Python)',
            'Proficiency in designing architecture, building API integrations, configuring cloud services, and setting up authentication, monitoring, and logging',
            'Production experience implementing AI systems, computer vision, NLP, and/or enterprise AI at scale',
            'Experience with vector databases (Pinecone or equivalent) for information retrieval',
            'Strong understanding of NLG and GenAI, transformers, LLMs, text embeddings',
            'Experience designing scalable classification, text extraction, and data connector systems across formats (PDF, CSV, DOCX)',
            'ML libraries and frameworks: PyTorch, TensorFlow, Hugging Face, LangChain, LlamaIndex',
            '3+ years in a technical leadership role setting technical direction for project teams',
            'Programming proficiency in C/C++, Java, and Python',
            'Excellent problem-solving and communication skills for both technical and non-technical audiences',
        ],
        'nice_to_have': [
            'Experience with cloud-based platforms, AWS, GCP, or Azure',
            'Exposure to self-supervised learning, transfer learning, and reinforcement learning',
        ],
        'what_qfyre_offers': [
            'GenAI leadership role with genuine technical ownership and cross-functional influence',
            'Exposure to cutting-edge LLM and RAG architectures at enterprise scale',
            'Competitive compensation package with remote-first flexibility',
            'Opportunity to define GenAI best practices for a high-growth enterprise programme',
        ],
        'tags': ['LLMs', 'GenAI', 'Python', 'RAG', 'NLP', 'PyTorch', 'AI'],
    },
    {
        'id': 'sr-manager-data-science',
        'title': 'Senior Manager, Data Science and Engineering',
        'category': 'Data and Analytics Leadership',
        'location': 'Bengaluru',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '8+ years',
        'slug': 'senior-manager-data-science-engineering',
        'summary': 'Build and lead a high-performing team of data scientists and engineers delivering production-grade predictive models, ML pipelines, and data products for a global enterprise. Collaborate across US and Europe-based stakeholders.',
        'about': 'A senior leadership role for an experienced data professional who can build a team, set technical direction, and own delivery of complex data science and engineering programmes. You will operate at the intersection of technical depth and business stakeholder engagement, managing sprint processes, enforcing best practices, and staying ahead of emerging technologies.',
        'responsibilities': [
            'Screen, interview, onboard, and manage a high-performing team of data scientists and data engineers',
            'Establish, prioritise, and manage the team sprint process using agile methodology, ensuring work connects to desired business outcomes',
            'Ensure the team follows technical best practices in building, maintaining, and enhancing scalable predictive models including code version control, pipeline management, deployment, and documentation',
            'Stay connected to internal and external emerging technologies, proactively recommend high-impact applications',
            'Establish close collaboration with local and global GPS and IT functional data science and data engineering experts',
            'Collaborate with USA and Europe-based product development team members and stakeholders',
            'Apply techniques including machine learning, data science, computer vision, AI, statistics, and applied mathematics as appropriate',
            'Work hours that provide sufficient overlap with standard East Coast US business hours',
        ],
        'must_have': [
            "Bachelor's or Master's degree in an analytical, engineering, or scientific discipline",
            '6+ years working in data and analytics including direct development experience',
            'Strong project management skills ensuring timely delivery of data science programmes',
            'Excellent communication and interpersonal skills for both technical and non-technical stakeholders at all levels',
            'Excellent leadership and management skills, drive collaboration and deliver results in dynamic environments',
            'Solid understanding of digital analytics tools and platforms',
            'Experience with large datasets, data visualisation, statistical software (R, Python, advanced SQL, Tableau)',
        ],
        'nice_to_have': [
            'Experience managing or leading teams, significant advantage',
            'Experience in agile environments with JIRA or equivalent tools',
            'Experience deploying predictive models, cloud-based ELT pipelines, and simulation/optimisation models',
            'Familiarity with Domino, AWS, GitHub, dbt platforms',
        ],
        'what_qfyre_offers': [
            'Senior leadership mandate with team-building ownership and technical authority',
            'High-visibility global role with cross-continental stakeholder engagement',
            'Competitive senior leadership compensation package',
            'Hybrid working with structured collaboration model',
        ],
        'tags': ['Data Science', 'ML', 'Python', 'Leadership', 'Analytics', 'AWS'],
    },
    {
        'id': 'senior-cloud-network-engineer',
        'title': 'Senior Cloud Network Engineer I',
        'category': 'Cloud and Infrastructure',
        'location': 'Hyderabad',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '5+ years',
        'slug': 'senior-cloud-network-engineer',
        'summary': 'Design and operate cloud-native network architectures at enterprise scale. Heavy emphasis on Network as Code and Infrastructure as Code, using Terraform, Ansible, and multi-cloud connectivity across AWS, Azure, and GCP.',
        'about': 'A senior engineering role for a cloud network specialist who combines deep technical expertise with infrastructure-as-code fluency. You will develop and maintain technical solutions for cloud networks, lead large-scale projects, and serve as a technical escalation point within a high-growth cloud services team.',
        'responsibilities': [
            'Manage cloud network products and solutions, design, low-level engineering, and delivery of new solutions across cloud provider networks',
            'Design and deploy scalable, highly available, and secure network architectures across multiple cloud service providers',
            'Configure and manage cloud networking components, VPCs, subnets, firewalls, VPNs, Direct Connect, ExpressRoute',
            'Develop Infrastructure as Code using Ansible (AAP) and Terraform with Harness and GitHub Actions',
            'Implement and manage multi-cloud and hybrid connectivity solutions across cloud platforms and on-premises data centres',
            'Monitor and optimise network performance, latency, throughput, reliability, and security',
            'Act as primary point of contact for Network Compliance, segmentation, patching strategy, and IAM',
            'Train and mentor team members; serve as escalation point for service delivery and operational issues',
            'Maintain detailed technical documentation using Confluence and Visio, high-level and low-level designs, as-builds, detailed diagrams',
        ],
        'must_have': [
            "Bachelor's degree in Computer Science or related field (or equivalent experience and certification)",
            '5+ years of network development experience including DevOps-related work with AAP, Terraform, Harness, and Git',
            '5+ years of experience in a lead or SME role delivering resilient cloud-based network solutions',
            'Deep expertise with cloud-native networking, VPC, NLB/ALB, Internet Gateways, Transit Gateways, Route 53',
            'Infrastructure as Code proficiency with Ansible (AAP) and Terraform',
            'Experience with multi-cloud and hybrid connectivity across AWS, Azure, and/or GCP',
            'Strong influencing skills and ability to drive change through collaboration',
            'Excellent verbal and written communication skills',
            'Solid understanding of Agile SAFe',
        ],
        'nice_to_have': [
            "Master's degree in Computer Science or related field",
            'Certification: CCIE, CCNP, PCNSE, CCSA, CCSE, or AWS Certified Advanced Networking',
        ],
        'what_qfyre_offers': [
            'Senior network engineering mandate in a high-growth cloud services environment',
            'Genuine technical leadership scope, not just hands-on delivery',
            'Hybrid working model in Hyderabad',
            'Competitive compensation with growth trajectory',
        ],
        'tags': ['Cloud Network', 'Terraform', 'AWS', 'IaC', 'Ansible', 'DevOps'],
    },
    {
        'id': 'senior-cloud-network-engineer-2',
        'title': 'Senior Cloud Network Engineer I, Multi-Cloud Specialisation',
        'category': 'Cloud and Infrastructure',
        'location': 'Bengaluru',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '5+ years',
        'slug': 'senior-cloud-network-engineer-multicloud',
        'summary': 'Second active opening for a Senior Cloud Network Engineer with emphasis on multi-cloud connectivity, network security compliance, and IaC-driven delivery. Bengaluru base.',
        'about': 'Same core mandate as the Hyderabad opening, this position is based in Bengaluru and is particularly suited to candidates with strong multi-cloud experience across AWS and Azure, combined with a security-first approach to network design.',
        'responsibilities': [
            'Design and deploy multi-cloud network architectures with focus on security, compliance, and operational efficiency',
            'Own Network as Code delivery using Terraform and Ansible across cloud and hybrid environments',
            'Configure and manage cloud networking components, VPCs, subnets, firewalls, VPNs, and cross-cloud connectivity',
            'Implement network security best practices and ensure compliance with enterprise security standards',
            'Monitor and optimise network performance metrics, latency, throughput, and availability',
            'Conduct regular network performance tests and troubleshooting to identify and resolve issues at scale',
            'Maintain comprehensive technical documentation for all network configurations and changes',
            'Participate in capacity planning and scaling of network infrastructure to meet growing demands',
        ],
        'must_have': [
            '5+ years of cloud network engineering experience with IaC proficiency',
            'Hands-on expertise with Terraform, Ansible (AAP), and Git-based workflows',
            'Strong multi-cloud experience across AWS, Azure, and/or GCP',
            'Experience with cloud-native networking, VPC, NLB/ALB, Transit Gateways, Route 53',
            'Network security and compliance expertise including IAM and segmentation',
            'Excellent verbal and written communication skills',
        ],
        'nice_to_have': [
            'AWS Certified Advanced Networking or equivalent certification',
            'Experience with Harness for deployment orchestration',
        ],
        'what_qfyre_offers': [
            'Bengaluru-based role with hybrid flexibility',
            'Multi-cloud scope across AWS and Azure at enterprise scale',
            'Technical leadership with compliance ownership',
            'Competitive total compensation',
        ],
        'tags': ['Cloud Network', 'Multi-Cloud', 'AWS', 'Azure', 'Terraform', 'Security'],
    },
    {
        'id': 'lead-salesforce-developer',
        'title': 'Lead Application Development, Salesforce',
        'category': 'Application Development',
        'location': 'Bengaluru / Remote',
        'type': 'Full Time',
        'mode': 'Remote-first / Hybrid',
        'experience': '4+ years',
        'slug': 'lead-salesforce-application-development',
        'summary': 'Own high-level solution design and technical leadership for Salesforce implementations in a complex enterprise environment. Lead evaluation, architecture, development, and integration across the full Salesforce platform.',
        'about': 'A hands-on technical leadership role for a Salesforce engineer who can bridge the gap between business requirements and platform architecture. You will own the Salesforce data model, lead integrations, and support a development team, while staying current with Salesforce releases and driving platform innovation.',
        'responsibilities': [
            'Own high-level design and documentation of solution frameworks to address enterprise user needs',
            'Lead technical evaluation of user stories including gap analysis between Salesforce functionality and client requirements',
            'Maintain and extend all Salesforce extensions and third-party integrations',
            'Own Salesforce underlying data model, documentation, data governance, and extension',
            'Create internal how-to guides and technical training documentation',
            'Collaborate with cross-functional teams to identify automation opportunities within Salesforce aligned to business goals',
            'Provide technical leadership to the Salesforce team, best practices in integration, development, testing, and deployment',
            'Support the Development Lead in managing complex solution implementation, code review, and deployments',
            'Troubleshoot problems and manage ongoing support requests from end users',
            'Stay current with Salesforce features, releases, and industry best practices',
        ],
        'must_have': [
            "BS/BA degree in Computer Science or Information Systems",
            '4+ years of Salesforce development and/or administration experience',
            'Solid understanding of Salesforce.com architecture and API',
            'Proven track record on complex Salesforce projects involving third-party vendor integrations',
            'Hands-on experience with LWC, Apex classes, triggers, and Flows',
            'Experience using Salesforce data tools, Data Loader, Workbench, Visual Studio Code',
            'Experience with deployment toolsets and version control',
            'Experience with Agile tools, Jira, Azure DevOps, or equivalent',
            'Strong analytical, process design, and problem-solving skills',
            'Excellent communication skills for both technical and non-technical audiences',
        ],
        'nice_to_have': [
            'Experience with Boomi or other integration platforms',
            'Salesforce certification (Platform Developer I/II, Application Architect)',
        ],
        'what_qfyre_offers': [
            'Technical leadership ownership on high-complexity Salesforce programmes',
            'Remote-first flexibility with collaborative hybrid model',
            'Competitive compensation benchmarked to senior Salesforce market rates',
            'Exposure to large-scale enterprise Salesforce ecosystems',
        ],
        'tags': ['Salesforce', 'LWC', 'Apex', 'CRM', 'Integration', 'API'],
    },
    {
        'id': 'senior-java-engineer-pos',
        'title': 'Senior Engineer, Java and POS Services Development',
        'category': 'Application Development',
        'location': 'Bengaluru / Hyderabad',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '6–9 years',
        'slug': 'senior-java-engineer-pos-services',
        'summary': 'Design and build high-availability Java-based POS services for a large-scale retail technology environment. Own technical implementation across the full software lifecycle, from requirements breakdown to production release and support.',
        'about': 'A hands-on senior engineering role for a Java specialist who can operate confidently across the full development lifecycle. You will work closely with business leads, product owners, and cross-functional teams, delivering rapid, high-quality updates to business-critical POS services.',
        'responsibilities': [
            'Collaborate with functional business leads and technology partners to provide a high level of engineering service',
            'Participate actively in all Agile ceremonies as part of the Scrum team',
            'Work with the project team to define, break down, and estimate requirements',
            'Implement rapid updates to fulfil changing business and marketing requirements',
            'Create technical documentation, architectural designs, flow diagrams, implementation approaches, and pseudocode',
            'Create and maintain macro technical designs for POS service components',
            'Identify technical and delivery risks and form contingency plans proactively',
            'Deliver across the entire software lifecycle, concept, design, build, deploy, test, release, and support',
            'Collaborate with API, Android, and Web development teams on architectural vision and roadmap',
            'Guide and mentor junior engineers on best practices and engineering standards',
        ],
        'must_have': [
            '6–9 years of Java/J2EE development experience',
            'Proficiency in Java, Spring Boot, SQL, Log4j, Web Services (SOAP/XML/REST/JSON)',
            'Experience with Oracle/H2 or equivalent relational databases',
            'Experience with Test Driven Development and CI/CD pipelines',
            'Proven cross-team collaboration and stakeholder engagement skills',
            'Mentoring and technical guidance experience',
        ],
        'nice_to_have': [
            'Experience with Kafka integrations',
            'Experience with Docker, Kubernetes, OpenShift, or Azure',
            'Experience with Reactive programming',
            'Experience with Oracle POS (point of sale) systems',
            'Experience with Android SDK',
        ],
        'what_qfyre_offers': [
            'Senior engineering mandate with full lifecycle ownership',
            'Exposure to high-scale retail technology infrastructure',
            'Hybrid working across Bengaluru or Hyderabad',
            'Competitive compensation with career growth trajectory',
        ],
        'tags': ['Java', 'Spring Boot', 'REST APIs', 'SQL', 'CI/CD', 'Agile'],
    },
    {
        'id': 'production-support-engineer',
        'title': 'Production Support Engineer, Java and Application Operations',
        'category': 'Application Development',
        'location': 'Bengaluru',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '6+ years',
        'slug': 'production-support-engineer-java',
        'summary': 'Triage, debug, and resolve production issues in a complex Java and Spring Boot environment. Own ticket queues, monitor jobs, perform regression checkouts, and support release cycles for business-critical enterprise systems.',
        'about': 'A technically strong production support role for an engineer who combines coding proficiency with operational instinct. You will work within a team of engineers and analysts, debugging production issues, managing ticket resolution, and ensuring system stability. On-call rotation is required including weekend support with weekday comp offs.',
        'responsibilities': [
            'Triage technical and functional issues as a key team contributor alongside engineers and analysts',
            'Manage day-to-day ticket queues using coding skills, not just coordination',
            'Debug production issues using Java and Spring Boot, root cause analysis and resolution',
            'Monitor operational trends and job queues; respond to job failures and system anomalies',
            'Execute regression checkouts, both ad hoc and planned release cycles',
            'Create, coordinate, and track resolution of engineering stories required to fix production tickets',
            'Perform data mining for production checkouts and ad hoc data research',
            'Support release checkout POCs and coordinate with development and release teams',
            'Participate in on-call support rotation, available for either of two shifts; weekend rotation with weekday comp offs',
        ],
        'must_have': [
            '6+ years of experience in application development or maintenance',
            "College degree (Bachelor's) in a related technical or business field, or equivalent experience",
            'Working knowledge of TypeScript, Java, and MongoDB',
            'Ability to understand and navigate complex architectural systems',
            'Strong analytical skills with demonstrated ability to perform root cause analysis and suggest rectification',
        ],
        'nice_to_have': [
            "BE or MCA degree preferred",
            'Exposure to production environment operations',
            'Familiarity with cloud-based architectures and their application in complex systems',
            'Passion for operational analysis and learning in fast-changing environments',
        ],
        'what_qfyre_offers': [
            'Strong technical environment with experienced engineering peers',
            'Clear career path from production support to application development',
            'Competitive compensation with structured on-call allowance',
            'Flexible on-call structure with compensatory time off',
        ],
        'tags': ['Java', 'Spring Boot', 'MongoDB', 'Production Support', 'TypeScript'],
    },
    {
        'id': 'ml-lead-analyst-enterprise',
        'title': 'Machine Learning Lead Analyst, Enterprise AI Systems',
        'category': 'AI and Machine Learning',
        'location': 'Hyderabad / Remote',
        'type': 'Full Time',
        'mode': 'Remote-first',
        'experience': '6+ years',
        'slug': 'ml-lead-analyst-enterprise-ai',
        'summary': 'Second active opening for an ML Lead Analyst, this position is Hyderabad-based or remote-first and particularly suited to candidates with strong production AI deployment experience in enterprise settings.',
        'about': 'Identical mandate to the Bengaluru ML Lead Analyst role, this opening is available for Hyderabad-based professionals or those preferring a remote-first arrangement. Emphasis on production deployment of AI systems, responsible AI practices, and enterprise-grade GenAI solution architecture.',
        'responsibilities': [
            'Build scalable GenAI and LLM solutions for enterprise use cases, privacy, security, and fairness by design',
            'Architect end-to-end AI pipelines from data preprocessing through model training, evaluation, and production deployment',
            'Design structured AI outputs (JSON, HTML) for direct consumption by downstream dashboards and applications',
            'Build extensible API integrations and low-code UI/UX solutions surfacing AI insights',
            'Optimise generative AI models for performance, scalability, and efficiency at enterprise scale',
            'Develop and maintain AI pipelines across the full lifecycle',
            'Establish and contribute to GenAI development best practices and standards',
        ],
        'must_have': [
            '6+ years overall experience with 5+ years in full-stack AI engineering',
            'Production experience with AI systems in enterprise settings',
            'LLM and GenAI expertise, transformers, embeddings, vector databases',
            'Proficiency in Python, C#, PyTorch, TensorFlow, Hugging Face, LangChain',
            'Strong engineering fundamentals, data structures, algorithms, distributed systems',
        ],
        'nice_to_have': [
            'AWS, GCP, or Azure cloud platform experience',
            'Exposure to computer vision and multimodal AI systems',
        ],
        'what_qfyre_offers': [
            'Remote-first flexibility for Hyderabad-based or distributed talent',
            'Genuine GenAI technical leadership at enterprise scale',
            'Competitive compensation with performance upside',
        ],
        'tags': ['LLMs', 'GenAI', 'Python', 'NLP', 'Remote', 'Enterprise AI'],
    },
    {
        'id': 'cloud-architect-enterprise-2',
        'title': 'Cloud Architect, Enterprise Platform and Integration',
        'category': 'Architecture and Cloud',
        'location': 'Bengaluru',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '10+ years',
        'slug': 'cloud-architect-enterprise-platform',
        'summary': 'Second active Cloud Architect opening, this position focuses on enterprise platform and integration architecture for large-scale AWS environments, with specialisation in DevSecOps, Site Reliability Engineering, and security architecture.',
        'about': 'For architects who want to own not just the design but the technical accountability of enterprise-scale cloud platforms. This role focuses on the intersection of platform, integration, and security architecture, working across complex enterprise programmes with significant stakeholder engagement.',
        'responsibilities': [
            'Own technical direction for enterprise platform and integration architecture across AWS and hybrid environments',
            'Define and drive DevSecOps, SRE, and security architectural patterns at enterprise scale',
            'Develop and enforce architectural governance frameworks and technical operating standards',
            'Mentor senior engineers and establish best practices across cloud-native development',
            'Identify and drive adoption of emerging technologies with strategic impact',
            'Communicate technical decisions and financial implications to executive stakeholders',
        ],
        'must_have': [
            '10+ years in platform or cloud architecture at enterprise scale',
            'Expert proficiency in AWS services, CDK, Lambda, ELB, IAM, EC2, KMS',
            'Deep DevSecOps, SRE, and security architecture experience',
            'Strong stakeholder management and technical communication skills',
            'Application Security and 12-factor architecture expertise',
        ],
        'nice_to_have': [
            'AWS Solutions Architect Professional or equivalent',
            'Experience with FinOps and cloud cost management at scale',
        ],
        'what_qfyre_offers': [
            'Senior technical leadership mandate with genuine architectural authority',
            'Exposure to complex enterprise AWS environments at scale',
            'Competitive senior compensation package',
            'Bengaluru hybrid working',
        ],
        'tags': ['AWS', 'Platform Architecture', 'DevSecOps', 'SRE', 'Security'],
    },
    {
        'id': 'manager-accounting-ops',
        'title': 'Manager, Accounting Operations (Insurance and Retirement)',
        'category': 'Finance and Operations',
        'location': 'Bengaluru / Hyderabad',
        'type': 'Full Time',
        'mode': 'Hybrid',
        'experience': '8–12 years',
        'slug': 'manager-accounting-operations-insurance-retirement',
        'summary': 'Lead accounting operations for insurance and retirement functions within a large enterprise, managing compliance, overseeing a team of specialists, and driving operational process improvement across complex regulatory frameworks.',
        'about': 'A senior accounting operations role for a finance professional with deep insurance and/or retirement accounting expertise. You will lead a team of consultants and specialists, manage regulatory compliance obligations (NAIC, SEC, ERISA), and support internal and external audit processes in a complex enterprise environment.',
        'responsibilities': [
            'Lead retirement accounting oversight, manage contribution tracking, benefit disbursement reconciliation, and audit-ready financial records',
            'Oversee insurance accounting operations ensuring accurate documentation and timely execution per NAIC, SEC, and applicable regulations',
            'Implement and monitor internal controls across insurance and retirement workflows, identify and escalate anomalies',
            'Optimise operational workflows to improve efficiency, accuracy, and scalability across both functions',
            'Manage a team of consultants and specialists, coaching, guidance, and performance oversight',
            'Support internal and external audits with accurate records and full compliance documentation',
            'Ensure alignment with enterprise risk management frameworks',
        ],
        'must_have': [
            "Bachelor's degree in Accounting, Finance, Business Administration, Insurance, or related field",
            '8–12 years of experience in insurance and/or retirement accounting',
            'Preferably within HR or employee benefits contexts',
            'Experience managing teams and coordinating with third-party providers',
            'Familiarity with regulatory frameworks and audit requirements for employee benefits',
            'Strong understanding of US GAAP, NAIC, and SEC regulatory requirements',
            'Excellent communication skills across internal and external stakeholders',
        ],
        'nice_to_have': [
            'Advanced certifications: CPA, FLMI, or CPCU strongly preferred',
            'Experience with Workday, SAP, or Oracle Financial modules',
        ],
        'what_qfyre_offers': [
            'Senior finance operations mandate within a large-scale global enterprise',
            'Team leadership scope with genuine process improvement ownership',
            'Competitive total compensation package',
            'Hybrid working in Bengaluru or Hyderabad',
        ],
        'tags': ['Accounting', 'Insurance', 'Retirement', 'US GAAP', 'Finance', 'CPA'],
    },
]

# ═══════════════════════════════════════════════════════════
# CAREERS PAGE — TWO COLUMN LAYOUT
# ═══════════════════════════════════════════════════════════

CAREERS_CSS = """
/* ── Careers Page ── */
.careers-layout { display: grid; grid-template-columns: 320px 1fr; gap: 0; min-height: 80vh; }
.careers-sidebar {
  padding: 3rem 2.5rem;
  background: #F8F7F4;
  border-right: 1px solid var(--q-border);
  position: sticky;
  top: var(--nav-h);
  height: calc(100vh - var(--nav-h));
  overflow-y: auto;
  align-self: start;
}
.careers-sidebar-title {
  font-family: var(--font-head);
  font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--q-muted); margin-bottom: 1.5rem;
  padding-bottom: .875rem; border-bottom: 1px solid var(--q-border);
}
.careers-employer-block {
  margin-bottom: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--q-border);
}
.careers-employer-block h3 {
  font-size: 1.125rem; margin-bottom: .625rem; color: var(--q-ink);
}
.careers-employer-block p {
  font-size: .875rem; color: var(--q-body); line-height: 1.7;
}
.careers-filter-label {
  font-family: var(--font-head); font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--q-muted); margin-bottom: .75rem; margin-top: 1.5rem;
  display: block;
}
.filter-pills { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.filter-pill {
  font-family: var(--font-head); font-size: .62rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em;
  padding: .3rem .75rem; border: 1px solid var(--q-border);
  border-radius: 2px; background: #fff; color: var(--q-muted);
  cursor: pointer; transition: all .2s;
}
.filter-pill:hover, .filter-pill.active {
  background: var(--q-ink); color: #fff; border-color: var(--q-ink);
}
.careers-cta-block {
  background: var(--q-black); border-radius: 2px;
  padding: 1.75rem; margin-top: 2.25rem;
}
.careers-cta-block h4 {
  font-size: .9375rem; color: #fff; margin-bottom: .5rem;
}
.careers-cta-block p {
  font-size: .83rem; color: #888; line-height: 1.6; margin-bottom: 1.25rem;
}
.careers-main { padding: 3rem 2.5rem; }
.careers-header {
  display: flex; justify-content: space-between; align-items: flex-end;
  margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--q-border);
}
.careers-count {
  font-family: var(--font-head); font-size: .78rem; color: var(--q-muted);
}
.job-cards { display: grid; gap: 1px; background: var(--q-border); border: 1px solid var(--q-border); }
.job-card {
  background: #fff; padding: 1.75rem 2rem;
  display: grid; grid-template-columns: 1fr auto;
  gap: 1rem; align-items: center;
  transition: background .2s;
}
.job-card:hover { background: #FAFAF8; }
.job-card-left {}
.job-card-title {
  font-family: var(--font-head); font-size: 1.0625rem; font-weight: 700;
  color: var(--q-ink); text-decoration: none; margin-bottom: .5rem; display: block;
}
.job-card-title:hover { color: var(--q-green); }
.job-card-meta {
  display: flex; gap: 1.25rem; flex-wrap: wrap;
  font-family: var(--font-head); font-size: .68rem; color: var(--q-muted);
}
.job-card-meta span { display: flex; align-items: center; gap: .35rem; }
.job-card-meta .dot {
  width: 5px; height: 5px; border-radius: 50%; background: var(--q-border);
}
.job-tag-list { display: flex; gap: .375rem; flex-wrap: wrap; margin-top: .875rem; }
.job-card-right {}

/* Upload resume section */
.upload-resume-section {
  background: var(--q-green-pale);
  border: 1px solid rgba(0,196,122,.2);
  border-radius: 2px; padding: 3rem;
  margin-top: 3rem;
}
.upload-resume-section h2 { font-size: 1.375rem; margin-bottom: .625rem; }
.upload-resume-section > p { font-size: .9375rem; color: var(--q-body); margin-bottom: 2rem; line-height: 1.7; }

/* Job detail page */
.job-detail-layout { display: grid; grid-template-columns: 1fr 300px; gap: 5rem; padding: 3.5rem 0; }
.job-detail-sidebar { position: sticky; top: calc(var(--nav-h) + 1.5rem); align-self: start; }
.job-meta-card {
  border: 1px solid var(--q-border); background: #fff; border-radius: 2px;
  padding: 2rem; margin-bottom: 1.5rem;
}
.job-meta-item {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .625rem 0; border-bottom: 1px solid var(--q-border);
  font-size: .875rem;
}
.job-meta-item:last-child { border-bottom: none; }
.job-meta-label { font-family: var(--font-head); font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--q-muted); }
.job-meta-val { color: var(--q-ink); font-weight: 600; text-align: right; }
.job-apply-box {
  background: var(--q-black); border-radius: 2px; padding: 2rem;
}
.job-apply-box h4 { color: #fff; font-size: 1rem; margin-bottom: .5rem; }
.job-apply-box p { color: #888; font-size: .83rem; margin-bottom: 1.5rem; line-height: 1.65; }
.job-section { margin-bottom: 2.75rem; }
.job-section h2 {
  font-size: 1.125rem; margin-bottom: 1.25rem;
  padding-bottom: .75rem; border-bottom: 1px solid var(--q-border); color: var(--q-ink);
}
.job-section ul { list-style: none; }
.job-section ul li {
  font-size: .9375rem; color: var(--q-body); padding: .5rem 0;
  display: flex; align-items: flex-start; gap: .75rem;
  border-bottom: 1px solid var(--q-border); line-height: 1.6;
}
.job-section ul li:last-child { border-bottom: none; }
.job-section ul li::before { content: '-'; color: var(--q-green); flex-shrink: 0; font-weight: 700; margin-top: .1rem; }
.job-section p { font-size: .9375rem; color: var(--q-body); line-height: 1.8; margin-bottom: 1rem; }

/* Application form */
.apply-form-wrap {
  background: #F8F7F4; border: 1px solid var(--q-border);
  border-radius: 2px; padding: 2.5rem; margin-top: 3rem;
}
.apply-form-wrap h2 { font-size: 1.375rem; margin-bottom: .5rem; }
.apply-form-wrap > p { font-size: .9375rem; color: var(--q-body); margin-bottom: 2rem; line-height: 1.65; }
.file-upload-field {
  border: 2px dashed var(--q-border); border-radius: 2px;
  padding: 2rem; text-align: center; background: #fff;
  transition: border-color .2s; cursor: pointer;
}
.file-upload-field:hover, .file-upload-field.dragover { border-color: var(--q-green); background: var(--q-green-pale); }
.file-upload-field input[type="file"] { display: none; }
.file-upload-label { font-family: var(--font-head); font-size: .78rem; font-weight: 600; color: var(--q-muted); text-transform: uppercase; letter-spacing: .08em; cursor: pointer; }
.file-upload-label span { color: var(--q-green-dim); text-decoration: underline; }
.file-name-display { font-size: .83rem; color: var(--q-green-dim); margin-top: .5rem; min-height: 1.2rem; }

@media (max-width: 1024px) {
  .careers-layout { grid-template-columns: 1fr; }
  .careers-sidebar { position: static; height: auto; }
  .job-detail-layout { grid-template-columns: 1fr; }
  .job-detail-sidebar { position: static; }
}
@media (max-width: 768px) {
  .careers-main { padding: 2rem 1.125rem; }
  .careers-sidebar { padding: 2rem 1.125rem; }
  .job-card { grid-template-columns: 1fr; gap: 1.25rem; }
  .upload-resume-section { padding: 2rem 1.5rem; }
  .apply-form-wrap { padding: 1.75rem 1.25rem; }
}
"""

def careers_main_page():
    # Build job cards
    job_cards = ''
    for job in JOBS:
        tag_html = ''.join(f'<span class="tag">{t}</span>' for t in job['tags'][:4])
        job_cards += f'''
    <div class="job-card"
         data-category="{job['category']}"
         data-location="{job['location'].split('/')[0].strip()}"
         data-type="{job['type']}">
      <div class="job-card-left">
        <a href="/careers/{job['slug']}/" class="job-card-title">{job['title']}</a>
        <div class="job-card-meta">
          <span>{job['location']}</span>
          <span class="dot"></span>
          <span>{job['type']}</span>
          <span class="dot"></span>
          <span>{job['mode']}</span>
          <span class="dot"></span>
          <span>{job['experience']}</span>
        </div>
        <div class="job-tag-list">{tag_html}</div>
      </div>
      <div class="job-card-right">
        <a href="/careers/{job['slug']}/" class="btn btn-outline" style="white-space:nowrap;">View and Apply</a>
      </div>
    </div>'''

    return f'''
<div class="page-hero-svg" aria-hidden="true">{HERO_INNER_SVG(bg_light=True, variant='default')}</div>
<section class="page-hero" aria-label="Careers header">
  <div class="page-hero-content">
    <div class="container">
      <div class="eyebrow">Careers at Qfyre</div>
      <h1 class="display-2">Work on What Matters.<br>Build What Lasts.</h1>
      <p class="lead">We place exceptional technology talent, and we hire it too. Explore active roles across cloud, AI, engineering, and data, or tell us who you are.</p>
      <div style="display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem;">
        <a href="#open-roles" class="btn btn-primary">View Open Roles</a>
        <a href="#upload-resume" class="btn btn-outline">Submit Your Profile</a>
      </div>
    </div>
  </div>
</section>

<div class="careers-layout">
  <aside class="careers-sidebar">
    <div class="careers-employer-block">
      <div class="eyebrow">Why Qfyre</div>
      <h3>Work With Precision Tech Specialists</h3>
      <p>These are active client mandates, roles we are placing right now for enterprises and GCCs globally. Every JD is real, every requirement is live.</p>
    </div>

    <span class="careers-filter-label">Filter by Category</span>
    <div class="filter-pills" id="category-filters">
      <button class="filter-pill active" data-filter="all">All Roles</button>
      <button class="filter-pill" data-filter="AI and Machine Learning">AI and ML</button>
      <button class="filter-pill" data-filter="Architecture and Cloud">Architecture</button>
      <button class="filter-pill" data-filter="Cloud and Infrastructure">Cloud Infra</button>
      <button class="filter-pill" data-filter="Application Development">App Dev</button>
      <button class="filter-pill" data-filter="Data and Analytics Leadership">Data</button>
      <button class="filter-pill" data-filter="Finance and Operations">Finance</button>
    </div>

    <span class="careers-filter-label">Filter by Location</span>
    <div class="filter-pills" id="location-filters">
      <button class="filter-pill active" data-filter="all">All Locations</button>
      <button class="filter-pill" data-filter="Bengaluru">Bengaluru</button>
      <button class="filter-pill" data-filter="Hyderabad">Hyderabad</button>
      <button class="filter-pill" data-filter="Remote">Remote</button>
    </div>

    <span class="careers-filter-label">Filter by Type</span>
    <div class="filter-pills" id="type-filters">
      <button class="filter-pill active" data-filter="all">All Types</button>
      <button class="filter-pill" data-filter="Full Time">Full Time</button>
    </div>

    <div class="careers-cta-block">
      <h4>Can't find your role?</h4>
      <p>Search our full live jobs database including contract and interim openings.</p>
      <a href="https://app.oorwin.com/qfyre" target="_blank" rel="noopener noreferrer" class="btn btn-primary" style="width:100%;justify-content:center;font-size:.7rem;margin-bottom:.75rem;">Search All Jobs</a>
      <a href="#upload-resume" class="btn btn-outline" style="width:100%;justify-content:center;font-size:.7rem;">Submit Your Profile</a>
    </div>
  </aside>

  <main class="careers-main">
    <div class="careers-header" id="open-roles">
      <div>
        <div class="eyebrow">Open Positions</div>
        <h2 class="display-3" style="margin-bottom:0;">Active Roles</h2>
      </div>
      <div class="careers-count"><span id="roles-count">{len(JOBS)}</span> roles active</div>
    </div>

    <div class="job-cards" id="job-cards-list">
      {job_cards}
    </div>

    <div class="upload-resume-section" id="upload-resume">
      <div class="eyebrow">Open Application</div>
      <h2>Didn't Find Your Role? Submit Your Profile.</h2>
      <p>We are always looking for exceptional technology professionals. Tell us who you are, what you do, and what you're looking for. We'll match you against live and upcoming requirements, and keep you informed as new mandates come in.</p>
      <form action="/send-application.php" method="POST" enctype="multipart/form-data" novalidate>
        <input type="hidden" name="application_type" value="open">
        <input type="hidden" name="job_title" value="Open Application">
        <input type="text" name="website" style="display:none;" tabindex="-1" autocomplete="off">
        <div class="form-row">
          <div class="form-field"><label>Full Name</label><input type="text" name="full_name" placeholder="Your name" required></div>
          <div class="form-field"><label>Email</label><input type="email" name="email" placeholder="you@email.com" required></div>
        </div>
        <div class="form-row">
          <div class="form-field"><label>Phone</label><input type="tel" name="phone" placeholder="+91 or +1"></div>
          <div class="form-field"><label>LinkedIn Profile URL</label><input type="url" name="linkedin" placeholder="linkedin.com/in/yourname"></div>
        </div>
        <div class="form-row">
          <div class="form-field"><label>Current Location</label><input type="text" name="current_location" placeholder="City, Country" required></div>
          <div class="form-field"><label>Preferred Location/s</label><input type="text" name="preferred_location" placeholder="e.g. Bengaluru, Remote, Open to US"></div>
        </div>
        <div class="form-row">
          <div class="form-field"><label>Current CTC</label><input type="text" name="current_ctc" placeholder="e.g. 28L INR / $120K USD"></div>
          <div class="form-field"><label>Expected CTC</label><input type="text" name="expected_ctc" placeholder="e.g. 35-40L INR / Negotiable"></div>
        </div>
        <div class="form-field"><label>Years of Experience</label><input type="number" name="years_experience" placeholder="Total years" min="0" max="40"></div>
        <div class="form-field">
          <label>Skills and Domain Expertise</label>
          <textarea name="skills" placeholder="Describe your technical skills and domain expertise in your own words, tech stack, industries, types of problems you solve. The more specific, the better." style="min-height:100px;"></textarea>
        </div>
        <div class="form-field">
          <label>What Are You Looking For?</label>
          <textarea name="opportunity" placeholder="Tell us what kind of opportunity you're open to, role type, industry, team size, growth stage, anything that matters to you." style="min-height:80px;"></textarea>
        </div>
        <div class="form-field">
          <label>Upload Resume</label>
          <div class="file-upload-field" id="resume-drop-zone">
            <input type="file" name="resume" id="resume-file" accept=".pdf,.doc,.docx">
            <div class="file-upload-label">
              <p>Drag and drop your resume here or <span onclick="document.getElementById('resume-file').click()">browse to upload</span></p>
              <p style="font-size:.75rem;color:var(--q-muted);margin-top:.35rem;">PDF, DOC, or DOCX, max 5MB</p>
            </div>
            <div class="file-name-display" id="file-name"></div>
          </div>
        </div>
        <button type="submit" class="btn btn-primary" style="margin-top:1.25rem;">Submit My Profile</button>
        <p class="form-privacy" style="margin-top:1rem;">Your data is stored securely and used only for recruitment matching. We do not share your details without your consent. See our <a href="/privacy-policy/" style="color:var(--q-green-dim);">Privacy Policy</a>.</p>
      </form>
    </div>
  </main>
</div>

<script>
// ── Careers filter ────────────────────────────────────────
(function() {{
  var cards = document.querySelectorAll('.job-card');
  var countEl = document.getElementById('roles-count');
  var activeFilters = {{ category: 'all', location: 'all', type: 'all' }};

  function filterCards() {{
    var visible = 0;
    cards.forEach(function(card) {{
      var cat = card.getAttribute('data-category') || '';
      var loc = card.getAttribute('data-location') || '';
      var typ = card.getAttribute('data-type') || '';
      var show =
        (activeFilters.category === 'all' || cat === activeFilters.category) &&
        (activeFilters.location === 'all' || loc.indexOf(activeFilters.location) > -1) &&
        (activeFilters.type === 'all' || typ === activeFilters.type);
      card.style.display = show ? '' : 'none';
      if (show) visible++;
    }});
    if (countEl) countEl.textContent = visible;
  }}

  document.querySelectorAll('#category-filters .filter-pill').forEach(function(btn) {{
    btn.addEventListener('click', function() {{
      document.querySelectorAll('#category-filters .filter-pill').forEach(function(b) {{ b.classList.remove('active'); }});
      btn.classList.add('active');
      activeFilters.category = btn.getAttribute('data-filter');
      filterCards();
    }});
  }});

  document.querySelectorAll('#location-filters .filter-pill').forEach(function(btn) {{
    btn.addEventListener('click', function() {{
      document.querySelectorAll('#location-filters .filter-pill').forEach(function(b) {{ b.classList.remove('active'); }});
      btn.classList.add('active');
      activeFilters.location = btn.getAttribute('data-filter');
      filterCards();
    }});
  }});

  document.querySelectorAll('#type-filters .filter-pill').forEach(function(btn) {{
    btn.addEventListener('click', function() {{
      document.querySelectorAll('#type-filters .filter-pill').forEach(function(b) {{ b.classList.remove('active'); }});
      btn.classList.add('active');
      activeFilters.type = btn.getAttribute('data-filter');
      filterCards();
    }});
  }});
}})();

// ── File upload display ──────────────────────────────────
document.getElementById('resume-file').addEventListener('change', function() {{
  var name = this.files[0] ? this.files[0].name : '';
  document.getElementById('file-name').textContent = name ? '✓ ' + name : '';
}});
var dz = document.getElementById('resume-drop-zone');
if (dz) {{
  dz.addEventListener('dragover', function(e) {{ e.preventDefault(); dz.classList.add('dragover'); }});
  dz.addEventListener('dragleave', function() {{ dz.classList.remove('dragover'); }});
  dz.addEventListener('drop', function(e) {{
    e.preventDefault(); dz.classList.remove('dragover');
    var files = e.dataTransfer.files;
    if (files.length) {{
      document.getElementById('resume-file').files = files;
      document.getElementById('file-name').textContent = '✓ ' + files[0].name;
    }}
  }});
}}
</script>
/* ── Page hero (inner pages) ─────────────────── */
.page-hero-svg { display:block;width:100%;line-height:0; }
.page-hero {
  background:#fff;
  border-bottom:1px solid var(--q-border);
  padding:3rem 0 2.75rem;
}
.page-hero-content { width:100%; }
.page-hero .eyebrow { color:var(--q-green); }
.page-hero h1 { color:var(--q-ink); margin-bottom:1rem; }
.page-hero .lead { color:var(--q-muted); max-width:660px; }

/* ── Tech Talent Pulse section responsive ── */
.pulse-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
  align-items:center;
}
@media(max-width:768px){
  .pulse-grid {
    grid-template-columns:1fr;
    gap:2.5rem;
  }
}

/* ════════════════════════════════════════════════════
   RESPONSIVE ADDITIONS — June 2026
   All new mobile rules go here. Use @media (max-width: 768px).
════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Typography scaling */
  .display-2 { font-size: 2rem; }
  .display-3 { font-size: 1.625rem; }

  /* About / Mission-Vision-Values page grids */
  .mvv-section-grid { grid-template-columns: 1fr !important; gap: 2rem !important; }
  .mvv-cta-grid { grid-template-columns: 1fr !important; gap: 1.5rem !important; }
  .mvv-survey-cards { grid-template-columns: 1fr !important; }

  /* Careers FERTILE values section */
  .careers-values-grid { grid-template-columns: 1fr !important; gap: 2.5rem !important; }

  /* Insight download gated layout (also handled at 1024px above) */
  .gated-layout { grid-template-columns: 1fr !important; }

  /* Blog single: sidebar stacks below article on mobile */
  .blog-single-layout { grid-template-columns: 1fr !important; }
  .blog-single-aside { position: static !important; }
}
