/* ==========================================================================
   JV Digital Network — 2026 Redesign
   Override layer. Loaded LAST, after style.css / responsive.css / base-color.php
   Palette derived from the JV Digital Network logo.
   ========================================================================== */

:root {
  /* --- Brand: blues (from "JV Digital" wordmark + wifi glyph) --- */
  --jv-navy-900: #041B36;
  --jv-navy-800: #072747;
  --jv-navy-700: #0B3560;
  --jv-navy-600: #0F4479;
  --jv-blue-500: #0F5C9E;
  --jv-blue-400: #1B76BE;
  --jv-sky-300:  #35A0DC;
  --jv-sky-200:  #7CC6EE;

  /* --- Brand: oranges (from "J" + "NETWORK") --- */
  --jv-orange-600: #B8410A;
  --jv-orange-500: #D2600F;
  --jv-orange-400: #E08A2E;
  --jv-orange-300: #F0A94E;

  /* --- Neutrals --- */
  --jv-ink:    #0A1929;
  --jv-body:   #4A5C6E;
  --jv-line:   rgba(255, 255, 255, .12);
  --jv-white:  #FFFFFF;

  /* --- Composites --- */
  --jv-grad-orange: linear-gradient(135deg, var(--jv-orange-400) 0%, var(--jv-orange-600) 100%);
  --jv-grad-blue:   linear-gradient(135deg, var(--jv-blue-400) 0%, var(--jv-navy-700) 100%);
  --jv-grad-hero:   linear-gradient(115deg, #041B36 0%, #072747 38%, #0B3560 68%, #0F4479 100%);

  --jv-shadow-sm: 0 2px 8px rgba(4, 27, 54, .08);
  --jv-shadow-md: 0 12px 32px rgba(4, 27, 54, .14);
  --jv-shadow-lg: 0 28px 64px rgba(4, 27, 54, .28);
  --jv-shadow-orange: 0 12px 28px rgba(184, 65, 10, .38);

  --jv-radius-sm: 8px;
  --jv-radius:    14px;
  --jv-radius-lg: 22px;
  --jv-radius-pill: 999px;

  --jv-ease: cubic-bezier(.22, .61, .36, 1);
}

/* ==========================================================================
   1. HERO
   ========================================================================== */

.jv-hero {
  position: relative;
  overflow: hidden;
  background: var(--jv-grad-hero);
  padding: 132px 0 0;
  isolation: isolate;
}

/* --- background layers --- */

.jv-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: .16;
  filter: saturate(.5) contrast(1.05);
  z-index: 0;
}

/* soft orange + sky glows so the navy never reads flat */
.jv-hero__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
}

.jv-hero__glow--orange {
  width: 620px;
  height: 620px;
  right: -160px;
  top: -180px;
  background: radial-gradient(circle, rgba(224, 138, 46, .38) 0%, rgba(224, 138, 46, 0) 70%);
  animation: jvDrift 18s var(--jv-ease) infinite alternate;
}

.jv-hero__glow--blue {
  width: 560px;
  height: 560px;
  left: -200px;
  bottom: -220px;
  background: radial-gradient(circle, rgba(53, 160, 220, .32) 0%, rgba(53, 160, 220, 0) 70%);
  animation: jvDrift 22s var(--jv-ease) infinite alternate-reverse;
}

@keyframes jvDrift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(-40px, 50px, 0) scale(1.12); }
}

/* fine grid, echoes "network" */
.jv-hero__grid {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(124, 198, 238, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124, 198, 238, .07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, #000 30%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, #000 30%, transparent 100%);
}

.jv-hero__inner {
  position: relative;
  z-index: 2;
}

/* --- left column: copy --- */

.jv-hero__copy {
  padding: 40px 0 96px;
  max-width: 620px;
}

.jv-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px 8px 12px;
  border-radius: var(--jv-radius-pill);
  background: rgba(224, 138, 46, .13);
  border: 1px solid rgba(240, 169, 78, .34);
  color: var(--jv-orange-300);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 26px;
  backdrop-filter: blur(6px);
}

.jv-hero__pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--jv-orange-300);
  box-shadow: 0 0 0 0 rgba(240, 169, 78, .7);
  animation: jvPulse 2.2s infinite;
  flex: none;
}

@keyframes jvPulse {
  0%   { box-shadow: 0 0 0 0 rgba(240, 169, 78, .7); }
  70%  { box-shadow: 0 0 0 12px rgba(240, 169, 78, 0); }
  100% { box-shadow: 0 0 0 0 rgba(240, 169, 78, 0); }
}

.jv-hero__title {
  color: var(--jv-white);
  font-size: 56px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -.02em;
  margin: 0 0 24px;
  text-wrap: balance;
}

.jv-hero__title .jv-accent {
  background: linear-gradient(100deg, var(--jv-orange-300) 0%, var(--jv-orange-500) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.jv-hero__lede {
  color: rgba(255, 255, 255, .74);
  font-size: 18px;
  line-height: 1.7;
  margin: 0 0 38px;
  max-width: 520px;
}

/* --- buttons --- */

.jv-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 44px;
}

.jv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 17px 34px;
  border-radius: var(--jv-radius-pill);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .01em;
  text-decoration: none;
  border: 1px solid transparent;
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease),
              background-color .28s var(--jv-ease), color .28s var(--jv-ease),
              border-color .28s var(--jv-ease);
  cursor: pointer;
  white-space: nowrap;
}

.jv-btn i { font-size: 13px; transition: transform .28s var(--jv-ease); }

.jv-btn--primary {
  background: var(--jv-grad-orange);
  color: var(--jv-white);
  box-shadow: var(--jv-shadow-orange);
}

.jv-btn--primary:hover,
.jv-btn--primary:focus {
  color: var(--jv-white);
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(184, 65, 10, .48);
}

.jv-btn--primary:hover i { transform: translateX(4px); }

.jv-btn--ghost {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .26);
  color: var(--jv-white);
  backdrop-filter: blur(8px);
}

.jv-btn--ghost:hover,
.jv-btn--ghost:focus {
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .5);
  color: var(--jv-white);
  transform: translateY(-3px);
}

/* --- inline proof points --- */

.jv-hero__proof {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px 26px;
  padding-top: 28px;
  border-top: 1px solid var(--jv-line);
}

.jv-hero__proof-item {
  display: flex;
  align-items: center;
  gap: 9px;
  color: rgba(255, 255, 255, .62);
  font-size: 14px;
  font-weight: 500;
}

.jv-hero__proof-item i {
  color: var(--jv-sky-300);
  font-size: 14px;
}

/* --- right column: signal card --- */

.jv-hero__visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 520px;
  padding: 20px 0 96px;
}

/* concentric wifi rings radiating behind the card */
.jv-rings {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.jv-rings span {
  position: absolute;
  border: 1px solid rgba(124, 198, 238, .22);
  border-radius: 50%;
  animation: jvRipple 4s var(--jv-ease) infinite;
  opacity: 0;
}

.jv-rings span:nth-child(1) { width: 200px; height: 200px; animation-delay: 0s; }
.jv-rings span:nth-child(2) { width: 200px; height: 200px; animation-delay: 1s; }
.jv-rings span:nth-child(3) { width: 200px; height: 200px; animation-delay: 2s; }
.jv-rings span:nth-child(4) { width: 200px; height: 200px; animation-delay: 3s; }

@keyframes jvRipple {
  0%   { transform: scale(.6); opacity: 0; }
  25%  { opacity: .9; }
  100% { transform: scale(2.9); opacity: 0; }
}

.jv-signal-card {
  position: relative;
  width: 100%;
  max-width: 400px;
  padding: 34px;
  border-radius: var(--jv-radius-lg);
  background: linear-gradient(160deg, rgba(255, 255, 255, .13) 0%, rgba(255, 255, 255, .04) 100%);
  border: 1px solid rgba(255, 255, 255, .18);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: var(--jv-shadow-lg);
  animation: jvFloat 7s ease-in-out infinite;
}

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

.jv-signal-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}

.jv-signal-card__label {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, .72);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.jv-signal-card__label i { color: var(--jv-sky-300); font-size: 16px; }

.jv-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 13px;
  border-radius: var(--jv-radius-pill);
  background: rgba(53, 160, 220, .16);
  border: 1px solid rgba(53, 160, 220, .34);
  color: var(--jv-sky-200);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.jv-chip__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4ADE80;
  animation: jvBlink 1.8s ease-in-out infinite;
}

@keyframes jvBlink {
  0%, 100% { opacity: 1; }
  50%      { opacity: .25; }
}

/* the speed readout */
.jv-speed {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}

.jv-speed__value {
  font-size: 66px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -.03em;
  color: var(--jv-white);
  font-variant-numeric: tabular-nums;
}

.jv-speed__unit {
  font-size: 20px;
  font-weight: 700;
  color: var(--jv-orange-300);
}

.jv-speed__caption {
  color: rgba(255, 255, 255, .5);
  font-size: 13px;
  margin-bottom: 26px;
}

/* animated throughput bars */
.jv-bars {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 76px;
  margin-bottom: 28px;
}

.jv-bars span {
  flex: 1;
  border-radius: 4px 4px 2px 2px;
  background: linear-gradient(180deg, var(--jv-sky-300) 0%, var(--jv-blue-500) 100%);
  transform-origin: bottom;
  animation: jvBar 1.7s ease-in-out infinite;
  opacity: .85;
}

.jv-bars span:nth-child(3n)   { background: linear-gradient(180deg, var(--jv-orange-300) 0%, var(--jv-orange-600) 100%); }
.jv-bars span:nth-child(1)  { height: 34%; animation-delay: 0s; }
.jv-bars span:nth-child(2)  { height: 58%; animation-delay: .1s; }
.jv-bars span:nth-child(3)  { height: 42%; animation-delay: .2s; }
.jv-bars span:nth-child(4)  { height: 76%; animation-delay: .3s; }
.jv-bars span:nth-child(5)  { height: 50%; animation-delay: .4s; }
.jv-bars span:nth-child(6)  { height: 88%; animation-delay: .5s; }
.jv-bars span:nth-child(7)  { height: 62%; animation-delay: .6s; }
.jv-bars span:nth-child(8)  { height: 100%; animation-delay: .7s; }
.jv-bars span:nth-child(9)  { height: 46%; animation-delay: .8s; }
.jv-bars span:nth-child(10) { height: 70%; animation-delay: .9s; }
.jv-bars span:nth-child(11) { height: 36%; animation-delay: 1s; }
.jv-bars span:nth-child(12) { height: 54%; animation-delay: 1.1s; }

@keyframes jvBar {
  0%, 100% { transform: scaleY(.55); opacity: .55; }
  50%      { transform: scaleY(1);   opacity: 1; }
}

.jv-signal-card__foot {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.jv-metric__k {
  display: block;
  color: rgba(255, 255, 255, .48);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.jv-metric__v {
  display: block;
  color: var(--jv-white);
  font-size: 21px;
  font-weight: 700;
}

/* small floating badge tucked against the card */
.jv-float-badge {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px 18px;
  border-radius: var(--jv-radius);
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--jv-shadow-md);
  animation: jvFloat 7s ease-in-out infinite;
  animation-delay: -3.5s;
}

/* left side, so it never collides with the bottom-right live-chat widget */
.jv-float-badge--support {
  left: -30px;
  bottom: 26px;
}

.jv-float-badge__icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--jv-grad-orange);
  color: #fff;
  font-size: 15px;
  flex: none;
}

.jv-float-badge__k {
  display: block;
  color: var(--jv-ink);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.jv-float-badge__v {
  display: block;
  color: var(--jv-body);
  font-size: 12px;
}

/* ==========================================================================
   2. FEATURE STRIP — reuses the CMS feature rows, restyled as cards
      that overlap the bottom edge of the hero.
   ========================================================================== */

.jv-features {
  position: relative;
  z-index: 3;
  margin-top: -68px;
  padding-bottom: 0;
}

/* The legacy theme yanks the intro block up by -213px to sit under the old
   feature bar. That bar is gone, so reset it and give the new cards room. */
.intro-section {
  margin-top: 0 !important;
  padding-top: 84px;
}

.jv-features__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.jv-feature {
  position: relative;
  padding: 30px 26px;
  border-radius: var(--jv-radius);
  background: var(--jv-white);
  box-shadow: var(--jv-shadow-md);
  overflow: hidden;
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease);
}

.jv-feature::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: var(--jv-grad-orange);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .35s var(--jv-ease);
}

.jv-feature:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 52px rgba(4, 27, 54, .18);
}

.jv-feature:hover::after { transform: scaleY(1); }

.jv-feature__icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 21px;
  color: var(--jv-blue-500);
  background: rgba(15, 92, 158, .09);
  margin-bottom: 18px;
  transition: background-color .35s var(--jv-ease), color .35s var(--jv-ease);
}

.jv-feature:hover .jv-feature__icon {
  background: var(--jv-grad-orange);
  color: #fff;
}

.jv-feature__title {
  font-size: 17px;
  font-weight: 700;
  color: var(--jv-ink);
  line-height: 1.4;
  margin: 0;
}

/* Legacy feature strip is replaced by the one above — keep it out of the flow. */
.intro-section .hero-features { display: none !important; }

/* ==========================================================================
   3. SHARED SECTION FURNITURE
   Every section below the hero uses the same eyebrow + heading rhythm.
   ========================================================================== */

.intro-section,
.service-categories,
.approach-section,
.testimonial-section,
.team-section,
.pricing-tables,
.blog-section,
.cta-section,
.partner-section {
  position: relative;
}

/* eyebrow */
.section-title {
  display: inline-block;
  font-family: inherit !important;
  font-style: normal !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--jv-orange-500);
  margin-bottom: 14px;
  position: relative;
  padding-left: 30px;
}

.section-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--jv-grad-orange);
  transform: translateY(-50%);
}

/* heading */
.section-summary {
  font-size: 40px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.02em;
  color: var(--jv-ink);
  margin: 0 0 26px !important;
  text-wrap: balance;
}

/* light neutral band so white sections don't all run together */
.jv-band-soft {
  background: linear-gradient(180deg, #F6F9FC 0%, #FFFFFF 100%);
}

/* ==========================================================================
   4. INTRO SECTION
   ========================================================================== */

.intro-section .row {
  border-radius: var(--jv-radius-lg);
  overflow: hidden;
  box-shadow: var(--jv-shadow-md);
  background: var(--jv-navy-800);
  margin-left: 0;
  margin-right: 0;
}

.intro-txt {
  position: relative;
  background: var(--jv-grad-hero) !important;
  padding: 72px 56px !important;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

/* same orange glow motif as the hero, keeps the page feeling of a piece */
.intro-txt::after {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: -120px;
  bottom: -140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 138, 46, .3) 0%, rgba(224, 138, 46, 0) 70%);
  filter: blur(50px);
  pointer-events: none;
}

.intro-txt > * { position: relative; z-index: 1; }

.intro-txt .section-title { color: var(--jv-orange-300); }
.intro-txt .section-title::before { background: var(--jv-orange-300); }

.intro-txt h2,
.intro-txt .section-summary {
  color: var(--jv-white) !important;
  font-size: 34px !important;
  margin-bottom: 32px !important;
}

/* the legacy square button becomes a brand pill */
.intro-txt a.intro-btn {
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  padding: 17px 34px !important;
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .04em;
  box-shadow: var(--jv-shadow-orange);
  border: 0 !important;
  align-self: flex-start;
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease);
}

.intro-txt a.intro-btn::before,
.intro-txt a.intro-btn::after { display: none !important; }

.intro-txt a.intro-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(184, 65, 10, .48);
}

/* image panel — gradient fallback so a missing/slow image still reads as design */
.intro-bg {
  position: relative;
  min-height: 420px;
  background-color: var(--jv-navy-700);
  background-image: var(--jv-grad-blue);
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.intro-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(4, 27, 54, .5) 0%, rgba(4, 27, 54, .05) 60%);
}

/* restyle the pulsing play button into brand colours */
.video-play-button:before,
.video-play-button:after {
  background: var(--jv-orange-500) !important;
}

.video-play-button span {
  border-left-color: var(--jv-white) !important;
}

/* ==========================================================================
   5. SERVICES / SERVICE CATEGORIES
   ========================================================================== */

.service-categories {
  padding: 96px 0 74px;
  background: linear-gradient(180deg, #F6F9FC 0%, #FFFFFF 70%);
}

/* centred section headings: eyebrow stacks above the h2, no leading dash */
.row.text-center .section-title {
  display: block;
  padding-left: 0;
  margin-left: auto;
  margin-right: auto;
}

.row.text-center .section-title::before { display: none; }

/* --- dark variant: 2x2 cards on the brand gradient --------------------- */

.service-categories.jv-services-dark {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 108px 0 82px;
  background: var(--jv-grad-hero);
}

.jv-services__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
}

.jv-services__glow--orange {
  width: 540px;
  height: 540px;
  left: -180px;
  top: -160px;
  background: radial-gradient(circle, rgba(224, 138, 46, .3) 0%, rgba(224, 138, 46, 0) 70%);
}

.jv-services__glow--blue {
  width: 520px;
  height: 520px;
  right: -180px;
  bottom: -200px;
  background: radial-gradient(circle, rgba(53, 160, 220, .28) 0%, rgba(53, 160, 220, 0) 70%);
}

.jv-services__grid-lines {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(124, 198, 238, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124, 198, 238, .06) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 20%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 20%, transparent 100%);
}

.jv-services__inner { position: relative; z-index: 1; }

.jv-services-dark .section-title { color: var(--jv-orange-300) !important; }
.jv-services-dark .section-summary { color: var(--jv-white) !important; margin-bottom: 54px !important; }

.jv-services__row { margin-top: 0; }

/* two per row, generous cards */
.jv-services-dark .single-category {
  align-items: flex-start;
  gap: 0;
  padding: 40px 38px 36px !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, .1) 0%, rgba(255, 255, 255, .035) 100%) !important;
  border: 1px solid rgba(255, 255, 255, .15) !important;
  border-radius: var(--jv-radius-lg) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  margin-bottom: 26px;
}

.jv-services-dark .single-category::before {
  background: radial-gradient(circle, rgba(224, 138, 46, .3) 0%, rgba(224, 138, 46, 0) 70%);
  width: 220px;
  height: 220px;
  right: -80px;
  top: -80px;
}

.jv-services-dark .single-category:hover {
  transform: translateY(-8px);
  border-color: rgba(240, 169, 78, .5) !important;
  box-shadow: 0 28px 56px rgba(2, 15, 32, .45);
}

/* icon tile */
.jv-services-dark .single-category .img-wrapper {
  width: 74px;
  height: 74px;
  border-radius: 20px;
  margin-bottom: 26px !important;
  background: linear-gradient(140deg, rgba(53, 160, 220, .22) 0%, rgba(15, 92, 158, .18) 100%);
  border: 1px solid rgba(124, 198, 238, .22);
}

.jv-services-dark .single-category .img-wrapper i {
  font-size: 30px;
  line-height: 1;
  color: var(--jv-sky-200);
  transition: color .35s var(--jv-ease);
}

.jv-services-dark .single-category:hover .img-wrapper {
  background: var(--jv-grad-orange);
  border-color: transparent;
  transform: rotate(-6deg) scale(1.05);
}

.jv-services-dark .single-category:hover .img-wrapper i { color: #fff; }

.jv-services-dark .single-category .text h4 {
  color: var(--jv-white) !important;
  font-size: 23px !important;
  margin-bottom: 14px !important;
}

.jv-services-dark .single-category .text p {
  color: rgba(255, 255, 255, .68) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  margin-bottom: 24px !important;
}

.jv-services-dark .single-category .text p .see-more { color: var(--jv-sky-200) !important; }

.jv-services-dark .single-category a.readmore {
  color: var(--jv-orange-300) !important;
  font-size: 15px !important;
}

.jv-services-dark .single-category:hover a.readmore { color: var(--jv-orange-400) !important; }

/* Equal-height cards regardless of copy length.
   Scoped away from .text-center, which is the section's heading row — making
   that a flex container puts the eyebrow and the h2 side by side. */
.service-categories .row:not(.text-center) > [class*="col-"],
.services-area .row:not(.text-center) > [class*="col-"] {
  display: flex;
}

.single-category {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto;
  margin-bottom: 26px;
  padding: 38px 30px 34px !important;
  border: 1px solid rgba(11, 53, 96, .1) !important;
  border-radius: var(--jv-radius) !important;
  background: var(--jv-white);
  text-align: left !important;
  overflow: hidden;
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease),
              border-color .35s var(--jv-ease);
}

/* subtle brand wash that reveals on hover */
.single-category::before {
  content: "";
  position: absolute;
  right: -60px;
  top: -60px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 138, 46, .16) 0%, rgba(224, 138, 46, 0) 70%);
  opacity: 0;
  transition: opacity .35s var(--jv-ease);
}

.single-category:hover {
  transform: translateY(-8px);
  border-color: rgba(224, 138, 46, .38) !important;
  box-shadow: 0 24px 48px rgba(4, 27, 54, .13);
}

.single-category:hover::before { opacity: 1; }

.single-category > * { position: relative; z-index: 1; }

/* icon chip — styled as a tile so a broken icon file still looks intentional */
.single-category .img-wrapper {
  width: 62px;
  height: 62px;
  margin: 0 0 22px !important;
  border-radius: 16px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: linear-gradient(140deg, rgba(15, 92, 158, .12) 0%, rgba(53, 160, 220, .1) 100%);
  transition: background .35s var(--jv-ease), transform .35s var(--jv-ease);
}

.single-category:hover .img-wrapper {
  background: var(--jv-grad-orange);
  transform: rotate(-6deg) scale(1.04);
}

.single-category .img-wrapper img {
  max-width: 32px;
  max-height: 32px;
  width: auto;
  height: auto;
  filter: none;
}

.single-category .text {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.single-category .text h4 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--jv-ink) !important;
  text-transform: none !important;
  letter-spacing: -.01em;
  margin: 0 0 12px !important;
  line-height: 1.35;
}

.single-category .text p {
  color: var(--jv-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin-bottom: 20px !important;
}

.single-category .text p .see-more {
  color: var(--jv-blue-500) !important;
  font-weight: 600;
}

.single-category a.readmore {
  display: inline-flex !important;
  align-self: flex-start;
  margin-top: auto;
  align-items: center;
  gap: 8px;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--jv-orange-500) !important;
  text-transform: none !important;
  letter-spacing: 0;
  transition: gap .28s var(--jv-ease), color .28s var(--jv-ease);
}

.single-category a.readmore::after {
  content: "\2192";
  font-size: 15px;
  line-height: 1;
  transition: transform .28s var(--jv-ease);
}

.single-category:hover a.readmore { gap: 12px; color: var(--jv-orange-600) !important; }
.single-category:hover a.readmore::after { transform: translateX(2px); }

/* the non-category services variant gets the same treatment */
.services-area { padding-bottom: 100px !important; }

.services-item {
  display: flex;
  flex-direction: column;
  width: 100%;
  border-radius: var(--jv-radius) !important;
  overflow: hidden;
  border: 1px solid rgba(11, 53, 96, .1);
  background: var(--jv-white);
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease);
}

.services-item:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(4, 27, 54, .13);
}

.services-thumb { overflow: hidden; }

.services-thumb img {
  width: 100%;
  transition: transform .6s var(--jv-ease);
}

.services-item:hover .services-thumb img { transform: scale(1.06); }

.services-content { padding: 28px 26px 30px !important; }

.services-content h4 {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--jv-ink) !important;
  margin-bottom: 12px !important;
}

.services-content p {
  color: var(--jv-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

/* ==========================================================================
   6. APPROACH / "HOW WE DO IT"
   ========================================================================== */

.approach-section {
  padding: 96px 0 100px;
  background: var(--jv-white);
}

.approach-summary { padding-right: 40px; }

.approach-summary a.boxed-btn,
a.boxed-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  padding: 17px 34px !important;
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .04em;
  border: 0 !important;
  box-shadow: var(--jv-shadow-orange);
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease);
}

a.boxed-btn::before,
a.boxed-btn::after { display: none !important; }

a.boxed-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(184, 65, 10, .48);
  color: var(--jv-white) !important;
}

.approach-lists { margin: 0; padding: 0; list-style: none; }

.single-approach {
  display: flex !important;
  align-items: flex-start;
  gap: 22px;
  padding: 26px !important;
  margin-bottom: 18px !important;
  border-radius: var(--jv-radius);
  background: var(--jv-white);
  border: 1px solid rgba(11, 53, 96, .1);
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease),
              border-color .35s var(--jv-ease);
}

.single-approach:hover {
  transform: translateX(6px);
  border-color: rgba(224, 138, 46, .38);
  box-shadow: 0 18px 40px rgba(4, 27, 54, .1);
}

/* the legacy rules use float + a 110px left margin; the card is flex now */
.approach-text {
  margin-left: 0 !important;
  padding-left: 0 !important;
  min-width: 0;
}

.approach-icon-wrapper {
  flex: none;
  float: none !important;
  margin: 0 !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center;
  background: linear-gradient(140deg, rgba(15, 92, 158, .12) 0%, rgba(53, 160, 220, .1) 100%) !important;
  border: 0 !important;
  transition: background .35s var(--jv-ease), transform .35s var(--jv-ease);
}

.approach-icon-wrapper i {
  font-size: 22px !important;
  color: var(--jv-blue-500) !important;
  transition: color .35s var(--jv-ease);
}

.single-approach:hover .approach-icon-wrapper {
  background: var(--jv-grad-orange) !important;
  transform: rotate(-6deg);
}

.single-approach:hover .approach-icon-wrapper i { color: #fff !important; }

.approach-text h4 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--jv-ink) !important;
  margin: 0 0 8px !important;
}

.approach-text p {
  color: var(--jv-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}

/* ==========================================================================
   7. STATISTICS
   ========================================================================== */

.statistics-section { position: relative; }

.statistics-section .statistic-overlay {
  background: var(--jv-grad-hero) !important;
  opacity: .92 !important;
}

.statistics-container { padding: 84px 0 !important; }

.statistics-section .round strong {
  color: var(--jv-white) !important;
  font-weight: 800 !important;
}

.statistics-section .round h5 {
  color: rgba(255, 255, 255, .82) !important;
  font-weight: 600 !important;
}

.statistics-section .round h5 i { color: var(--jv-orange-300) !important; }

/* ==========================================================================
   8. PORTFOLIO / CASES
   ========================================================================== */

.case-section { padding: 96px 0 100px; background: var(--jv-white); }

.single-case {
  border-radius: var(--jv-radius) !important;
  overflow: hidden;
}

.single-case .outer-container {
  background: linear-gradient(0deg, rgba(4, 27, 54, .88) 0%, rgba(4, 27, 54, .12) 65%) !important;
}

.single-case h4 { font-weight: 700 !important; }

a.readmore-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  padding: 13px 26px !important;
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border: 0 !important;
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease);
}

a.readmore-btn::before,
a.readmore-btn::after { display: none !important; }

a.readmore-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--jv-shadow-orange);
  color: var(--jv-white) !important;
}

/* ==========================================================================
   9. TESTIMONIALS
   ========================================================================== */

.testimonial-section {
  padding: 96px 0 100px !important;
  background: linear-gradient(180deg, #F6F9FC 0%, #FFFFFF 70%);
}

.single-testimonial {
  position: relative;
  margin: 20px 12px 30px !important;
  padding: 40px 32px 34px !important;
  border-radius: var(--jv-radius) !important;
  background: var(--jv-white) !important;
  border: 1px solid rgba(11, 53, 96, .1) !important;
  box-shadow: var(--jv-shadow-sm);
  text-align: left !important;
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease);
}

.single-testimonial:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 48px rgba(4, 27, 54, .13);
}

/* decorative quote mark instead of the old bitmap */
.single-testimonial::before {
  content: "\201C";
  position: absolute;
  top: 6px;
  right: 26px;
  font-family: Georgia, serif;
  font-size: 96px;
  line-height: 1;
  color: rgba(224, 138, 46, .18);
  pointer-events: none;
}

.single-testimonial .img-wrapper {
  width: 62px !important;
  height: 62px !important;
  margin: 0 0 20px !important;
  border-radius: 50% !important;
  overflow: hidden;
  border: 3px solid rgba(224, 138, 46, .3);
  background: rgba(15, 92, 158, .1);
}

.single-testimonial .img-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 50% !important;
}

.single-testimonial .client-desc { text-align: left !important; }

.single-testimonial .comment {
  color: var(--jv-body) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  font-style: normal !important;
  margin-bottom: 22px !important;
}

.single-testimonial .name {
  font-family: inherit !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--jv-ink) !important;
  margin-bottom: 3px !important;
}

.single-testimonial .rank {
  font-size: 13px !important;
  color: var(--jv-orange-500) !important;
  font-weight: 600 !important;
  margin: 0 !important;
}

/* carousel dots, shared across every owl carousel on the page */
.owl-carousel .owl-dots { margin-top: 22px !important; }

.owl-carousel .owl-dot span {
  width: 9px !important;
  height: 9px !important;
  background: rgba(11, 53, 96, .22) !important;
  transition: width .3s var(--jv-ease), background .3s var(--jv-ease);
}

.owl-carousel .owl-dot.active span {
  width: 28px !important;
  border-radius: 5px !important;
  background: var(--jv-grad-orange) !important;
}

/* ==========================================================================
   10. TEAM
   ========================================================================== */

.team-section {
  padding: 96px 0 104px !important;
  background: #f6f9fc !important;
}

.team-section .team-overlay { display: none !important; }

.team-section .section-summary {
  max-width: 560px;
  margin: 14px auto 46px !important;
  color: var(--jv-ink) !important;
  font-size: 42px !important;
  line-height: 1.12 !important;
}
.team-section .section-title { color: var(--jv-orange-300) !important; }

.single-team-member {
  margin: 0 12px 20px !important;
  min-height: 334px;
  padding: 22px 18px 24px !important;
  border-radius: var(--jv-radius) !important;
  overflow: hidden;
  background: var(--jv-white) !important;
  border: 1px solid rgba(11, 53, 96, .1) !important;
  box-shadow: 0 16px 34px rgba(6, 45, 74, .08);
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease), border-color .35s var(--jv-ease);
}

.single-team-member:hover {
  transform: translateY(-6px);
  border-color: rgba(206, 101, 18, .3) !important;
  box-shadow: 0 22px 42px rgba(6, 45, 74, .12);
}

.team-img-wrapper {
  width: 154px !important;
  height: 154px !important;
  margin: 2px auto 0 !important;
  border-radius: 50% !important;
  overflow: visible !important;
  background: transparent !important;
}

.team-img-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: 5px solid #eef5fb;
  border-radius: 50% !important;
  transition: transform .6s var(--jv-ease);
}

.single-team-member:hover .team-img-wrapper img { transform: scale(1.04); }

.social-accounts {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: 16px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.social-accounts ul,
.social-accounts .social-account-lists {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  text-align: center;
}

.single-team-member:hover .social-accounts {
  transform: none !important;
}

.social-accounts ul li {
  width: 28px !important;
  height: 28px !important;
  line-height: 28px !important;
  margin: 0 !important;
  display: block !important;
}

.social-accounts ul li a,
.social-account-lists .single-social-account a {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 28px !important;
  height: 28px !important;
  line-height: 1 !important;
  background: #f4f8fb !important;
  color: var(--jv-blue-700) !important;
  border: 0 !important;
  border-radius: 50% !important;
  font-size: 13px !important;
  text-indent: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  transition: background .28s var(--jv-ease), color .28s var(--jv-ease);
}

.social-accounts ul li a i,
.social-account-lists .single-social-account a i {
  display: inline-block !important;
  color: currentColor !important;
  font-size: 13px !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.social-accounts ul li a:hover,
.social-account-lists .single-social-account a:hover {
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  border-color: transparent !important;
}

.member-info {
  padding: 16px 8px 0 !important;
  text-align: center;
  background: var(--jv-white) !important;
}

.member-info .member-name {
  color: var(--jv-ink) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}

.member-info small {
  display: inline-block;
  margin-top: 8px;
  padding: 7px 12px;
  color: var(--jv-blue-700) !important;
  background: rgba(11, 53, 96, .07);
  border-radius: var(--jv-radius) !important;
  font-size: 13px !important;
  font-weight: 700;
  line-height: 1.6;
}

/* ==========================================================================
   11. PRICING / PLANS  — the money section
   ========================================================================== */

.pricing-tables {
  padding: 96px 0 104px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F6F9FC 100%);
}

.single-pricing-table {
  position: relative;
  display: flex !important;
  flex-direction: column;
  margin: 20px 12px 30px !important;
  padding: 38px 32px 36px !important;
  border-radius: var(--jv-radius-lg) !important;
  background: var(--jv-white) !important;
  border: 1px solid rgba(11, 53, 96, .12) !important;
  box-shadow: var(--jv-shadow-sm);
  text-align: left !important;
  overflow: hidden;
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease),
              border-color .35s var(--jv-ease);
}

/* brand bar across the top, fills in on hover */
.single-pricing-table::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: var(--jv-grad-orange);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s var(--jv-ease);
}

.single-pricing-table:hover {
  transform: translateY(-10px);
  border-color: rgba(224, 138, 46, .4) !important;
  box-shadow: 0 28px 56px rgba(4, 27, 54, .16);
}

.single-pricing-table:hover::before { transform: scaleX(1); }

.single-pricing-table .title {
  display: inline-block;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--jv-blue-500) !important;
  background: rgba(15, 92, 158, .09);
  padding: 7px 15px;
  border-radius: var(--jv-radius-pill);
  margin-bottom: 22px !important;
}

.single-pricing-table .price { margin-bottom: 8px !important; }

.single-pricing-table .price h1 {
  font-size: 46px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em;
  color: var(--jv-ink) !important;
  margin: 0 !important;
  line-height: 1.1 !important;
}

.single-pricing-table .features {
  flex: 1;
  padding: 24px 0 26px !important;
  margin: 20px 0 0 !important;
  border-top: 1px solid rgba(11, 53, 96, .1);
  color: var(--jv-body) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
}

.single-pricing-table .features ul { padding-left: 0; list-style: none; margin: 0; }

.single-pricing-table .features ul li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
}

.single-pricing-table .features ul li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 1px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: var(--jv-grad-orange);
}

.single-pricing-table a.pricing-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  height: auto !important;
  line-height: 1 !important;
  margin-top: auto;
  padding: 17px 26px !important;
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-navy-700) !important;
  color: var(--jv-white) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: 0 !important;
  transition: background .3s var(--jv-ease), transform .28s var(--jv-ease),
              box-shadow .28s var(--jv-ease);
}

.single-pricing-table a.pricing-btn::before,
.single-pricing-table a.pricing-btn::after { display: none !important; }

.single-pricing-table:hover a.pricing-btn {
  background: var(--jv-grad-orange) !important;
  transform: translateY(-2px);
  box-shadow: var(--jv-shadow-orange);
}

/* ==========================================================================
   12. BLOG
   ========================================================================== */

.blog-section {
  padding: 96px 0 100px !important;
  background: var(--jv-white);
}

.single-blog {
  display: flex !important;
  flex-direction: column;
  margin: 0 12px 26px !important;
  border-radius: var(--jv-radius) !important;
  overflow: hidden;
  background: var(--jv-white);
  border: 1px solid rgba(11, 53, 96, .1);
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease);
}

.single-blog:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(4, 27, 54, .13);
}

.blog-img-wrapper { overflow: hidden; }

.blog-img-wrapper img {
  width: 100%;
  transition: transform .6s var(--jv-ease);
}

.single-blog:hover .blog-img-wrapper img { transform: scale(1.06); }

.blog-txt {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 26px 26px 28px !important;
}

.blog-txt .date {
  font-size: 13px !important;
  color: var(--jv-body) !important;
  margin-bottom: 10px !important;
}

.blog-txt .date .username { color: var(--jv-orange-500) !important; font-weight: 600; }

.blog-txt .blog-title { margin-bottom: 10px !important; }

.blog-txt .blog-title a {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--jv-ink) !important;
  line-height: 1.4;
  transition: color .28s var(--jv-ease);
}

.blog-txt .blog-title a:hover { color: var(--jv-orange-500) !important; }

.blog-txt .blog-summary {
  color: var(--jv-body) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin-bottom: 22px !important;
}

.blog-txt a.readmore-btn { align-self: flex-start; margin-top: auto; }

/* ==========================================================================
   13. CALL TO ACTION
   ========================================================================== */

.cta-section { position: relative; }

.cta-section .cta-overlay {
  background: var(--jv-grad-hero) !important;
  opacity: .94 !important;
}

.cta-section .cta-content {
  position: relative;
  z-index: 2;
  padding: 64px 0 !important;
}

.cta-section .cta-content .row { align-items: center; }

.cta-section h3 {
  color: var(--jv-white) !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em;
  line-height: 1.3 !important;
  margin: 0 !important;
}

.cta-section .contact-btn-wrapper {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* ==========================================================================
   14. PARTNERS
   ========================================================================== */

.partner-section {
  padding: 72px 0 76px !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F6F9FC 100%);
}

/* the theme's bare 2px rule is replaced by a hairline inside the container */
.partner-section .top-border {
  border-top: 0 !important;
  padding-top: 0 !important;
}

/* logo tiles: uniform boxes so mismatched logo shapes still line up */
.partner-section .single-partner-item {
  display: flex !important;
  align-items: center;
  justify-content: center;
  height: 120px !important;
  margin: 0 10px;
  padding: 18px 22px;
  border-radius: var(--jv-radius);
  background: var(--jv-white);
  border: 1px solid rgba(11, 53, 96, .09);
  transition: transform .35s var(--jv-ease), box-shadow .35s var(--jv-ease),
              border-color .35s var(--jv-ease);
}

.partner-section .single-partner-item .outer-container,
.partner-section .single-partner-item .inner-container {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
}

.partner-section .single-partner-item img {
  max-height: 64px;
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .55;
  transition: filter .35s var(--jv-ease), opacity .35s var(--jv-ease),
              transform .35s var(--jv-ease);
}

.partner-section .single-partner-item:hover {
  transform: translateY(-6px);
  border-color: rgba(224, 138, 46, .38);
  box-shadow: 0 18px 38px rgba(4, 27, 54, .12);
}

.partner-section .single-partner-item:hover img {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.04);
}

/* tiles whose logo file 404s are marked by the script in index.blade.php */
.partner-section .single-partner-item[data-jv-broken] { display: none !important; }

/* carousel arrows */
.owl-carousel.common-carousel.partner-carousel .owl-nav button.owl-next,
.owl-carousel.common-carousel.partner-carousel .owl-nav button.owl-prev {
  width: 36px !important;
  height: 36px !important;
  background: var(--jv-white) !important;
  border: 1px solid rgba(11, 53, 96, .12) !important;
  color: var(--jv-navy-700) !important;
  box-shadow: var(--jv-shadow-sm);
  transition: background .25s var(--jv-ease), color .25s var(--jv-ease),
              border-color .25s var(--jv-ease);
}

.owl-carousel.common-carousel.partner-carousel .owl-nav button.owl-next:hover,
.owl-carousel.common-carousel.partner-carousel .owl-nav button.owl-prev:hover {
  background: var(--jv-grad-orange) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* ==========================================================================
   15. HEADER / NAV
   ========================================================================== */

.header-area.modern-header {
  background: rgba(255, 255, 255, .98) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(11, 53, 96, .08);
}

/* once the page scrolls the bar is fully opaque so content never bleeds through */
.header-area.modern-header.sticky-navbar,
.header-area.modern-header.sticky,
.header-area.modern-header.is-sticky,
.header-area.modern-header.stick {
  background: var(--jv-white) !important;
  /* opaque now, so the blur is redundant and only costs compositing */
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 6px 24px rgba(4, 27, 54, .1);
}

.header-area.modern-header.sticky-navbar .header-navbar,
.header-area.modern-header .header-navbar {
  background: transparent !important;
}

.support-bar-area {
  background: var(--jv-navy-800) !important;
  border: 0 !important;
}

.support-contact-info span,
.support-bar-area .language-btn,
.support-bar-area ul.login li a {
  color: rgba(255, 255, 255, .82) !important;
  font-size: 14px !important;
  transition: color .25s var(--jv-ease);
}

.support-contact-info span i,
.support-bar-area .language-btn i { color: var(--jv-orange-300) !important; }

.support-bar-area ul.login li a:hover,
.support-bar-area .language-btn:hover { color: var(--jv-orange-300) !important; }

.support-bar-area ul.social-links li a {
  color: rgba(255, 255, 255, .62) !important;
  transition: color .25s var(--jv-ease), transform .25s var(--jv-ease);
  display: inline-block;
}

.support-bar-area ul.social-links li a:hover {
  color: var(--jv-orange-300) !important;
  transform: translateY(-2px);
}

.main-menu > li > a {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--jv-ink) !important;
  transition: color .25s var(--jv-ease);
}

.main-menu > li > a:hover,
.main-menu > li > a.active,
.main-menu > li.active > a { color: var(--jv-orange-500) !important; }

/* the quote CTA in the nav */
.main-menu li a.quote-btn,
.header-navbar a.quote-btn,
.main-menu > li:last-child > a.quote-btn {
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  box-shadow: var(--jv-shadow-orange);
  padding: 14px 28px !important;
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease);
}

.main-menu li a.quote-btn:hover {
  transform: translateY(-2px);
  color: var(--jv-white) !important;
  box-shadow: 0 16px 34px rgba(184, 65, 10, .45);
}

.main-menu .dropdown-lists,
.main-menu ul.dropdown-lists {
  border-radius: var(--jv-radius-sm) !important;
  border: 1px solid rgba(11, 53, 96, .1) !important;
  box-shadow: var(--jv-shadow-md) !important;
  padding: 10px !important;
}

.main-menu .dropdown-lists li a {
  border-radius: 6px;
  padding: 9px 12px !important;
  font-size: 14px !important;
  color: var(--jv-body) !important;
  transition: background .22s var(--jv-ease), color .22s var(--jv-ease);
}

.main-menu .dropdown-lists li a:hover {
  background: rgba(224, 138, 46, .1);
  color: var(--jv-orange-500) !important;
}

.header-area.modern-header .main-menu > li.dropdown {
  position: relative;
}

.header-area.modern-header .main-menu > li.dropdown::after {
  display: none !important;
  content: none !important;
}

.header-area.modern-header .main-menu > li.dropdown > a.dropdown-btn {
  position: relative;
  padding: 13px 34px 13px 16px !important;
  border-radius: var(--jv-radius-sm);
}

.header-area.modern-header .main-menu > li.dropdown:hover > a.dropdown-btn {
  color: var(--jv-orange-500) !important;
  background: rgba(224, 138, 46, .1);
}

.header-area.modern-header .main-menu > li.dropdown > a.dropdown-btn::after {
  content: "\f107";
  position: absolute;
  right: 14px;
  top: 50%;
  display: block;
  margin: 0;
  font-family: "Font Awesome 5 Free";
  font-size: 11px;
  font-weight: 900;
  color: currentColor;
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  transform: translateY(-50%);
  transition: transform .22s var(--jv-ease);
}

.header-area.modern-header .main-menu > li.dropdown > a.dropdown-btn::before {
  display: none !important;
  content: none !important;
}

.header-area.modern-header .main-menu > li.dropdown:hover > a.dropdown-btn::after {
  transform: translateY(-50%) rotate(180deg);
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists {
  top: calc(100% + 10px) !important;
  left: 0 !important;
  min-width: 230px;
  padding: 10px !important;
  overflow: hidden !important;
  background: #f7f9fc !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 34px rgba(10, 35, 64, .12) !important;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists::before {
  display: none !important;
  content: none !important;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li {
  display: block;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  position: relative !important;
  z-index: auto !important;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li + li {
  margin-top: 2px !important;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li a {
  display: block !important;
  min-height: auto;
  padding: 10px 12px !important;
  color: #17324d !important;
  background: transparent !important;
  border-radius: 9px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li a::before,
.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li a::after {
  display: none !important;
  content: none !important;
}

.header-area.modern-header .main-menu > li.dropdown > ul.dropdown-lists li a:hover {
  color: var(--jv-orange-600) !important;
  background: rgba(224, 138, 46, .09) !important;
  transform: none;
}

.logo-wrapper img { max-height: 62px; width: auto; }

/* --- mobile drawer -----------------------------------------------------
   Theme bug: style.css has `.modern-header .main-menu { display: flex }`
   (specificity 0,2,0) which outranks responsive.css's `ul.main-menu
   { display: none }` (0,1,1) inside the max-width:991px query — so the
   desktop menu never actually hid on mobile. Everything below fixes that
   and restyles the slicknav drawer to match the redesign.
   ------------------------------------------------------------------- */

@media only screen and (max-width: 991px) {

  .header-area.modern-header .main-menu,
  .modern-header ul.main-menu {
    display: none !important;
  }

  .header-area.modern-header { padding: 0; }

  .header-navbar { padding: 14px 0 !important; }

  /* the theme's header container supplies no gutter, so the row's -15px
     bootstrap margins pushed the bar 15px past the viewport on both sides */
  .header-navbar > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .modern-header .logo-wrapper img,
  .logo-wrapper img { max-height: 44px !important; }

  #mobileMenu { display: block; }

  .slicknav_menu {
    display: flex !important;
    justify-content: flex-end;
    background: transparent !important;
    padding: 0 !important;
  }

  /* hamburger */
  .slicknav_btn {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: var(--jv-radius-sm) !important;
    background: var(--jv-grad-orange) !important;
    border: 0 !important;
    box-shadow: 0 6px 16px rgba(184, 65, 10, .3);
    transition: transform .25s var(--jv-ease), box-shadow .25s var(--jv-ease);
  }

  .slicknav_btn:hover { transform: translateY(-1px); }

  .slicknav_menu .slicknav_menutxt { display: none !important; }

  .slicknav_menu .slicknav_icon {
    float: none !important;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    width: 20px !important;
    height: auto !important;
    margin: 0 !important;
  }

  .slicknav_menu .slicknav_icon-bar {
    width: 20px !important;
    height: 2px !important;
    margin: 0 !important;
    border-radius: 2px !important;
    background: var(--jv-white) !important;
    box-shadow: none !important;
    transition: transform .28s var(--jv-ease), opacity .2s var(--jv-ease);
  }

  /* hamburger morphs into a close icon while the drawer is open */
  .slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(2) { opacity: 0; }
  .slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  /* drawer panel — anchored to the bottom of the header, not a magic px value */
  .modern-header ul.slicknav_nav,
  ul.slicknav_nav,
  .sticky-navbar ul.slicknav_nav {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 0 16px !important;
    background: var(--jv-grad-hero) !important;
    border-top: 1px solid rgba(255, 255, 255, .1);
    box-shadow: 0 22px 44px rgba(4, 27, 54, .34);
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .slicknav_nav li { border: 0 !important; }

  .modern-header .slicknav_nav a,
  .modern-header .slicknav_nav .slicknav_row,
  .slicknav_nav a,
  .slicknav_nav .slicknav_row {
    margin: 0 10px !important;
    padding: 13px 16px !important;
    border-radius: var(--jv-radius-sm) !important;
    color: rgba(255, 255, 255, .84) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    background: transparent !important;
    transition: background .22s var(--jv-ease), color .22s var(--jv-ease);
  }

  .modern-header .slicknav_nav a:hover,
  .modern-header .slicknav_nav .slicknav_row:hover,
  .slicknav_nav a:hover,
  .slicknav_nav .slicknav_row:hover,
  .slicknav_nav .slicknav_row.slicknav_open {
    background: rgba(255, 255, 255, .09) !important;
    color: var(--jv-orange-300) !important;
  }

  /* slicknav wraps parent items as .slicknav_row > a, so both would take the
     padding above and those rows would sit indented from their siblings */
  .slicknav_nav .slicknav_row > a,
  .slicknav_nav .slicknav_row a.slicknav_item {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  .slicknav_nav .slicknav_row {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }

  /* nested submenus get an indent and a rule so hierarchy is readable */
  .slicknav_nav ul {
    margin: 2px 0 6px 22px !important;
    padding-left: 12px !important;
    border-left: 1px solid rgba(255, 255, 255, .14);
  }

  .slicknav_nav ul a {
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 14px !important;
    color: rgba(255, 255, 255, .66) !important;
  }

  .slicknav_nav .slicknav_arrow {
    float: none !important;
    margin: 0 !important;
    color: var(--jv-orange-300);
    font-size: 12px;
    transition: transform .25s var(--jv-ease);
  }

  .slicknav_nav .slicknav_row.slicknav_open .slicknav_arrow,
  .slicknav_nav a.slicknav_open .slicknav_arrow { transform: rotate(90deg); }

  /* mega-menu headings that only make sense on desktop */
  .slicknav_nav h5.service-title {
    color: var(--jv-sky-200) !important;
    font-size: 12px !important;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 14px 0 4px 32px !important;
  }

  /* the quote CTA stays a real button inside the drawer */
  .modern-header ul.slicknav_nav li a.boxed-btn,
  ul.slicknav_nav li a.boxed-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 14px 20px 4px !important;
    padding: 15px 26px !important;
    border-radius: var(--jv-radius-pill) !important;
    background: var(--jv-grad-orange) !important;
    color: var(--jv-white) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: none !important;
    box-shadow: var(--jv-shadow-orange);
  }

  .modern-header ul.slicknav_nav li a.boxed-btn:hover,
  ul.slicknav_nav li a.boxed-btn:hover {
    background: var(--jv-grad-orange) !important;
    color: var(--jv-white) !important;
    filter: brightness(1.06);
  }
}

/* the top support bar hides below 992px, so drop the header's dark cap */
@media only screen and (max-width: 991px) {
  .support-bar-area { display: none !important; }
}

/* ==========================================================================
   16. FOOTER
   ========================================================================== */

.footer-section.modern-footer {
  background: var(--jv-grad-hero) !important;
  position: relative;
  overflow: hidden;
}

.footer-section.modern-footer::before {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -180px;
  top: -220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 138, 46, .2) 0%, rgba(224, 138, 46, 0) 70%);
  filter: blur(70px);
  pointer-events: none;
}

.footer-section .container { position: relative; z-index: 1; }

.top-footer-section {
  padding: 76px 0 56px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
}

.footer-logo-wrapper img { max-height: 64px; width: auto; }

/* the logo is dark-on-white — give it a light plate so it stays legible on navy */
.modern-footer .footer-logo-wrapper {
  display: inline-block !important;
  padding: 12px 18px !important;
  border-radius: var(--jv-radius) !important;
  background: rgba(255, 255, 255, .94) !important;
  margin-bottom: 22px !important;
}

.footer-txt {
  color: rgba(255, 255, 255, .68) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
}

.footer-txt .see-more { color: var(--jv-orange-300) !important; }

.modern-footer h4 {
  color: var(--jv-white) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  margin-bottom: 22px !important;
  position: relative;
  padding-bottom: 12px;
}

.modern-footer h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 32px;
  height: 2px;
  border-radius: 2px;
  background: var(--jv-grad-orange);
}

.footer-links li a {
  color: rgba(255, 255, 255, .66) !important;
  font-size: 15px !important;
  line-height: 2.1 !important;
  transition: color .25s var(--jv-ease), padding-left .25s var(--jv-ease);
}

.footer-links li a:hover {
  color: var(--jv-orange-300) !important;
  padding-left: 6px;
}

.footer-newsletter p {
  color: rgba(255, 255, 255, .66) !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  margin-bottom: 16px !important;
}

.footer-newsletter input[type="email"] {
  width: 100%;
  padding: 14px 18px !important;
  border-radius: var(--jv-radius-sm) !important;
  background: rgba(255, 255, 255, .07) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  color: var(--jv-white) !important;
  font-size: 14px !important;
  margin-bottom: 12px;
  transition: border-color .25s var(--jv-ease), background .25s var(--jv-ease);
}

.footer-newsletter input[type="email"]::placeholder { color: rgba(255, 255, 255, .4); }

.footer-newsletter input[type="email"]:focus {
  outline: none;
  background: rgba(255, 255, 255, .1) !important;
  border-color: rgba(240, 169, 78, .6) !important;
}

.footer-newsletter button {
  width: 100%;
  padding: 14px 26px !important;
  border-radius: var(--jv-radius-pill) !important;
  background: var(--jv-grad-orange) !important;
  color: var(--jv-white) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: 0 !important;
  cursor: pointer;
  transition: transform .28s var(--jv-ease), box-shadow .28s var(--jv-ease);
}

.footer-newsletter button:hover {
  transform: translateY(-2px);
  box-shadow: var(--jv-shadow-orange);
}

.footer-contact-info ul { padding: 0; list-style: none; margin: 0; }

.footer-contact-info ul li {
  display: flex !important;
  align-items: flex-start;
  gap: 13px;
  color: rgba(255, 255, 255, .68) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin-bottom: 16px !important;
}

.footer-contact-info ul li i {
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-size: 13px;
  color: var(--jv-orange-300) !important;
  background: rgba(224, 138, 46, .13);
  margin: 0 !important;
}

.copyright-section {
  padding: 26px 0 !important;
  color: rgba(255, 255, 255, .52) !important;
  font-size: 14px !important;
  border: 0 !important;
}

.copyright-section a { color: var(--jv-orange-300) !important; }

/* back-to-top button */
.back-to-top {
  border-radius: 50% !important;
  background: var(--jv-grad-orange) !important;
  color: #fff !important;
  box-shadow: var(--jv-shadow-orange);
  border: 0 !important;
}

/* ==========================================================================
   17. RESPONSIVE
   ========================================================================== */

@media (max-width: 1199px) {
  .jv-hero__title { font-size: 52px; }
  .jv-speed__value { font-size: 56px; }
  .jv-float-badge--support { left: -14px; bottom: 26px; }
}

@media (max-width: 991px) {
  .jv-hero { padding-top: 108px; }
  .jv-hero__copy { padding: 24px 0 8px; max-width: 100%; text-align: center; margin: 0 auto; }
  .jv-hero__lede { margin-left: auto; margin-right: auto; }
  .jv-hero__actions,
  .jv-hero__proof { justify-content: center; }
  .jv-hero__visual { min-height: auto; padding: 42px 0 92px; }
  .jv-hero__title { font-size: 46px; }
  .jv-features { margin-top: -56px; }
  .jv-features__grid { grid-template-columns: repeat(2, 1fr); }
  .section-summary { font-size: 32px !important; }
  .intro-txt { padding: 54px 36px !important; }
  .intro-txt h2, .intro-txt .section-summary { font-size: 28px !important; }
  .intro-bg { min-height: 320px; }
  .service-categories { padding: 72px 0 76px; }
  .service-categories.jv-services-dark { padding: 76px 0 80px; }
  .jv-services-dark .single-category { padding: 32px 28px 30px !important; }
  .jv-services-dark .single-category .text h4 { font-size: 20px !important; }
  .approach-section,
  .case-section,
  .testimonial-section,
  .team-section,
  .pricing-tables,
  .blog-section { padding: 72px 0 76px !important; }
  .approach-summary { padding-right: 0; margin-bottom: 40px; }
  .cta-section h3 { font-size: 26px !important; text-align: center; margin-bottom: 26px !important; }
  .cta-section .contact-btn-wrapper { justify-content: center; }
  .cta-section .cta-content { padding: 52px 0 !important; }
  .top-footer-section { padding: 60px 0 42px !important; }
  .modern-footer h4 { margin-top: 34px !important; }
  .modern-footer-brand h4 { margin-top: 0 !important; }
  /* centred under the card; transform is used for centring, so drop the float */
  .jv-float-badge--support {
    left: 50%;
    right: auto;
    bottom: 74px;
    transform: translateX(-50%);
    animation: none;
  }
  .intro-section { padding-top: 70px; }
}

@media (max-width: 767px) {
  .jv-hero { padding-top: 92px; }
  .jv-hero__title { font-size: 36px; }
  .jv-hero__lede { font-size: 16px; }
  .jv-hero__eyebrow { font-size: 11px; padding: 7px 15px 7px 11px; }
  .jv-btn { padding: 15px 26px; font-size: 14px; }
  .jv-hero__actions .jv-btn { flex: 1 1 100%; }
  .jv-speed__value { font-size: 48px; }
  .jv-signal-card { padding: 26px; }
  .jv-bars { height: 60px; }
  .jv-float-badge--support { bottom: 66px; }
  .jv-hero__visual { padding-bottom: 132px; }
  .jv-features { margin-top: -44px; }
  .intro-section { padding-top: 60px; }
  .jv-features__grid { grid-template-columns: 1fr; gap: 16px; }
  .jv-hero__grid { background-size: 40px 40px; }
  .section-summary { font-size: 27px !important; }
  .section-title { font-size: 12px !important; }
  .intro-txt { padding: 42px 26px !important; }
  .intro-txt h2, .intro-txt .section-summary { font-size: 24px !important; }
  .intro-bg { min-height: 240px; }
  .service-categories { padding: 58px 0 62px; }
  .service-categories.jv-services-dark { padding: 60px 0 64px; }
  .single-category { padding: 30px 24px 28px !important; }
  .jv-services-dark .single-category { padding: 28px 24px 26px !important; margin-bottom: 18px; }
  .jv-services-dark .single-category .img-wrapper { width: 60px; height: 60px; border-radius: 16px; margin-bottom: 20px !important; }
  .jv-services-dark .single-category .img-wrapper i { font-size: 24px; }
  .jv-services-dark .single-category .text h4 { font-size: 19px !important; }
  .jv-services-dark .single-category .text p { font-size: 15px !important; }
  .jv-services-dark .section-summary { margin-bottom: 34px !important; }
  .jv-services__grid-lines { background-size: 44px 44px; }
  .approach-section,
  .case-section,
  .testimonial-section,
  .team-section,
  .pricing-tables,
  .blog-section { padding: 58px 0 62px !important; }
  .single-approach { padding: 22px !important; gap: 16px; }
  .approach-icon-wrapper { width: 48px !important; height: 48px !important; border-radius: 13px !important; }
  .approach-icon-wrapper i { font-size: 18px !important; }
  .single-testimonial { padding: 32px 24px 28px !important; margin: 16px 6px 24px !important; }
  .single-pricing-table { padding: 30px 24px 30px !important; margin: 16px 6px 24px !important; }
  .single-pricing-table .price h1 { font-size: 38px !important; }
  .cta-section h3 { font-size: 22px !important; }
  .statistics-container { padding: 60px 0 !important; }
  .partner-section { padding: 48px 0 52px !important; }
  .partner-section .single-partner-item { height: 96px !important; padding: 14px 18px; }
  .partner-section .single-partner-item img { max-height: 48px; }
}

@media (max-width: 400px) {
  .jv-hero__title { font-size: 31px; }
  .jv-float-badge { padding: 11px 14px; }
}

/* ==========================================================================
   4. ACCESSIBILITY
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  .jv-hero__glow--orange,
  .jv-hero__glow--blue,
  .jv-rings span,
  .jv-signal-card,
  .jv-float-badge,
  .jv-bars span,
  .jv-hero__pulse,
  .jv-chip__dot {
    animation: none !important;
  }
  .jv-bars span { transform: none; opacity: .9; }
  .jv-rings span { opacity: .18; transform: scale(1.6); }
}

.jv-btn:focus-visible,
.jv-feature:focus-visible {
  outline: 3px solid var(--jv-orange-300);
  outline-offset: 3px;
}