/*
 Theme Name: JustPhoenix Serbia
 Theme URI: https://justphoenix.com/
 Description: Serbian JustPhoenix child theme for SolTeck.
 Author: JustPhoenix
 Template: solteck
 Version: 1.0.0
 Text Domain: justphoenix
*/

:root {
  --jp-navy: #083d59;
  --jp-blue: #308af0;
  --jp-blue-dark: #176fce;
  --jp-ink: #181b27;
  --jp-muted: #677082;
  --jp-pale: #f4f7ff;
  --jp-line: #dfe6f1;
  --jp-white: #ffffff;
  --primarycolor: #308af0;
}

body { color: var(--jp-ink); }
.jp-elementor-section > .elementor-container { max-width: none !important; }
.jp-elementor-section .elementor-widget-html, .jp-elementor-section .elementor-widget-container { width: 100%; }
.jp-section { position: relative; overflow: hidden; padding: 104px 24px; }
.jp-shell { width: min(1180px, 100%); margin: 0 auto; }
.jp-eyebrow { margin: 0 0 18px; color: var(--jp-blue); font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.jp-section h1, .jp-section h2, .jp-section h3, .jp-section p { margin-top: 0; }
.jp-section h1 { max-width: 760px; margin-bottom: 26px; color: var(--jp-ink); font-size: clamp(48px, 6vw, 78px); line-height: 1.02; letter-spacing: -.045em; }
.jp-section h1 span { color: var(--jp-blue); }
.jp-section h2 { color: var(--jp-ink); font-size: clamp(34px, 4vw, 52px); line-height: 1.08; letter-spacing: -.035em; }
.jp-section h3 { color: var(--jp-ink); font-size: 22px; line-height: 1.25; }
.jp-section p { color: var(--jp-muted); font-size: 17px; line-height: 1.75; }
.jp-lead { max-width: 680px; font-size: 20px !important; }
.jp-hero { min-height: 720px; display: grid; align-items: center; padding-top: 140px; background: radial-gradient(circle at 74% 34%, rgba(48,138,240,.15), transparent 30%), linear-gradient(135deg, #fff 0%, #f4f3ff 54%, #eef6ff 100%); }
.jp-hero:after { content: ""; position: absolute; width: 540px; height: 540px; right: 4%; top: 90px; border: 1px solid rgba(48,138,240,.14); border-radius: 50%; box-shadow: 0 0 0 80px rgba(48,138,240,.025), 0 0 0 160px rgba(48,138,240,.018); }
.jp-hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.2fr .8fr; gap: 48px; align-items: center; }
.jp-actions { display: flex; gap: 28px; align-items: center; margin-top: 34px; }
.jp-button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 28px; border-radius: 7px; background: var(--jp-blue); color: #fff !important; font-weight: 800; text-decoration: none; box-shadow: 0 14px 28px rgba(48,138,240,.22); }
.jp-button:hover { background: var(--jp-blue-dark); transform: translateY(-2px); }
.jp-text-link { color: var(--jp-ink) !important; font-weight: 800; text-decoration: none; }
.jp-hero-visual { min-height: 430px; position: relative; }
.jp-orbit { position: absolute; inset: 0; margin: auto; width: 360px; height: 360px; border: 1px solid rgba(48,138,240,.26); border-radius: 50%; animation: jpFloat 7s ease-in-out infinite; }
.jp-orbit:before, .jp-orbit:after { content: ""; position: absolute; inset: 42px; border: 1px dashed rgba(48,138,240,.22); border-radius: 50%; }
.jp-orbit:after { inset: 96px; border-style: solid; background: rgba(255,255,255,.55); }
.jp-orbit-core { position: absolute; z-index: 3; inset: 0; width: 112px; height: 112px; margin: auto; display: grid; place-items: center; border-radius: 30px; background: var(--jp-navy); color: #fff; font-size: 36px; font-weight: 900; box-shadow: 0 24px 60px rgba(8,61,89,.25); }
.jp-orbit-node { position: absolute; z-index: 4; padding: 12px 16px; border: 1px solid rgba(48,138,240,.15); border-radius: 12px; background: #fff; color: var(--jp-navy); font-size: 13px; font-weight: 800; box-shadow: 0 12px 30px rgba(8,61,89,.1); }
.jp-orbit-node-1 { top: 0; left: 42%; }.jp-orbit-node-2 { right: -22px; top: 45%; }.jp-orbit-node-3 { bottom: 10px; left: 30%; }.jp-orbit-node-4 { left: -18px; top: 40%; }
@keyframes jpFloat { 50% { transform: translateY(-12px); } }
.jp-proof { padding: 42px 24px; border-top: 1px solid var(--jp-line); border-bottom: 1px solid var(--jp-line); background: #fff; text-align: center; }
.jp-proof p { margin-bottom: 24px; font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.jp-proof .jp-shell > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 30px 64px; }
.jp-proof span { color: #667085; font-size: 18px; font-weight: 800; }
.jp-heading, .jp-split { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; margin-bottom: 54px; }
.jp-heading > p { max-width: 520px; }
.jp-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.jp-card { min-height: 285px; padding: 36px; border: 1px solid var(--jp-line); border-radius: 20px; background: #fff; box-shadow: 0 8px 30px rgba(8,61,89,.055); transition: .25s ease; }
.jp-card:hover { transform: translateY(-6px); border-color: rgba(48,138,240,.45); box-shadow: 0 18px 44px rgba(8,61,89,.1); }
.jp-card-index { display: inline-grid; place-items: center; width: 42px; height: 42px; margin-bottom: 38px; border-radius: 50%; background: var(--jp-pale); color: var(--jp-blue); font-size: 13px; font-weight: 800; }
.jp-card p { margin-bottom: 0; font-size: 15px; }
.jp-dark-section { background: var(--jp-navy); }
.jp-dark-section h2, .jp-dark-section h3, .jp-dark-section strong { color: #fff; }
.jp-dark-section p { color: rgba(255,255,255,.7); }
.jp-dark-section .jp-eyebrow { color: #74b6ff; }
.jp-statements p { padding: 0 0 26px 24px; border-left: 2px solid rgba(255,255,255,.18); }
.jp-process { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid var(--jp-line); border-radius: 20px; overflow: hidden; background: var(--jp-line); }
.jp-process > div { padding: 34px; background: #fff; }
.jp-process span { color: var(--jp-blue); font-size: 13px; font-weight: 800; }
.jp-process p { margin-bottom: 0; font-size: 15px; }
.jp-cases, .jp-testimonials, .jp-content-section { background: var(--jp-pale); }
.jp-case-link { display: flex; justify-content: space-between; gap: 30px; padding: 34px; border-radius: 16px; background: #fff; color: var(--jp-ink) !important; text-decoration: none; box-shadow: 0 10px 32px rgba(8,61,89,.06); }
.jp-case-link span { color: var(--jp-muted); }.jp-case-link strong { color: var(--jp-blue); }
.jp-security-band { background: linear-gradient(120deg, #e8f3ff, #f4f1ff); }
.jp-security-band .jp-shell { display: grid; grid-template-columns: 1.4fr .6fr; gap: 80px; align-items: center; }
.jp-security-links { display: grid; gap: 14px; }
.jp-security-links a { padding: 20px 24px; border-radius: 12px; background: #fff; color: var(--jp-navy) !important; font-weight: 800; text-decoration: none; }
.jp-cta { background: var(--jp-blue); }
.jp-cta .jp-shell { display: flex; justify-content: space-between; gap: 40px; align-items: center; }
.jp-cta h2, .jp-cta .jp-eyebrow { color: #fff; margin-bottom: 0; }.jp-cta .jp-eyebrow { opacity: .76; margin-bottom: 12px; }
.jp-button-light { background: #fff; color: var(--jp-blue) !important; box-shadow: none; white-space: nowrap; }
.jp-page-hero { padding-top: 160px; padding-bottom: 88px; background: linear-gradient(135deg, #fff, #f2f5ff); }
.jp-page-hero h1 { font-size: clamp(45px, 5vw, 68px); }
.jp-check-list { margin: 0; padding: 0; list-style: none; }
.jp-check-list li { position: relative; padding: 20px 0 20px 42px; border-bottom: 1px solid var(--jp-line); color: var(--jp-ink); font-size: 18px; }
.jp-check-list li:before { content: "✓"; position: absolute; left: 0; color: var(--jp-blue); font-weight: 900; }
.jp-values { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }.jp-values article, .jp-empty-state, .jp-contact-card { padding: 38px; border: 1px solid var(--jp-line); border-radius: 20px; background: #fff; }
.jp-empty-state { text-align: center; padding: 70px 30px; }.jp-empty-state span { display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--jp-pale); color: var(--jp-blue); font-weight: 900; }
.jp-contact-card { display: flex; justify-content: space-between; align-items: center; gap: 30px; }.jp-contact-card h2 { font-size: clamp(26px,4vw,44px); }.jp-contact-card p:last-child { font-size: 14px; }
.jp-case-placeholder .jp-process { margin-top: 32px; }
body .menu-area .navbar ul li a:hover, body .menu-area .navbar ul li.current-menu-item > a { color: var(--jp-blue) !important; }
body .menu-area.sticky { box-shadow: 0 8px 30px rgba(8,61,89,.08); }
@media (prefers-reduced-motion: reduce) { *, *:before, *:after { animation: none !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }
@media (max-width: 980px) { .jp-hero-grid, .jp-heading, .jp-split, .jp-security-band .jp-shell { grid-template-columns: 1fr; gap: 34px; }.jp-card-grid { grid-template-columns: repeat(2,1fr); }.jp-process { grid-template-columns: repeat(2,1fr); }.jp-hero-visual { min-height: 360px; }.jp-section { padding: 82px 24px; }.jp-page-hero { padding-top: 130px; } }
@media (max-width: 640px) { .jp-section { padding: 68px 20px; }.jp-section h1 { font-size: 43px; }.jp-card-grid, .jp-process, .jp-values { grid-template-columns: 1fr; }.jp-hero { min-height: auto; padding-top: 110px; }.jp-hero-visual { min-height: 310px; }.jp-orbit { width: 280px; height: 280px; }.jp-actions, .jp-cta .jp-shell, .jp-contact-card, .jp-case-link { align-items: flex-start; flex-direction: column; }.jp-proof .jp-shell > div { gap: 18px 28px; }.jp-card { min-height: 240px; }.jp-heading, .jp-split { margin-bottom: 40px; } }