/* ===========================================================
   Tripeak Global — Core Stylesheet
   =========================================================== */

:root{
  --tg-primary:#4F46E5;
  --tg-primary-dark:#3730A3;
  --tg-secondary:#06B6D4;
  --tg-accent:#F59E0B;
  --tg-dark:#0B0F2B;
  --tg-dark-2:#12183C;
  --tg-light:#F7F8FC;
  --tg-gray:#6B7280;
  --tg-border:#E5E7EB;
  --tg-radius:18px;
  --tg-shadow:0 10px 40px rgba(17,24,88,.08);
  --tg-shadow-lg:0 25px 60px rgba(17,24,88,.16);
  --tg-gradient:linear-gradient(135deg,var(--tg-primary) 0%,var(--tg-secondary) 100%);
  --tg-gradient-2:linear-gradient(135deg,#7C3AED 0%,#4F46E5 50%,#06B6D4 100%);
  font-size:16px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:#232849;
  background:#fff;
  overflow-x:hidden;
  position:relative;
}
h1,h2,h3,h4,h5,h6{ font-family:'Sora',sans-serif; font-weight:700; color:var(--tg-dark); }
p{ color:var(--tg-gray); line-height:1.75; }
a{ text-decoration:none; }
::selection{ background:var(--tg-primary); color:#fff; }

.text-gradient{
  background:var(--tg-gradient-2);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.section{ padding:100px 0; position:relative; }
.section-sm{ padding:60px 0; }
@media (max-width:991px){ .section{ padding:70px 0; } }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--tg-primary); background:rgba(79,70,229,.08);
  padding:7px 16px; border-radius:50px; margin-bottom:18px;
}
.eyebrow i{ font-size:.9em; }

/* ---------- Buttons ---------- */
.btn{ font-weight:600; border-radius:12px; padding:.75rem 1.6rem; transition:.35s cubic-bezier(.4,0,.2,1); }
.btn-gradient{
  background:var(--tg-gradient); color:#fff; border:none;
  box-shadow:0 8px 25px rgba(79,70,229,.35);
}
.btn-gradient:hover{ transform:translateY(-3px); box-shadow:0 14px 35px rgba(79,70,229,.45); color:#fff; }
.btn-outline-light-2{ border:1.5px solid rgba(255,255,255,.5); color:#fff; }
.btn-outline-light-2:hover{ background:#fff; color:var(--tg-dark); border-color:#fff; }
.btn-outline-brand{ border:1.5px solid var(--tg-primary); color:var(--tg-primary); background:transparent; }
.btn-outline-brand:hover{ background:var(--tg-primary); color:#fff; }
.btn-lg{ padding:1rem 2rem; font-size:1.05rem; }

/* ---------- Preloader ---------- */
#preloader{
  position:fixed; inset:0; background:var(--tg-dark); z-index:99999;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .5s ease, visibility .5s ease;
}
#preloader.loaded{ opacity:0; visibility:hidden; }
.loader-ring{ position:relative; width:64px; height:64px; }
.loader-ring span{
  position:absolute; inset:0; border-radius:50%;
  border:3px solid transparent; border-top-color:var(--tg-secondary);
  animation:spin 1.1s linear infinite;
}
.loader-ring span:nth-child(2){ inset:10px; border-top-color:var(--tg-primary); animation-duration:.9s; animation-direction:reverse; }
.loader-ring span:nth-child(3){ inset:20px; border-top-color:var(--tg-accent); animation-duration:.7s; }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Decorative background blobs ---------- */
.bg-blobs{ position:fixed; inset:0; z-index:-2; overflow:hidden; pointer-events:none; }
.blob{ position:absolute; border-radius:50%; filter:blur(90px); opacity:.35; animation:float 14s ease-in-out infinite; }
.blob-1{ width:420px; height:420px; background:var(--tg-primary); top:-120px; left:-100px; }
.blob-2{ width:380px; height:380px; background:var(--tg-secondary); top:40%; right:-140px; animation-delay:-4s; }
.blob-3{ width:320px; height:320px; background:var(--tg-accent); bottom:-120px; left:35%; animation-delay:-8s; opacity:.18; }
@keyframes float{
  0%,100%{ transform:translate(0,0) scale(1); }
  33%{ transform:translate(30px,-40px) scale(1.08); }
  66%{ transform:translate(-25px,25px) scale(.95); }
}

/* ---------- Navbar ---------- */
#mainNav{
  padding:18px 0; transition:.4s ease; background:transparent;
}
#mainNav.scrolled{ padding:10px 0; background:rgba(11,15,43,.85); backdrop-filter:blur(14px); box-shadow:0 6px 30px rgba(0,0,0,.15); }
.brand-mark{
  width:38px; height:38px; border-radius:10px; background:var(--tg-gradient);
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-family:'Sora',sans-serif; font-weight:800; font-size:.95rem;
}
.brand-text{ color:#fff; font-family:'Sora',sans-serif; font-size:1.15rem; }
#mainNav .nav-link{ color:rgba(255,255,255,.85); font-weight:500; padding:.55rem 1rem; }
#mainNav .nav-link:hover, #mainNav .nav-link.active{ color:#fff; }
#mainNav .nav-link.active{ font-weight:700; }
.navbar-toggler{ border:none; box-shadow:none; }
.dropdown-menu{ border:none; border-radius:14px; box-shadow:var(--tg-shadow-lg); padding:10px; margin-top:10px; }
.dropdown-item{ border-radius:8px; padding:.55rem .8rem; font-weight:500; }
.dropdown-item:hover{ background:rgba(79,70,229,.08); color:var(--tg-primary); }

/* ---------- Hero ---------- */
.hero{
  background:radial-gradient(ellipse at top right, #1a2158 0%, var(--tg-dark) 55%);
  padding:170px 0 110px; color:#fff; position:relative; overflow:hidden;
}
.hero .badge-pill{
  display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15); padding:8px 18px; border-radius:50px; font-size:.85rem; margin-bottom:24px;
}
.hero h1{ color:#fff; font-size:clamp(2.2rem,4.5vw,3.6rem); line-height:1.15; }
.hero p.lead{ color:rgba(255,255,255,.75); font-size:1.15rem; max-width:560px; }
.typed-cursor{ color:var(--tg-secondary); }

.hero-stats{ display:flex; gap:38px; margin-top:48px; flex-wrap:wrap; }
.hero-stats .stat-num{ font-family:'Sora',sans-serif; font-size:2rem; font-weight:800; color:#fff; }
.hero-stats .stat-label{ color:rgba(255,255,255,.6); font-size:.85rem; }

.hero-visual{ position:relative; }
.hero-visual img{ border-radius:24px; box-shadow:0 40px 80px rgba(0,0,0,.45); }
.float-card{
  position:absolute; background:#fff; border-radius:16px; padding:14px 18px;
  box-shadow:var(--tg-shadow-lg); display:flex; align-items:center; gap:12px;
  animation:floaty 5s ease-in-out infinite;
}
.float-card .icon-wrap{ width:42px; height:42px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.1rem; }
.float-card-1{ top:8%; left:-8%; animation-delay:0s; }
.float-card-2{ bottom:10%; right:-6%; animation-delay:-2s; }
.float-card-3{ bottom:-6%; left:15%; animation-delay:-3.5s; }
@keyframes floaty{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-16px); } }

/* Logo marquee */
.logo-marquee{ overflow:hidden; position:relative; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.logo-track{ display:flex; gap:64px; width:max-content; animation:scrollLeft 28s linear infinite; align-items:center; }
.logo-track img{ height:34px; opacity:.55; filter:grayscale(1); transition:.3s; }
.logo-track img:hover{ opacity:1; filter:grayscale(0); }
@keyframes scrollLeft{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ---------- Cards ---------- */
.feature-card{
  background:#fff; border:1px solid var(--tg-border); border-radius:var(--tg-radius);
  padding:36px 30px; height:100%; transition:.4s cubic-bezier(.4,0,.2,1); position:relative; overflow:hidden;
}
.feature-card:hover{ transform:translateY(-10px); box-shadow:var(--tg-shadow-lg); border-color:transparent; }
.feature-icon{
  width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:var(--tg-gradient); color:#fff; font-size:1.5rem; margin-bottom:22px;
  transition:.4s;
}
.feature-card:hover .feature-icon{ transform:rotate(-8deg) scale(1.08); }

.industry-card{ border-radius:var(--tg-radius); overflow:hidden; position:relative; box-shadow:var(--tg-shadow); height:100%; }
.industry-card img{ height:260px; object-fit:cover; width:100%; transition:.6s ease; }
.industry-card:hover img{ transform:scale(1.08); }
.industry-card .overlay{ position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(11,15,43,.92) 100%); }
.industry-card .content{ position:absolute; left:0; right:0; bottom:0; padding:28px; color:#fff; }
.industry-card .tag{ font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:var(--tg-secondary); font-weight:700; }

.process-step{ text-align:center; position:relative; padding:0 10px; }
.process-num{
  width:64px; height:64px; border-radius:50%; background:var(--tg-gradient); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:'Sora',sans-serif; font-weight:800; font-size:1.3rem;
  margin:0 auto 22px; box-shadow:0 10px 25px rgba(79,70,229,.35); position:relative; z-index:2;
}
.process-line{ position:absolute; top:32px; left:55%; width:100%; height:2px; background:repeating-linear-gradient(90deg,var(--tg-border) 0 8px,transparent 8px 16px); z-index:1; }

/* ---------- Counters ---------- */
.counter-box{ text-align:center; }
.counter-num{ font-family:'Sora',sans-serif; font-weight:800; font-size:2.6rem; color:var(--tg-dark); }
.counter-num .plus{ color:var(--tg-primary); }
.counter-label{ color:var(--tg-gray); font-weight:500; }

/* ---------- Testimonials ---------- */
.testimonial-card{ background:#fff; border-radius:var(--tg-radius); box-shadow:var(--tg-shadow); padding:38px; height:100%; }
.testimonial-card .stars{ color:var(--tg-accent); margin-bottom:16px; }
.testimonial-card img{ width:52px; height:52px; border-radius:50%; object-fit:cover; }

/* ---------- Pricing ---------- */
.pricing-card{ background:#fff; border:1px solid var(--tg-border); border-radius:var(--tg-radius); padding:40px 32px; height:100%; transition:.4s; position:relative; }
.pricing-card.popular{ border:2px solid var(--tg-primary); transform:scale(1.04); box-shadow:var(--tg-shadow-lg); }
.pricing-card:hover{ transform:translateY(-8px); }
.pricing-card.popular:hover{ transform:scale(1.04) translateY(-8px); }
.pricing-badge{ position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--tg-gradient); color:#fff; padding:6px 20px; border-radius:50px; font-size:.78rem; font-weight:700; }
.price-amount{ font-family:'Sora',sans-serif; font-weight:800; font-size:2.8rem; color:var(--tg-dark); }
.price-amount span{ font-size:1rem; color:var(--tg-gray); font-weight:500; }
.pricing-features li{ padding:9px 0; border-bottom:1px dashed var(--tg-border); color:#4B5165; }
.pricing-features i{ color:var(--tg-secondary); margin-right:10px; }

/* ---------- FAQ / Accordion ---------- */
.accordion-item{ border:none; margin-bottom:14px; border-radius:14px !important; overflow:hidden; box-shadow:0 4px 18px rgba(17,24,88,.05); }
.accordion-button{ font-weight:600; font-family:'Sora',sans-serif; padding:20px 24px; }
.accordion-button:not(.collapsed){ background:rgba(79,70,229,.06); color:var(--tg-primary); box-shadow:none; }
.accordion-button:focus{ box-shadow:none; }
.accordion-body{ padding:6px 24px 24px; }

/* ---------- CTA band ---------- */
.cta-band{ background:var(--tg-gradient-2); border-radius:28px; padding:70px 50px; color:#fff; position:relative; overflow:hidden; }
.cta-band::after{ content:''; position:absolute; inset:0; background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><circle cx="2" cy="2" r="1.4" fill="white" opacity="0.25"/></svg>'); opacity:.5; }

/* ---------- Blog ---------- */
.blog-card{ border-radius:var(--tg-radius); overflow:hidden; background:#fff; box-shadow:var(--tg-shadow); height:100%; transition:.4s; }
.blog-card:hover{ transform:translateY(-8px); box-shadow:var(--tg-shadow-lg); }
.blog-card img{ height:210px; object-fit:cover; width:100%; }
.blog-card .meta{ font-size:.8rem; color:var(--tg-gray); }
.blog-card .cat-badge{ background:rgba(79,70,229,.1); color:var(--tg-primary); font-size:.72rem; font-weight:700; padding:5px 12px; border-radius:50px; text-transform:uppercase; letter-spacing:.05em; }

/* ---------- Team ---------- */
.team-card{ text-align:center; border-radius:var(--tg-radius); overflow:hidden; background:#fff; box-shadow:var(--tg-shadow); transition:.4s; }
.team-card:hover{ transform:translateY(-8px); box-shadow:var(--tg-shadow-lg); }
.team-card img{ width:100%; height:280px; object-fit:cover; }
.team-card .info{ padding:22px; }
.team-card .role{ color:var(--tg-primary); font-size:.85rem; font-weight:600; }
.team-social a{ color:var(--tg-gray); margin:0 6px; transition:.3s; }
.team-social a:hover{ color:var(--tg-primary); }

/* ---------- Inner page hero ---------- */
.page-hero{ background:radial-gradient(ellipse at top left,#1a2158 0%,var(--tg-dark) 60%); padding:150px 0 90px; color:#fff; }
.page-hero h1{ color:#fff; font-size:clamp(2rem,4vw,3rem); }
.breadcrumb-tg a{ color:rgba(255,255,255,.65); }
.breadcrumb-tg a:hover{ color:#fff; }
.breadcrumb-tg .active{ color:#fff; }

/* ---------- Timeline (About) ---------- */
.timeline{ position:relative; padding-left:40px; }
.timeline::before{ content:''; position:absolute; left:10px; top:6px; bottom:6px; width:2px; background:var(--tg-border); }
.timeline-item{ position:relative; padding-bottom:38px; }
.timeline-item::before{ content:''; position:absolute; left:-40px; top:4px; width:22px; height:22px; border-radius:50%; background:var(--tg-gradient); box-shadow:0 0 0 5px rgba(79,70,229,.15); }

/* ---------- Contact ---------- */
.contact-card{ background:#fff; border-radius:var(--tg-radius); box-shadow:var(--tg-shadow); padding:20px 24px; display:flex; gap:16px; align-items:flex-start; height:100%; }
.contact-card .icon-wrap{ width:50px; height:50px; min-width:50px; border-radius:12px; background:var(--tg-gradient); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.form-control, .form-select{ padding:.85rem 1rem; border-radius:12px; border:1px solid var(--tg-border); }
.form-control:focus, .form-select:focus{ border-color:var(--tg-primary); box-shadow:0 0 0 .2rem rgba(79,70,229,.15); }
.form-floating > label{ padding:.85rem 1rem; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--tg-dark); padding-top:80px; }
.text-secondary-light{ color:rgba(255,255,255,.55) !important; }
.footer-heading{ color:#fff; font-family:'Sora',sans-serif; margin-bottom:18px; }
.footer-links{ list-style:none; padding:0; margin:0; }
.footer-links li{ margin-bottom:10px; }
.footer-links a{ color:rgba(255,255,255,.6); transition:.3s; }
.footer-links a:hover{ color:#fff; padding-left:4px; }
.footer-divider{ border-color:rgba(255,255,255,.1); margin:0; }
.social-btn{
  width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08);
  color:#fff; display:inline-flex; align-items:center; justify-content:center; transition:.3s;
}
.social-btn:hover{ background:var(--tg-gradient); transform:translateY(-3px); }
.newsletter-form{ display:flex; gap:8px; }
.newsletter-form .form-control{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.15); color:#fff; }
.newsletter-form .form-control::placeholder{ color:rgba(255,255,255,.4); }

/* ---------- Back to top ---------- */
#backToTop{
  position:fixed; right:26px; bottom:26px; width:48px; height:48px; border-radius:50%;
  background:var(--tg-gradient); color:#fff; border:none; box-shadow:0 10px 25px rgba(79,70,229,.4);
  opacity:0; visibility:hidden; transform:translateY(20px); transition:.35s; z-index:999;
}
#backToTop.show{ opacity:1; visibility:visible; transform:translateY(0); }
#backToTop:hover{ transform:translateY(-4px); }

/* ---------- 404 ---------- */
.error-num{ font-family:'Sora',sans-serif; font-size:clamp(6rem,15vw,10rem); font-weight:800; line-height:1; background:var(--tg-gradient-2); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }

/* ---------- Utilities ---------- */
.shadow-soft{ box-shadow:var(--tg-shadow); }
.rounded-tg{ border-radius:var(--tg-radius); }
.gap-4-lg{ gap:2rem; }
