/* ======= Kintuadi Kingui – Tema PRO colorido ======= */
:root{
  --kk-grad-from:#10b981;   /* emerald */
  --kk-grad-mid:#14b8a6;    /* teal */
  --kk-grad-to:#06b6d4;     /* cyan */
  --kk-text:#0f172a;        /* slate-900 */
  --kk-muted:#64748b;       /* slate-500 */
  --kk-border:rgba(2,6,23,.08);
  --kk-radius:16px;
  --kk-shadow:0 10px 30px rgba(2,6,23,.06);
  --kk-shadow-lg:0 18px 48px rgba(2,6,23,.12);
}

body{ color:var(--kk-text); background:#f8fafc; }
h1,h2,h3,h4,.display-5{ letter-spacing:-.02em; }
.lead{ color:var(--kk-muted); }

/* NAV */
.navbar{ backdrop-filter:saturate(120%) blur(6px); transition: box-shadow .2s ease; }
body.scrolled header{ box-shadow: 0 8px 24px rgba(2,6,23,.06); }
.navbar .nav-link{ position:relative; color:#334155; font-weight:600; margin:0 .25rem; }
.navbar .nav-link::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to)); border-radius:999px;
}
.navbar .nav-link:hover::after, .navbar .nav-link.active::after{ transform:scaleX(1); }

/* BOTÕES */
.btn-gradient{
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-mid),var(--kk-grad-to));
  border:0; color:#fff; border-radius:999px; padding:.65rem 1.1rem; font-weight:700;
  box-shadow:0 .9rem 1.9rem rgba(20,184,166,.28);
  transition:transform .12s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-gradient:hover{ filter:brightness(.97); transform: translateY(-1px); box-shadow:var(--kk-shadow-lg); }

/* Outline bonito para “Ver Serviços” e filtros */
.btn-ghost{
  border:2px solid transparent; border-radius:999px; padding:.6rem 1rem; font-weight:700;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to)) border-box;
  color:#0f766e;
}
.btn-ghost:hover{
  color:#fff;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:var(--kk-shadow-lg);
}

/* Estado ativo dos filtros (data-filter) */
.btn-group [data-filter].active,
.btn-ghost.active{
  color:#fff !important;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to)) !important;
  border-color:transparent !important;
  box-shadow:var(--kk-shadow-lg);
}

/* HERO com gradiente animado */
@keyframes bg-pan { 0%{background-position:0% 50%} 100%{background-position:100% 50%} }
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(120deg,#ecfdf5, #ffffff, #e0f7fa);
  background-size:200% 200%; animation:bg-pan 12s linear infinite alternate;
}
.hero::after{
  content:""; position:absolute; right:-20%; top:-35%;
  width:900px; height:900px; border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,
    rgba(16,185,129,.22) 0%, rgba(20,184,166,.18) 35%,
    rgba(6,182,212,.14) 60%, rgba(255,255,255,0) 72%);
  filter:blur(20px);
}
.hero .container{ position:relative; z-index:1; }

/* BADGE */
.badge-soft{
  display:inline-flex; align-items:center; gap:.4rem;
  background:#e6fffb; color:#0d9488; border:1px solid #99f6e4;
  border-radius:999px; padding:.45rem .8rem; font-weight:700;
}

/* LISTA COM ✓ */
.list-check{ list-style:none; padding-left:0; margin:0; }
.list-check li{ position:relative; padding-left:1.25rem; color:var(--kk-muted); margin:.5rem 0; }
.list-check li::before{ content:"✓"; position:absolute; left:0; top:.05rem; font-weight:800; color:#0ea5a4; }
/* versão horizontal com list-inline */
.list-check.list-inline .list-inline-item{ position:relative; padding-left:1.25rem; margin-right:1rem; color:var(--kk-muted); }
.list-check.list-inline .list-inline-item::before{ content:"✓"; position:absolute; left:0; top:.05rem; font-weight:800; color:#0ea5a4; }

/* CARDS */
.card-k{
  border:1px solid var(--kk-border); border-radius:var(--kk-radius);
  box-shadow:var(--kk-shadow); background:#fff;
}
.kk-hover-raise{ transition:transform .22s ease, box-shadow .22s ease; }
.kk-hover-raise:hover{ transform:translateY(-6px); box-shadow:var(--kk-shadow-lg); }

/* Borda em gradiente para serviços / depoimentos */
.card-accent{ position:relative; }
.card-accent::after{
  content:""; position:absolute; inset:0; border-radius:var(--kk-radius);
  padding:1px; background:linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}

/* Título de seção com barra em gradiente */
.section-title{ font-weight:800; letter-spacing:-.02em; }
.section-title::after{
  content:""; display:block; width:76px; height:5px; margin-top:.8rem;
  border-radius:999px; background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to));
}

/* TIMELINE (metodologia simples vertical) */
.step{ position:relative; }
.step::before{
  content:""; position:absolute; left:16px; top:0; bottom:-1.25rem; width:2px;
  background:linear-gradient(var(--kk-grad-from), var(--kk-grad-to));
}
.step:last-child::before{ display:none; }
.step .dot{ width:14px; height:14px; border-radius:50%;
  background:linear-gradient(var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:0 0 0 4px #ecfdf5; }

/* SLIDER genérico (se usar noutros locais) */
.snap-x{ display:flex; gap:1rem; overflow:auto; scroll-snap-type:x mandatory; padding-bottom:.5rem; }
.snap-x > *{ scroll-snap-align:start; min-width:320px; }

/* LOGOS */
.kk-logos{ display:flex; gap:2rem; opacity:.85; animation:marquee 28s linear infinite; }
.kk-logos:hover{ animation-play-state:paused; }
.skeleton{ position:relative; overflow:hidden; background:#eef2f7; border:1px solid #e2e8f0; border-radius:12px; }
.skeleton::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  animation:shimmer 1.7s infinite; transform:translateX(-100%);
}
@keyframes shimmer{ 100%{ transform: translateX(100%);} }
@keyframes marquee{ 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* CONTADORES (sobre) */
.stat{ text-align:center; background:#fff; border:1px solid var(--kk-border);
  border-radius:12px; padding:1.25rem 1rem; box-shadow:var(--kk-shadow); }
.stat .num{ font-size:2rem; font-weight:800;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to));
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat .lbl{ color:var(--kk-muted); font-size:.9rem; }

/* Pílulas de valores */
.pill{
  display:inline-block; padding:.4rem .8rem; border-radius:999px;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to)) border-box;
  border:1px solid transparent; font-weight:600; color:#0f766e;
}

/* FOOTER colorido */
footer.footer-accent{
  color:#fff;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to));
}
footer.footer-accent .text-muted{ color:rgba(255,255,255,.85) !important; }
footer.footer-accent a{ color:#fff; text-decoration:none; }
footer.footer-accent a:hover{ text-decoration:underline; }

/* Helpers */
.py-6{ padding-top:3rem; padding-bottom:3rem; }
.section-tint{ background:#f9fdfc; }
.text-gradient{
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.reveal{ opacity:0; transform: translateY(22px); transition:opacity .6s ease, transform .6s ease; }
.reveal.revealed{ opacity:1; transform:none; }

/* =========================
   CTA principal (bonitão)
   ========================= */
.btn-cta{
  --cta-g1:#00d4a6;    /* verde água */
  --cta-g2:#00b3d8;    /* turquesa */
  --cta-shadow: 0 10px 24px rgba(0,179,216,.35);
  --cta-shadow-hover: 0 14px 32px rgba(0,179,216,.45);

  display:inline-flex; align-items:center; justify-content:center;
  gap:.4rem;
  color:#fff; border:0; border-radius:999px; font-weight:800;
  padding:.7rem 1.05rem;
  background: linear-gradient(135deg,var(--cta-g1),var(--cta-g2));
  background-size:200% 200%;
  box-shadow: var(--cta-shadow), inset 0 1px 0 rgba(255,255,255,.18);
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease, background-position .35s ease;
  position:relative; isolation:isolate;
}
.btn-cta::after{
  content:"";
  position:absolute; inset:-2px;
  border-radius:inherit;
  background: radial-gradient(120px 60px at 10% 10%, rgba(255,255,255,.25), transparent 60%),
              radial-gradient(160px 80px at 90% 120%, rgba(255,255,255,.15), transparent 60%);
  filter: blur(6px); opacity:.6; pointer-events:none; z-index:-1;
}
.btn-cta::before{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.35) 25%, transparent 50%);
  transform: translateX(-120%); transition: transform .6s ease;
  mix-blend-mode: screen; pointer-events:none;
}
.btn-cta:hover{
  transform: translateY(-2px);
  box-shadow: var(--cta-shadow-hover), inset 0 1px 0 rgba(255,255,255,.22);
  background-position: 100% 0;
}
.btn-cta:hover .bi{ transform: translateX(2px); }
.btn-cta:hover::before{ transform: translateX(120%); }
.btn-cta:active{ transform: translateY(0); box-shadow: 0 8px 18px rgba(0,179,216,.38); }
.btn-cta:focus{ outline:0; box-shadow: 0 0 0 .25rem rgba(0,179,216,.25), var(--cta-shadow); }
.btn-cta .bi{ transition: transform .18s ease; }
/* acessibilidade: menos animação */
@media (prefers-reduced-motion: reduce){
  .btn-cta, .btn-cta::before{ transition:none !important; }
  .btn-cta:hover{ transform:none; }
}
/* variante clara */
.btn-cta-outline{
  background: #fff; color:#00a6bf; border:1px solid rgba(0,179,216,.35);
  box-shadow: 0 6px 16px rgba(0,179,216,.12);
}
.btn-cta-outline:hover{ background:#f6feff; }

/* ====================================
   Ajustes específicos da secção Serviços
   ==================================== */
.service-card .card-body{ display:flex; flex-direction:column; }
.service-card .btn{ border-radius:999px; min-height:44px; }
.service-card .btn-gradient,
.service-card .btn-cta{ width:100%; }
@media (min-width:576px){
  .service-card .btn-gradient,
  .service-card .btn-cta{ width:auto; flex:1 1 0; }
}
.service-card .mt-auto{ margin-top:auto; }

/* Modal */
.modal-footer .btn{ border-radius:999px; }

/* Pequenos refinamentos */
a, button{ -webkit-tap-highlight-color: transparent; }
:focus-visible{ outline:2px dashed rgba(6,182,212,.6); outline-offset:2px; }

/* ===== Cards mais fortes (borda gradiente + sombra) ===== */
.card-pro{
  position:relative;
  border-radius:var(--kk-radius);
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to)) border-box;
  border:1px solid transparent;
  box-shadow:var(--kk-shadow-lg);
}
.card-pro .card-body{ padding:1rem 1rem; }

/* Badge de ícone em gradiente */
.icon-badge{
  width:40px;height:40px;border-radius:999px;flex:0 0 40px;
  display:inline-flex;align-items:center;justify-content:center;color:#fff;
  background:linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:0 10px 22px rgba(16,185,129,.28);
}

/* ===== Timeline premium vertical ===== */
.timeline{ position:relative; margin-left:.25rem; padding-left:2.25rem; }
.timeline::before{
  content:""; position:absolute; left:1.05rem; top:.25rem; bottom:.25rem; width:2px;
  background:linear-gradient(var(--kk-grad-from),var(--kk-grad-to));
  border-radius:2px;
}
.timeline-item{ position:relative; margin-bottom:1rem; }
.timeline-dot{
  position:absolute; left:.6rem; top:.35rem; width:18px; height:18px; border-radius:50%;
  background:linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:0 0 0 6px #ecfdf5, 0 8px 18px rgba(16,185,129,.25);
}
.timeline-card{
  background:#fff; border:1px solid var(--kk-border); border-radius:12px;
  box-shadow:var(--kk-shadow); padding:.9rem .95rem;
}
.step-no{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:999px; color:#fff; font-weight:800; font-size:.85rem;
  background:linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:0 6px 14px rgba(6,182,212,.28);
  margin-right:.5rem;
}

/* check list mais visível nos cards */
.card-pro .list-check li::before,
.timeline-card .list-check li::before{ color:#12a8b3; }

/* ===== Timeline horizontal compacta (steps-rail) ===== */
.steps-rail{
  position:relative; display:flex; gap:1rem; align-items:flex-start;
  padding: .25rem .25rem 0 .25rem; margin-top:.5rem;
}
.steps-rail::before{
  content:""; position:absolute; top:22px; left:32px; right:32px; height:2px;
  background:linear-gradient(90deg,var(--kk-grad-from),var(--kk-grad-to)); opacity:.35; border-radius:2px;
}
.step-item{ flex:1; min-width:0; position:relative; text-align:center; }
.step-dot{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:999px; color:#fff; font-weight:800;
  background:linear-gradient(135deg,var(--kk-grad-from),var(--kk-grad-to));
  box-shadow:0 10px 22px rgba(16,185,129,.28);
  z-index:1;
}
.step-title{ margin-top:.5rem; font-weight:700; }
@media (max-width: 767.98px){
  .steps-rail{ display:grid; grid-template-columns:1fr; gap:.75rem; }
  .steps-rail::before{ display:none; }
  .step-item{ text-align:left; padding-left:56px; }
  .step-item .step-dot{ position:absolute; left:0; top:0; }
  .step-title{ margin-top:.1rem; }
}

/* bordas divisórias só no desktop para colunas internas */
@media (min-width: 992px){
  .border-lg-start{ border-left:1px dashed var(--kk-border); padding-left:1rem; }
}
@media (min-width: 768px){
  .border-md-start{ border-left:1px dashed var(--kk-border); padding-left:1rem; }
}

/* Sectors rail: ajustes visuais */
.sectors-rail::before{ opacity:.22; }
.sectors-rail .step-dot{ width:44px; height:44px; }
.sectors-rail .step-dot .bi{ font-size:1.1rem; line-height:1; }
@media (min-width: 992px){
  .sectors-rail .step-item + .step-item{ position:relative; }
  .sectors-rail .step-item + .step-item::before{
    content:""; position:absolute; top:50px; bottom:0; left:-.5rem; width:1px;
    background: repeating-linear-gradient(
      to bottom,
      rgba(2,6,23,.08), rgba(2,6,23,.08) 8px,
      transparent 8px, transparent 16px
    );
  }
}

/* =======================================================
   Depoimentos — GRID (2 por linha), cards horizontais
   ======================================================= */
#depoimentos .t-grid{ margin-top:1rem; }
#depoimentos .t-col{ display:flex; }
.t-card-wide{
  display:flex; gap:1rem; align-items:flex-start;
  padding:1.25rem; height:100%; min-height:200px;
}
.t-avatar-64{
  width:56px; height:56px; border-radius:50%;
  background:#f6f7fb; border:1px solid #e2e8f0;
  display:flex; align-items:center; justify-content:center; font-weight:800;
  flex:0 0 56px;
}
.t-head-line{ display:flex; align-items:center; gap:.5rem; }
.t-stars{ color:#f59e0b; }
.t-quote{
  color:#334155; line-height:1.65; margin:.35rem 0 .75rem;
  background:radial-gradient(120% 120% at 0% 0%, #fafafa 0%, #ffffff 42%);
  border:1px solid var(--kk-border); border-radius:12px; padding:.85rem 1rem;
}
.t-actions{ display:flex; gap:.6rem; flex-wrap:wrap; }
.t-actions .btn{ min-height:44px; border-radius:999px; }
.t-actions .btn-cta{ flex:1 1 180px; }
.t-actions .btn-ghost{ flex:1 1 140px; }

/* Card-CTA final (mesmo formato) */
.card-cta-wide{ display:flex; gap:1rem; align-items:center; padding:1.25rem; height:100%; min-height:200px; }
.card-cta-wide .t-cta-content{ flex:1; }
