.elementor-16 .elementor-element.elementor-element-7db833a{--display:flex;}.elementor-16 .elementor-element.elementor-element-a1ab7ca{width:100%;max-width:100%;}:root{--page-title-display:none;}/* Start custom CSS for shortcode, class: .elementor-element-a1ab7ca *//* ==========================================================
   SHJobNivo — SAFE FULL-WIDTH ANIMATION CSS
   Delete the previous animation CSS before pasting this file.
   ========================================================== */

/* Full-width breakout from the WordPress theme container */
.shn-home {
  position: relative !important;
  left: 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow-x: clip !important;
}

/* Remove common page-builder spacing only on the page containing SHJobNivo */
body:has(.shn-home) .site-main,
body:has(.shn-home) .site-content,
body:has(.shn-home) .content-area,
body:has(.shn-home) .entry-content,
body:has(.shn-home) .wp-block-post-content {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body:has(.shn-home) article,
body:has(.shn-home) .hentry {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body:has(.shn-home) .entry-header,
body:has(.shn-home) .page-header {
  margin-bottom: 0 !important;
}

html:has(.shn-home),
body:has(.shn-home) {
  overflow-x: clip;
}

/* Safe animations: none of these hide page content */
@keyframes shnSafeHeroIn {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes shnSafeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes shnSafeGradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes shnSafePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(22, 104, 227, .15); }
  50% { box-shadow: 0 0 0 9px rgba(22, 104, 227, 0); }
}

/* Hero entrance */
.shn-home .shn-hero {
  background-size: 180% 180% !important;
  animation: shnSafeGradient 15s ease infinite !important;
}

.shn-home .shn-hero .shn-eyebrow {
  animation: shnSafeHeroIn .55s ease both !important;
}

.shn-home .shn-hero h1 {
  animation: shnSafeHeroIn .65s .10s ease both !important;
}

.shn-home .shn-hero-copy {
  animation: shnSafeHeroIn .65s .20s ease both !important;
}

.shn-home .shn-search {
  animation: shnSafeHeroIn .65s .30s ease both !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}

.shn-home .shn-quick {
  animation: shnSafeHeroIn .65s .40s ease both !important;
}

.shn-home .shn-search:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 24px 55px rgba(0, 0, 0, .25) !important;
}

/* Universal premium card hover — layout remains unchanged */
.shn-home .shn-category,
.shn-home .shn-job,
.shn-home .shn-service,
.shn-home .shn-review {
  transition:
    transform .28s cubic-bezier(.2, .75, .25, 1),
    border-color .28s ease,
    box-shadow .28s ease !important;
  will-change: transform;
}

.shn-home .shn-category:hover,
.shn-home .shn-job:hover,
.shn-home .shn-service:hover,
.shn-home .shn-review:hover {
  transform: translateY(-7px) !important;
  border-color: #b8d2f5 !important;
  box-shadow: 0 18px 40px rgba(22, 55, 94, .13) !important;
}

.shn-home .shn-category-icon,
.shn-home .shn-company-mark {
  transition: transform .28s ease, box-shadow .28s ease !important;
}

.shn-home .shn-category:hover .shn-category-icon,
.shn-home .shn-job:hover .shn-company-mark {
  transform: translateY(-3px) scale(1.06) !important;
  box-shadow: 0 9px 20px rgba(22, 104, 227, .15) !important;
}

.shn-home .shn-service > span {
  display: inline-block;
  transition: transform .28s ease !important;
}

.shn-home .shn-service:hover > span {
  transform: translateY(-4px) rotate(4deg) scale(1.08) !important;
}

/* Stats */
.shn-home .shn-stat {
  transition: transform .25s ease, background-color .25s ease !important;
}

.shn-home .shn-stat:hover {
  transform: translateY(-4px) !important;
  background: #f5f9ff !important;
}

.shn-home .shn-stat strong {
  transition: color .25s ease !important;
}

.shn-home .shn-stat:hover strong {
  color: #1668e3 !important;
}

/* Trust section */
.shn-home .shn-trust-card {
  transition: transform .3s ease, background-color .3s ease !important;
}

.shn-home .shn-trust-visual:hover .shn-trust-card {
  transform: translateY(-5px) !important;
  background: rgba(255, 255, 255, .14) !important;
}

.shn-home .shn-big-icon {
  display: inline-block;
  animation: shnSafeFloat 4s ease-in-out infinite !important;
}

.shn-home .shn-check {
  transition: transform .22s ease !important;
}

.shn-home .shn-check:hover {
  transform: translateX(5px) !important;
}

.shn-home .shn-check i {
  transition: transform .22s ease !important;
}

.shn-home .shn-check:hover i {
  transform: scale(1.1) rotate(6deg) !important;
}

/* Employer section */
.shn-home .shn-employer-panel {
  transition: transform .28s ease, background-color .28s ease !important;
}

.shn-home .shn-employer-panel:hover {
  transform: translateY(-5px) !important;
  background: rgba(255, 255, 255, .12) !important;
}

.shn-home .shn-employer-panel div {
  transition: transform .2s ease !important;
}

.shn-home .shn-employer-panel div:hover {
  transform: translateX(5px) !important;
}

.shn-home .shn-office-note {
  transition: transform .25s ease, box-shadow .25s ease !important;
}

.shn-home .shn-office-note:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 11px 25px rgba(22, 104, 227, .12) !important;
}

/* How-it-works steps */
.shn-home .shn-step-number {
  transition: transform .28s ease, box-shadow .28s ease !important;
}

.shn-home .shn-step:hover .shn-step-number {
  transform: translateY(-6px) scale(1.07) !important;
  box-shadow:
    0 0 0 7px rgba(22, 104, 227, .09),
    0 12px 24px rgba(22, 104, 227, .20) !important;
}

/* Reviews */
.shn-home .shn-avatar,
.shn-home .shn-stars {
  transition: transform .25s ease, background-color .25s ease, letter-spacing .25s ease !important;
}

.shn-home .shn-review:hover .shn-avatar {
  transform: rotate(-5deg) scale(1.07) !important;
  background: #1668e3 !important;
}

.shn-home .shn-review:hover .shn-stars {
  transform: translateY(-2px) !important;
  letter-spacing: 3px !important;
}

/* FAQ */
.shn-home .shn-faq-item {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

.shn-home .shn-faq-item:hover {
  transform: translateY(-2px) !important;
  border-color: #bdd4f3 !important;
  box-shadow: 0 8px 22px rgba(18, 48, 85, .07) !important;
}

.shn-home .shn-faq-item.is-open {
  border-color: #a9caf6 !important;
  box-shadow: 0 10px 26px rgba(22, 104, 227, .09) !important;
}

.shn-home .shn-faq-item.is-open .shn-faq-question {
  color: #1668e3 !important;
}

/* CTA and buttons */
.shn-home .shn-cta-box {
  background-size: 180% 180% !important;
  animation: shnSafeGradient 12s ease infinite !important;
  transition: transform .3s ease, box-shadow .3s ease !important;
}

.shn-home .shn-cta-box:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 24px 55px rgba(16, 69, 127, .26) !important;
}

.shn-home .shn-btn {
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}

.shn-home .shn-btn:hover {
  transform: translateY(-3px) !important;
  filter: brightness(1.04);
}

.shn-home .shn-btn-primary {
  animation: shnSafePulse 3.2s ease-in-out infinite;
}

/* Mobile: lighter movement and guaranteed full width */
@media (max-width: 760px) {
  .shn-home {
    width: 100vw !important;
    max-width: 100vw !important;
  }

  .shn-home .shn-category:hover,
  .shn-home .shn-job:hover,
  .shn-home .shn-service:hover,
  .shn-home .shn-review:hover,
  .shn-home .shn-cta-box:hover {
    transform: translateY(-3px) !important;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .shn-home *,
  .shn-home *::before,
  .shn-home *::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}/* End custom CSS */