/* ═══════════════════════════════════════════════════
   Compensación Total – compensacion.css
   Font: Poppins (hereda de styles.css)
════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════
   BREADCRUMB STRIP
══════════════════════════════════════════════════ */
.comp-breadcrumb {
  background: var(--ta-dark);
  padding: .75rem 0;
  border-bottom: 2px solid rgba(255,205,0,.15);
}
.comp-breadcrumb .breadcrumb { margin: 0; }
.comp-breadcrumb .breadcrumb-item a {
  color: rgba(255,255,255,.55);
  text-decoration: none;
  font-size: .8rem;
  font-family: var(--font);
  font-weight: 300;
  transition: color .2s;
}
.comp-breadcrumb .breadcrumb-item a:hover { color: var(--ta-yellow); }
.comp-breadcrumb .breadcrumb-item.active {
  color: var(--ta-yellow);
  font-size: .8rem;
  font-family: var(--font);
  font-weight: 600;
}
.comp-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.3); }

/* ══════════════════════════════════════════════════
   HERO COMPENSACIÓN
══════════════════════════════════════════════════ */
.comp-hero {
  background: var(--ta-grad4);
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-top: 80px;
}
.comp-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 70% 60% at 80% 50%, rgba(229,44,57,.18) 0%, transparent 70%);
}
.comp-hero-particles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }

.comp-hero-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font);
  font-size: .72rem; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ta-yellow);
  background: rgba(255,205,0,.1);
  border: 1px solid rgba(255,205,0,.25);
  padding: .35rem 1rem;
  border-radius: 50px;
  margin-bottom: 1.5rem;
}
.comp-hero-title {
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 900;
  font-family: var(--font);
  color: #fff;
  line-height: 1.1;
}
.comp-hero-title .highlight {
  background: var(--ta-grad3);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.comp-hero-sub {
  font-size: 1.05rem;
  font-weight: 300;
  color: rgba(255,255,255,.72);
  max-width: 520px;
  line-height: 1.75;
  margin-top: 1.25rem;
}

/* Hero image side */
.comp-hero-img-col { position: relative; }
.comp-hero-img-ring {
  position: absolute;
  width: 460px; height: 460px;
  border-radius: 50%;
  border: 2px dashed rgba(255,205,0,.2);
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  animation: ringRotate 20s linear infinite;
}
.comp-hero-img-ring-2 {
  width: 360px; height: 360px;
  border-color: rgba(229,44,57,.15);
  animation-direction: reverse;
  animation-duration: 15s;
}
@keyframes ringRotate { to { transform: translate(-50%,-50%) rotate(360deg); } }

.comp-hero-img-frame {
  width: 340px; height: 400px;
  border-radius: 30px 30px 120px 30px;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 0 4px rgba(255,205,0,.25);
}
.comp-hero-img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
}
.comp-hero-badge-float {
  position: absolute;
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,205,0,.3);
  border-radius: 14px;
  padding: .85rem 1.15rem;
  color: #fff;
  font-family: var(--font);
  font-size: .82rem;
  font-weight: 500;
  z-index: 3;
  display: flex; align-items: center; gap: .6rem;
}
.comp-hero-badge-float i { font-size: 1.3rem; color: var(--ta-yellow); }
.comp-badge-1 { top: 8%; right: -5%; animation: floatCard 4s ease-in-out infinite; }
.comp-badge-2 { bottom: 12%; left: -8%; animation: floatCard 4s ease-in-out infinite 2s; }

@media (max-width: 991.98px) {
  .comp-hero-img-frame { width: 280px; height: 320px; }
  .comp-hero-img-ring  { width: 360px; height: 360px; }
  .comp-badge-1 { right: 0; }
  .comp-badge-2 { left: 0; }
}
@media (max-width: 767.98px) {
  .comp-hero-img-frame { width: 240px; height: 280px; }
  .comp-hero-img-ring, .comp-hero-img-ring-2 { display: none; }
  .comp-hero-badge-float { display: none; }
}

/* ══════════════════════════════════════════════════
   QUÉ ES SECTION
══════════════════════════════════════════════════ */
.comp-que-es { background: #fff; }
.comp-pillar-card {
  border-radius: var(--ta-radius);
  padding: 2rem 1.5rem;
  text-align: center;
  transition: var(--ta-trans);
  border: 2px solid transparent;
  height: 100%;
}
.comp-pillar-card:hover {
  border-color: var(--ta-yellow);
  box-shadow: 0 12px 40px rgba(35,2,45,.1);
  transform: translateY(-6px);
}
.comp-pillar-icon {
  width: 72px; height: 72px;
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 2rem;
  margin: 0 auto 1.25rem;
}
.comp-pillar-icon.grad1 { background: var(--ta-grad3); color: var(--ta-dark); }
.comp-pillar-icon.grad2 { background: var(--ta-grad1); color: #fff; }
.comp-pillar-icon.grad3 { background: var(--ta-grad2); color: #fff; }
.comp-pillar-card h4 { font-size: 1.1rem; font-weight: 700; color: var(--ta-dark); margin-bottom: .6rem; }
.comp-pillar-card p  { font-size: .88rem; font-weight: 300; color: var(--ta-muted); line-height: 1.65; }
.comp-pillar-tags { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-top: 1rem; }
.comp-tag {
  font-size: .7rem; font-family: var(--font); font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  background: rgba(35,2,45,.07); color: var(--ta-dark);
  padding: .2rem .65rem; border-radius: 50px;
}

/* ══════════════════════════════════════════════════
   SERVICIOS (AJAX PAGINATED)
══════════════════════════════════════════════════ */
.comp-servicios { background: var(--ta-gray); }
.comp-servicio-card {
  background: #fff; border-radius: var(--ta-radius);
  overflow: hidden; box-shadow: var(--ta-shadow);
  transition: var(--ta-trans); height: 100%;
  display: flex; flex-direction: column;
}
.comp-servicio-card:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(35,2,45,.16); }
.comp-servicio-header {
  padding: 1.75rem 1.75rem 0;
  display: flex; align-items: flex-start; gap: 1rem;
}
.comp-servicio-num {
  font-family: var(--font);
  font-size: 2.5rem; font-weight: 900;
  color: rgba(255,205,0,.2);
  line-height: 1; flex-shrink: 0;
  transition: var(--ta-trans);
}
.comp-servicio-card:hover .comp-servicio-num { color: rgba(255,205,0,.5); }
.comp-servicio-icon-wrap {
  width: 52px; height: 52px;
  background: var(--ta-grad3); border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; color: var(--ta-dark); flex-shrink: 0;
}
.comp-servicio-body { padding: 1rem 1.75rem 1.75rem; flex: 1; display: flex; flex-direction: column; }
.comp-servicio-title { font-size: 1.15rem; font-weight: 700; color: var(--ta-dark); margin: 0 0 .6rem; }
.comp-servicio-desc  { font-size: .88rem; font-weight: 300; color: var(--ta-muted); line-height: 1.65; flex: 1; }
.comp-servicio-list  { list-style: none; padding: 0; margin: 1rem 0 0; }
.comp-servicio-list li {
  font-size: .83rem; font-weight: 300; color: var(--ta-text);
  padding: .3rem 0; border-bottom: 1px solid #f5f5f5;
  display: flex; align-items: center; gap: .5rem;
}
.comp-servicio-list li:last-child { border: none; }
.comp-servicio-list li i { color: var(--ta-orange); font-size: .9rem; }

/* Paginación dots */
.comp-pag-dots { display: flex; justify-content: center; gap: .5rem; margin-top: 2.5rem; }
.comp-dot {
  width: 32px; height: 8px; border-radius: 4px;
  background: #ddd; border: none; cursor: pointer;
  transition: var(--ta-trans); padding: 0;
}
.comp-dot.active { background: var(--ta-grad3); width: 56px; }

/* Skeleton loader */
.comp-faq-skeleton {
  height: 58px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%);
  background-size: 200%;
  border-radius: var(--ta-radius);
  margin-bottom: .75rem;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* ══════════════════════════════════════════════════
   METODOLOGÍA
══════════════════════════════════════════════════ */
.comp-metodologia { background: var(--ta-dark2); position: relative; overflow: hidden; }
.comp-metodologia::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px; background: var(--ta-grad2);
}
.comp-step { display: flex; gap: 1.5rem; margin-bottom: 2.5rem; position: relative; }
.comp-step:last-child { margin-bottom: 0; }
.comp-step::before {
  content: '';
  position: absolute; left: 26px; top: 54px;
  width: 2px; height: calc(100% + 2.5rem - 54px);
  background: linear-gradient(to bottom, rgba(255,205,0,.3), transparent);
}
.comp-step:last-child::before { display: none; }
.comp-step-num {
  width: 54px; height: 54px; flex-shrink: 0; border-radius: 50%;
  background: var(--ta-grad3);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font); font-size: 1.1rem; font-weight: 900;
  color: var(--ta-dark); position: relative; z-index: 1;
  box-shadow: 0 0 0 4px rgba(255,205,0,.15);
}
.comp-step-content { padding-top: .5rem; }
.comp-step-content h5 { color: #fff; font-size: 1rem; font-weight: 700; margin-bottom: .4rem; }
.comp-step-content p  { color: rgba(255,255,255,.55); font-size: .88rem; font-weight: 300; line-height: 1.65; margin: 0; }

.comp-met-visual {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,205,0,.12);
  border-radius: 20px; padding: 2rem; height: 100%;
  display: flex; flex-direction: column; justify-content: center;
}
.comp-met-chart-label {
  font-family: var(--font); font-size: .75rem; font-weight: 700;
  color: rgba(255,255,255,.5); letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1.5rem;
}
.comp-met-bars { display: flex; flex-direction: column; gap: .85rem; }
.comp-met-bar-row { display: flex; align-items: center; gap: 1rem; }
.comp-met-bar-label { color: rgba(255,255,255,.7); font-size: .82rem; font-weight: 300; width: 120px; flex-shrink: 0; }
.comp-met-bar-track { flex: 1; height: 10px; background: rgba(255,255,255,.08); border-radius: 5px; overflow: hidden; }
.comp-met-bar-fill {
  height: 100%; border-radius: 5px; background: var(--ta-grad3);
  width: 0; transition: width 1.2s cubic-bezier(.4,0,.2,1);
}
.comp-met-bar-pct { color: var(--ta-yellow); font-family: var(--font); font-size: .82rem; font-weight: 700; width: 38px; text-align: right; flex-shrink: 0; }

/* ══════════════════════════════════════════════════
   BENEFICIOS / STATS
══════════════════════════════════════════════════ */
.comp-beneficios { background: #fff; }
.comp-stat-card {
  text-align: center; padding: 2.5rem 1.5rem;
  border-radius: var(--ta-radius);
  background: var(--ta-grad4); color: #fff; height: 100%;
  transition: var(--ta-trans); position: relative; overflow: hidden;
}
.comp-stat-card::after {
  content: ''; position: absolute; bottom: -20px; right: -20px;
  width: 80px; height: 80px; border-radius: 50%;
  background: rgba(255,205,0,.06);
}
.comp-stat-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(35,2,45,.3); }
.comp-stat-icon { font-size: 2.2rem; margin-bottom: 1rem; }
.comp-stat-num  { font-family: var(--font); font-size: 2.6rem; font-weight: 900; color: var(--ta-yellow); line-height: 1; }
.comp-stat-lbl  { font-size: .88rem; font-weight: 300; color: rgba(255,255,255,.65); margin-top: .4rem; }

.comp-benefit-item { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.4rem; }
.comp-benefit-icon {
  width: 44px; height: 44px; flex-shrink: 0;
  background: var(--ta-grad3); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; color: var(--ta-dark);
}
.comp-benefit-item h6 { font-size: .95rem; font-weight: 600; color: var(--ta-dark); margin: 0 0 .2rem; }
.comp-benefit-item p  { font-size: .85rem; font-weight: 300; color: var(--ta-muted); margin: 0; }

/* ══════════════════════════════════════════════════
   FAQ
══════════════════════════════════════════════════ */
.comp-faq { background: var(--ta-gray); }
.comp-accordion .accordion-button {
  font-family: var(--font); font-size: .95rem; font-weight: 700;
  color: var(--ta-dark); background: #fff; box-shadow: none;
  padding: 1.25rem 1.5rem;
}
.comp-accordion .accordion-button:not(.collapsed) {
  color: var(--ta-dark); background: var(--ta-yellow);
}
.comp-accordion .accordion-button::after { filter: none; }
.comp-accordion .accordion-button:not(.collapsed)::after { filter: invert(1); }
.comp-accordion .accordion-body {
  font-size: .9rem; font-weight: 300; color: var(--ta-muted); line-height: 1.7;
  padding: 1.25rem 1.5rem; border-top: 2px solid var(--ta-yellow);
}
.comp-accordion .accordion-item {
  border-radius: var(--ta-radius) !important; overflow: hidden;
  margin-bottom: .75rem; border: 1px solid #e8e8f0;
  box-shadow: 0 2px 12px rgba(35,2,45,.05);
}

/* ══════════════════════════════════════════════════
   TESTIMONIOS COMPENSACIÓN
══════════════════════════════════════════════════ */
.comp-testimonios { background: #fff; }

/* ══════════════════════════════════════════════════
   CTA COMPENSACIÓN
══════════════════════════════════════════════════ */
.comp-cta { background: var(--ta-grad2); position: relative; overflow: hidden; }
.comp-cta::before {
  content: '';
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 700px; height: 350px;
  background: radial-gradient(ellipse, rgba(255,255,255,.06) 0%, transparent 70%);
}
.comp-cta-icon { font-size: 3.5rem; color: var(--ta-yellow); }
.comp-cta h2 { font-size: clamp(1.8rem,3.5vw,2.6rem); color: #fff; font-weight: 900; }
.comp-cta p  { color: rgba(255,255,255,.72); font-size: 1.05rem; font-weight: 300; }

/* ══════════════════════════════════════════════════
   CONTACT FORM
══════════════════════════════════════════════════ */
.comp-contacto { background: var(--ta-gray); }
.comp-form-card {
  background: #fff; border-radius: 20px; padding: 2.5rem;
  box-shadow: 0 12px 50px rgba(35,2,45,.1);
}
@media (max-width:767.98px) { .comp-form-card { padding: 1.5rem; } }

/* ══════════════════════════════════════════════════
   LIVE TICKER STRIP
══════════════════════════════════════════════════ */
.comp-live-strip {
  background: var(--ta-dark);
  padding: .6rem 0;
  border-top: 2px solid rgba(255,205,0,.2);
}
.comp-live-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 2rem; flex-wrap: wrap;
}
.comp-live-item {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--font); font-size: .78rem; font-weight: 500;
  color: rgba(255,255,255,.7);
}
.comp-live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ta-yellow);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(255,205,0,.5); }
  50%      { box-shadow: 0 0 0 6px rgba(255,205,0,0); }
}
.comp-live-val { color: var(--ta-yellow); font-weight: 700; }

/* ══════════════════════════════════════════════════
   COMP2 — NUEVO DISEÑO COMPENSACIÓN TOTAL
══════════════════════════════════════════════════ */

/* ── Hero ──────────────────────────────────────── */
.comp2-hero {
  position: relative;
  min-height: 100vh;
  background: url('../images/Banner compensacion total .png') center/cover no-repeat;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.comp2-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top,
    rgba(43,3,63,.97) 0%,
    rgba(43,3,63,.72) 45%,
    rgba(43,3,63,.2) 100%);
}
.comp2-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font); font-size: .75rem; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ta-yellow);
  background: rgba(255,205,0,.12);
  border: 1px solid rgba(255,205,0,.3);
  padding: .4rem 1.1rem; border-radius: 50px;
  margin-bottom: 1.25rem;
  width: fit-content;
}
.comp2-hero-title {
  font-size: clamp(2.8rem, 6vw, 4.5rem);
  font-weight: 900; font-family: var(--font);
  color: #fff; line-height: 1.05; margin-bottom: 1rem;
}
.comp2-hero-sub {
  font-size: 1.08rem; font-weight: 300;
  color: rgba(255,255,255,.78); max-width: 580px; line-height: 1.78;
}

/* ── Soluciones cards ──────────────────────────── */
.comp2-soluciones { background: #fff; }
.comp2-sol-card {
  background: #fff; border-radius: 20px;
  box-shadow: 0 8px 40px rgba(35,2,45,.1);
  overflow: hidden; height: 100%;
  transition: var(--ta-trans);
  border: 2px solid transparent;
  display: flex; flex-direction: column;
}
.comp2-sol-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(35,2,45,.16);
  border-color: var(--ta-yellow);
}
.comp2-sol-img-wrap {
  background: linear-gradient(90deg, #ffcd00, #f48818);
  height: 120px;
  display: flex; align-items: center; justify-content: center;
}
.comp2-sol-icon { font-size: 3rem; color: var(--ta-dark); }
.comp2-sol-body { padding: 2rem 1.75rem; flex: 1; display: flex; flex-direction: column; }
.comp2-sol-title { font-size: 1.15rem; font-weight: 700; color: var(--ta-dark); margin-bottom: .7rem; }
.comp2-sol-desc  { font-size: .9rem; font-weight: 300; color: var(--ta-muted); line-height: 1.72; margin-bottom: 1.25rem; flex: 1; }
.comp2-sol-list  { list-style: none; padding: 0; margin: 0; }
.comp2-sol-list li {
  display: flex; align-items: center; gap: .5rem;
  font-size: .85rem; font-weight: 400; color: var(--ta-text);
  padding: .4rem 0; border-bottom: 1px solid #f5f5f5;
}
.comp2-sol-list li:last-child { border: none; }
.comp2-sol-list li i { color: var(--ta-orange); font-size: 1rem; }

/* ── Modelo Estrella ───────────────────────────── */
.comp2-modelo { background: var(--ta-gray); }
.comp2-modelo-card {
  border-radius: 24px; overflow: hidden;
  box-shadow: 0 20px 80px rgba(35,2,45,.22);
}
.comp2-modelo-left {
  background: var(--ta-dark2);
  padding: 3.5rem;
  display: flex; flex-direction: column; justify-content: center;
}
.comp2-recom-badge {
  display: inline-flex; align-items: center;
  font-family: var(--font); font-size: .7rem; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--ta-dark);
  background: var(--ta-yellow);
  padding: .35rem 1rem; border-radius: 50px;
  margin-bottom: 1.5rem; width: fit-content;
}
.comp2-modelo-title {
  font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 900; font-family: var(--font);
  color: #fff; line-height: 1.12; margin-bottom: 1rem;
}
.comp2-modelo-sub {
  font-size: .95rem; font-weight: 300;
  color: rgba(255,255,255,.6); line-height: 1.75; margin-bottom: 2rem;
}
.comp2-modelo-list {
  list-style: none; padding: 0; margin: 0 0 2.5rem;
  display: flex; flex-direction: column; gap: 1.4rem;
}
.comp2-modelo-list li {
  display: flex; align-items: flex-start; gap: 1rem;
}
.comp2-modelo-icon {
  width: 50px; height: 50px; flex-shrink: 0;
  background: linear-gradient(135deg, #ffcd00, #f48818);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; color: var(--ta-dark);
  box-shadow: 0 4px 16px rgba(255,205,0,.3);
}
.comp2-modelo-list li strong {
  display: block; font-size: .95rem; font-weight: 700;
  color: #fff; margin-bottom: .25rem;
  font-family: var(--font);
}
.comp2-modelo-list li span {
  font-size: .82rem; font-weight: 300; color: rgba(255,255,255,.55);
}
.comp2-modelo-btn {
  display: inline-flex; align-items: center;
  background: linear-gradient(90deg, #ffcd00, #f48818);
  color: var(--ta-dark); font-family: var(--font);
  font-weight: 700; font-size: .92rem;
  padding: .9rem 2rem; border-radius: 50px;
  text-decoration: none; width: fit-content;
  transition: var(--ta-trans);
  box-shadow: 0 4px 20px rgba(255,205,0,.35);
}
.comp2-modelo-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(255,205,0,.5);
  color: var(--ta-dark);
}
.comp2-modelo-right {
  position: relative; overflow: hidden; min-height: 420px;
}
.comp2-modelo-img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}

/* ── STARAPP CT carousel ───────────────────────── */
.comp2-starapp-ct { background: var(--ta-dark2); }
.comp2-ct-carousel {
  position: relative; overflow: hidden;
  border-radius: 18px;
  background: transparent;
}
.comp2-ct-track {
  display: flex;
  transition: transform .52s cubic-bezier(.4,0,.2,1);
}
.comp2-ct-slide { min-width: 100%; }
.comp2-ct-slide img { width: 100%; display: block; border-radius: 18px; }
.comp2-ct-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,205,0,.9); border: none; cursor: pointer;
  color: var(--ta-dark); font-size: 1.1rem;
  display: flex; align-items: center; justify-content: center;
  transition: var(--ta-trans); z-index: 5;
}
.comp2-ct-nav:hover { background: var(--ta-yellow); transform: translateY(-50%) scale(1.1); }
.comp2-ct-prev { left: 12px; }
.comp2-ct-next { right: 12px; }
.comp2-ct-dots {
  display: flex; justify-content: center; gap: .5rem; margin-top: 1.25rem;
}
.comp2-ct-dot {
  width: 32px; height: 7px; border-radius: 4px;
  background: rgba(255,255,255,.2); border: none; cursor: pointer;
  transition: var(--ta-trans); padding: 0;
}
.comp2-ct-dot.active { background: var(--ta-yellow); width: 56px; }
.comp2-ct-text-num {
  font-family: var(--font); font-size: 3.8rem; font-weight: 900;
  color: rgba(255,205,0,.15); line-height: 1; margin-bottom: .4rem;
}
.comp2-ct-text-title {
  font-size: 1.45rem; font-weight: 700; font-family: var(--font);
  color: #fff; margin-bottom: 1rem;
}
.comp2-ct-text-desc {
  font-size: .95rem; font-weight: 300;
  color: rgba(255,255,255,.65); line-height: 1.82;
}

/* ── CTA Final ─────────────────────────────────── */
.comp2-cta-final { background: var(--ta-dark); }
.comp2-cta-bg {
  background: linear-gradient(90deg,
    rgba(255,205,0,1) 0%,
    rgba(255,205,0,.95) 40%,
    rgba(244,136,24,.9) 70%,
    rgba(229,44,57,.75) 100%);
  padding: 6rem 0;
}
.comp2-cta-logo {
  height: 54px; display: block;
  margin: 0 auto 2rem; filter: brightness(0);
}
.comp2-cta-title {
  font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 900; font-family: var(--font);
  color: var(--ta-dark); margin-bottom: 1rem; line-height: 1.2;
}
.comp2-cta-sub {
  font-size: 1rem; font-weight: 300;
  color: rgba(43,3,63,.72); line-height: 1.78;
  max-width: 600px; margin: 0 auto;
}
.comp2-cta-btn-dark {
  display: inline-flex; align-items: center;
  background: var(--ta-dark2); color: #fff;
  font-family: var(--font); font-weight: 700; font-size: .95rem;
  border-radius: 50px; text-decoration: none;
  transition: var(--ta-trans);
  box-shadow: 0 6px 24px rgba(43,3,63,.3);
}
.comp2-cta-btn-dark:hover {
  background: var(--ta-dark); color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(43,3,63,.45);
}
.comp2-cta-contact-row {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem;
  margin-top: 1.75rem;
}
.comp2-cta-contact-item {
  display: flex; align-items: center; gap: .5rem;
  font-size: .9rem; font-weight: 500; font-family: var(--font);
  color: rgba(43,3,63,.8); text-decoration: none;
  transition: color .2s;
}
.comp2-cta-contact-item i { color: var(--ta-dark2); font-size: 1rem; }
.comp2-cta-contact-item:hover { color: var(--ta-dark2); }

/* ── Minicard hover-dropdown ────────────────────── */
.minicard-wrapper {
  position: relative;
  z-index: 1;
}
.minicard-wrapper:hover { z-index: 10; }
.minicard-card {
  background: linear-gradient(135deg, #ffcd00 0%, #f48818 100%);
  border-radius: 20px;
  padding: 2.2rem 2rem 2rem;
  box-shadow: 0 10px 36px rgba(255,205,0,.22);
  transition: box-shadow .3s, transform .3s;
  display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: .9rem;
}
.minicard-wrapper:hover .minicard-card {
  box-shadow: 0 16px 48px rgba(255,205,0,.38);
  transform: translateY(-4px);
  border-radius: 20px 20px 0 0;
}
.minicard-icon {
  width: 80px; height: 80px;
  background: rgba(43,3,63,.13);
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 2.2rem; color: var(--ta-dark);
  transition: transform .3s;
}
.minicard-wrapper:hover .minicard-icon { transform: scale(1.08); }
.minicard-title {
  font-family: var(--font); font-size: 1.05rem; font-weight: 700;
  color: var(--ta-dark); line-height: 1.3; margin: 0;
}
.minicard-desc {
  font-size: .88rem; font-weight: 400;
  color: rgba(43,3,63,.72); line-height: 1.7; margin: 0;
}
.minicard-dropdown {
  position: absolute;
  top: 100%; left: 0; right: 0;
  background: var(--ta-dark2);
  border-radius: 0 0 20px 20px;
  box-shadow: 0 20px 48px rgba(35,2,45,.22);
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s cubic-bezier(.4,0,.2,1),
              opacity .3s ease;
  opacity: 0;
}
.minicard-wrapper:hover .minicard-dropdown {
  max-height: 260px;
  opacity: 1;
}
.minicard-dropdown ul {
  list-style: none; padding: 1.1rem 1.5rem 1.25rem; margin: 0;
  display: flex; flex-direction: column; gap: .1rem;
}
.minicard-dropdown ul li {
  display: flex; align-items: center; gap: .55rem;
  font-size: .87rem; font-weight: 400; color: rgba(255,255,255,.82);
  padding: .45rem 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.minicard-dropdown ul li:last-child { border: none; }
.minicard-dropdown ul li i { color: var(--ta-yellow); font-size: .95rem; flex-shrink: 0; }

/* ── Responsive ────────────────────────────────── */
@media (max-width: 991.98px) {
  .comp2-modelo-left  { padding: 2.5rem; }
  .comp2-modelo-right { min-height: 300px; }
}
@media (max-width: 767.98px) {
  .comp2-hero-title   { font-size: 2.3rem; }
  .comp2-modelo-right { min-height: 240px; }
  .comp2-cta-bg       { padding: 4rem 0; }
  .comp2-cta-contact-row { flex-direction: column; align-items: center; gap: 1rem; }
  .minicard-wrapper   { height: 360px; }
}