/* ============================================================
   Detekta - Rediseño moderno
   Paleta de marca: naranja #F06222 + azul #D97706
   Carga al final del <head> para sobreescribir el tema legacy.
   ============================================================ */

:root {
  --brand: #F06222;
  --brand-600: #D9581A;
  --brand-700: #B74715;
  --brand-100: #FDE7DB;
  --brand-050: #FFF3EC;
  --amber: #D97706;
  --amber-dark: #B45309;
  --amber-100: #FEF3C7;
  --navy: #0F172A;
  --slate-800: #1E293B;
  --slate-700: #334155;
  --slate-600: #475569;
  --slate-500: #64748B;
  --slate-300: #CBD5E1;
  --slate-200: #E2E8F0;
  --slate-100: #F1F5F9;
  --slate-50: #F8FAFC;
  --white: #FFFFFF;
  --grad-brand: linear-gradient(135deg, #F06222 0%, #FF8A50 100%);
  --grad-amber: linear-gradient(135deg, #D97706 0%, #F59E0B 100%);
  --grad-dark: linear-gradient(160deg, #0F172A 0%, #1E293B 100%);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, .08);
  --shadow-md: 0 8px 24px rgba(15, 23, 42, .10);
  --shadow-lg: 0 20px 48px rgba(15, 23, 42, .16);
  --shadow-brand: 0 10px 28px rgba(240, 98, 34, .30);
  --radius: 16px;
  --radius-sm: 10px;
  --transition: all .3s cubic-bezier(.4, 0, .2, 1);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Roboto', 'Segoe UI', Arial, sans-serif;
  color: var(--slate-700);
  background: var(--white);
  line-height: 1.7;
  letter-spacing: .2px;
  padding-top: 114px;
}

/* Fix: el tema legacy deja las secciones con float:left y se superponen */
section {
  float: none !important;
  display: block !important;
  clear: both;
  overflow: hidden;
}

h1, h2, h3, h4, h5, h6,
.section-heading h2,
.navbar-brand,
.slider-text h2,
.blog-breadcrumbs-left h2 {
  font-family: 'Poppins', 'Roboto', sans-serif;
  color: var(--slate-800);
  font-weight: 600;
  letter-spacing: -.3px;
}

a { color: var(--amber); transition: var(--transition); }
a:hover, a:focus { color: var(--brand); }

/* ---------- PRELOADER ---------- */
#preloader { background: linear-gradient(160deg, #0F172A, #1E293B); }
#status {
  background-image: none !important;
}
#status::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 56px; height: 56px;
  margin: -28px 0 0 -28px;
  border-radius: 50%;
  border: 4px solid rgba(255, 255, 255, .15);
  border-top-color: var(--brand);
  animation: d-spin .8s linear infinite;
}
@keyframes d-spin { to { transform: rotate(360deg); } }

/* ---------- NAVBAR ---------- */
#header {
  float: none;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
}

/* Barra superior de contacto */
.topbar {
  background: linear-gradient(90deg, #0B1420, #0F172A 60%, #1E293B);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  font-size: 13px;
  position: relative;
  z-index: 2;
}
.topbar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  flex-wrap: wrap;
}
.topbar a {
  color: rgba(255, 255, 255, .8);
  display: inline-block;
  margin-right: 20px;
  padding: 6px 0;
}
.topbar a i {
  color: var(--brand);
  margin-right: 6px;
}
.topbar a:hover { color: #fff; }
.topbar-right a i { color: #25D366; }

.menu_area {
  float: none;
  display: block;
  width: 100%;
}

.navbar-default {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: none;
  border-bottom: 1px solid rgba(226, 232, 240, .7);
  box-shadow: var(--shadow-sm);
  padding: 6px 0;
  transition: var(--transition);
}
.navbar-default.past-main,
#header.past-main .navbar-default {
  padding: 0;
  box-shadow: var(--shadow-md);
  border-bottom-color: transparent;
}
#header.past-main .topbar { display: none; }

.navbar-brand {
  display: flex;
  align-items: center;
  height: 62px;
  padding: 8px 15px;
  width: auto;
}
.navbar-brand img {
  width: auto;
  height: 52px;
  max-width: 220px;
  object-fit: contain;
  transition: var(--transition);
}
.navbar-default.past-main .navbar-brand img { height: 46px; }

.navbar-default .navbar-nav > li > a {
  color: var(--slate-700);
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  text-transform: none;
  letter-spacing: .2px;
  text-shadow: none;
  padding: 20px 14px;
  position: relative;
}
.navbar-default .navbar-nav > li > a::before {
  content: "";
  position: absolute;
  left: 14px; right: 14px; bottom: 12px;
  height: 3px;
  border-radius: 2px;
  background: var(--grad-brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  text-shadow: none;
  color: transparent;
}
.navbar-default .navbar-nav > li > a:hover::before,
.navbar-default .navbar-nav > li > a:focus::before,
.navbar-default .navbar-nav > .active > a::before {
  transform: scaleX(1);
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus { color: var(--brand); }
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover { color: var(--brand); background: transparent; }

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover { color: var(--brand); background: transparent; }

/* Dropdown */
.navbar-default .navbar-nav > li > .dropdown-menu {
  top: 100%;
  margin-top: 4px;
  border: 1px solid var(--slate-100);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  background: var(--white);
  padding: 8px;
}
.dropdown-menu > li > a {
  color: var(--slate-600) !important;
  font-weight: 500;
  padding: 9px 16px;
  border-radius: 8px;
  white-space: normal;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: var(--brand) !important;
  background: var(--brand-050);
  transform: translateX(3px);
}
.dropdown-menu > li > a i { margin-right: 6px; color: var(--amber); }

/* Toggle móvil */
.navbar-default .navbar-toggle {
  border: none;
  background: var(--brand);
  border-radius: 8px;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background: var(--brand-600); }
.navbar-default .navbar-toggle .icon-bar { background: #fff; }

/* Botón WhatsApp en navbar */
.navbar-whatsapp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 13px 0 13px 14px;
  padding: 9px 18px;
  border-radius: 999px;
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: #fff !important;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  box-shadow: 0 8px 20px rgba(37, 211, 102, .35);
  transition: var(--transition);
}
.navbar-whatsapp:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(37, 211, 102, .45); }

/* ---------- HERO SLIDER ---------- */
#sliderArea {
  margin-top: 0;
  position: relative;
}
.top-slider { position: relative; }
.top-slide-inner {
  position: relative;
  height: 82vh;
  min-height: 540px;
  width: 100%;
  overflow: hidden;
  perspective: 1000px;
}
.slider-img {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.slider-img > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: d-kenburns 8s ease-in-out forwards;
}
.top-slide-inner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 75% 30%, rgba(217, 119, 6, .45), transparent 42%),
    linear-gradient(90deg, rgba(15, 23, 42, .92) 0%, rgba(15, 23, 42, .62) 45%, rgba(15, 23, 42, .28) 100%);
}
@keyframes d-kenburns {
  0% { transform: scale(1); }
  100% { transform: scale(1.14); }
}

/* Iconos flotantes 3D */
.slider-media {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.float-icon {
  position: absolute;
  color: rgba(255, 255, 255, .5);
  font-size: var(--s, 40px);
  text-shadow: 0 18px 40px rgba(0, 0, 0, .5);
  animation: d-icon-float 7s ease-in-out infinite;
}
@keyframes d-icon-float {
  0%   { opacity: 0; transform: translateY(10px) scale(.5); }
  12%  { opacity: .5; transform: translateY(-4px) scale(1); }
  50%  { opacity: .55; transform: translateY(-20px) scale(1.06); }
  88%  { opacity: .5; transform: translateY(-4px) scale(1); }
  100% { opacity: 0; transform: translateY(10px) scale(.5); }
}

.slider-text {
  position: absolute;
  left: 0;
  right: auto;
  top: 50%;
  z-index: 3;
  transform: translateY(-50%);
  margin: 0;
  padding: 0 8%;
  color: #fff;
  width: auto;
  max-width: 720px;
}
.slider-kicker {
  display: inline-block;
  margin-bottom: 18px;
  padding: 7px 18px;
  border-radius: 999px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #fff;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .3);
  backdrop-filter: blur(6px);
}
.slider-text h2 {
  color: #fff;
  font-size: 54px;
  line-height: 1.12;
  font-weight: 700;
  text-transform: none;
  margin-bottom: 18px;
}
.slider-text h2 > strong {
  background: linear-gradient(90deg, #FF9A62, #F06222 60%, #D97706);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.slider-text p { color: rgba(255, 255, 255, .88); font-size: 18px; line-height: 1.7; }
.slider-text p > strong { color: var(--brand); }
.slick-active .slider-text .slider-kicker { animation: d-fadeUp .7s .1s cubic-bezier(.4, 0, .2, 1) both; }
.slick-active .slider-text h2 { animation: d-fadeUp .7s .25s cubic-bezier(.4, 0, .2, 1) both; }
.slick-active .slider-text p { animation: d-fadeUp .7s .4s cubic-bezier(.4, 0, .2, 1) both; }
.slick-active .slider-text .slider-cta { animation: d-fadeUp .7s .55s cubic-bezier(.4, 0, .2, 1) both; }
@keyframes d-fadeUp {
  from { opacity: 0; transform: translateY(34px); }
  to { opacity: 1; transform: translateY(0); }
}

.slider-cta { margin-top: 28px; }
.slider-cta .btn-slider {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 999px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: var(--transition);
}
.btn-slider.btn-solid {
  background: var(--grad-brand);
  color: #fff;
  box-shadow: var(--shadow-brand);
}
.btn-slider.btn-solid::after {
  content: "";
  position: absolute;
  top: 0; left: -75%;
  width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: skewX(-20deg);
  transition: left .6s ease;
}
.btn-slider.btn-solid:hover::after { left: 125%; }
.btn-slider.btn-solid:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 16px 34px rgba(240, 98, 34, .5); }
.btn-slider.btn-ghost {
  border: 2px solid rgba(255, 255, 255, .7);
  color: #fff;
  margin-left: 12px;
  backdrop-filter: blur(4px);
}
.btn-slider.btn-ghost:hover { background: rgba(255, 255, 255, .18); border-color: #fff; transform: translateY(-3px); }

/* Arrows */
.top-slider .slick-prev,
.top-slider .slick-next {
  border: 1px solid rgba(255, 255, 255, .25);
  background: rgba(255, 255, 255, .1);
  backdrop-filter: blur(6px);
  width: 54px; height: 54px;
  top: 50%;
  margin-top: 0;
  transform: translateY(-50%);
  z-index: 5;
  transition: var(--transition);
}
.top-slider .slick-prev::before,
.top-slider .slick-next::before {
  content: "";
  font-family: 'FontAwesome';
  font-size: 22px;
  line-height: 1;
  color: #fff;
  opacity: 1;
}
.top-slider .slick-prev::before { content: "\f053"; }
.top-slider .slick-next::before { content: "\f054"; }
.top-slider .slick-prev:hover,
.top-slider .slick-next:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  transform: translateY(-50%) scale(1.08);
}
.top-slider .slick-prev { left: 24px; }
.top-slider .slick-next { right: 24px; }

/* Dots */
.top-slider .slick-dots { bottom: 26px; z-index: 5; }
.top-slider .slick-dots li button { width: 34px; height: 6px; padding: 0; border-radius: 3px; background: rgba(255, 255, 255, .35); }
.top-slider .slick-dots li button::before { display: none; }
.top-slider .slick-dots li.slick-active button { background: var(--brand); }

/* Barra de progreso autoplay */
.hero-progress {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 5px;
  z-index: 6;
  background: rgba(255, 255, 255, .12);
}
.hero-progress span {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), #FF9A62);
}
.hero-progress span.is-playing { animation: d-progress 20s linear forwards; }
@keyframes d-progress {
  from { width: 0; }
  to { width: 100%; }
}

/* Contador de slide + control de autoplay */
.hero-counter {
  position: absolute;
  left: 24px;
  bottom: 72px;
  z-index: 7;
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 8px 15px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .45);
  border: 1px solid rgba(255, 255, 255, .18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: #fff;
  font-family: 'Poppins', sans-serif;
  line-height: 1;
}
.hero-counter-current {
  display: inline-block;
  min-width: 26px;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  transition: transform .28s ease, opacity .28s ease;
}
.hero-counter-current.is-flip { transform: translateY(-90%); opacity: 0; }
.hero-counter-total { font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, .65); }

.hero-autoplay {
  position: absolute;
  left: 24px;
  bottom: 20px;
  z-index: 7;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .25);
  background: rgba(15, 23, 42, .45);
  color: #fff;
  font-size: 15px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: var(--transition);
}
.hero-autoplay:hover { background: var(--brand); border-color: var(--brand); transform: translateY(-2px); }
.hero-autoplay.is-paused { background: var(--grad-brand); border-color: transparent; }

/* Destello al cambiar de slide */
.top-slider { overflow: hidden; }
.top-slider::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -30%;
  width: 30%;
  z-index: 4;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .16), transparent);
  transform: skewX(-14deg);
  opacity: 0;
  pointer-events: none;
}
.top-slider.is-changing::after { animation: d-slide-shine 1s ease; }
@keyframes d-slide-shine {
  0% { left: -30%; opacity: 0; }
  15% { opacity: .9; }
  100% { left: 120%; opacity: 0; }
}

/* Parallax del slide activo */
.top-slide-inner .slider-text { will-change: transform; }

@media (max-width: 767px) {
  .hero-counter { left: 14px; bottom: 64px; padding: 7px 12px; }
  .hero-counter-current { font-size: 17px; }
  .hero-autoplay { left: 14px; bottom: 16px; width: 42px; height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  .top-slider.is-changing::after { animation: none; }
}

/* Panel glass de acceso rápido */
.hero-panel {
  position: absolute;
  right: 6%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  width: 320px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 20px;
  padding: 20px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
  animation: d-fadeIn .9s .3s cubic-bezier(.4, 0, .2, 1) both;
}
.hero-panel h4 {
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 14px;
}
.hero-panel-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  margin-bottom: 8px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid transparent;
  color: #fff;
  transition: var(--transition);
}
.hero-panel-item:last-child { margin-bottom: 0; }
.hero-panel-item:hover {
  background: var(--brand);
  border-color: rgba(255, 255, 255, .35);
  transform: translateX(4px);
}
.hero-panel-item .hp-icon {
  width: 42px; height: 42px;
  flex: 0 0 42px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .15);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--brand-100);
}
.hero-panel-item:hover .hp-icon { background: rgba(255, 255, 255, .25); }
.hero-panel-item span:not(.hp-icon) { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.hero-panel-item strong { font-size: 14px; font-weight: 600; color: #fff; }
.hero-panel-item small { font-size: 12px; color: rgba(255, 255, 255, .75); }
.hero-panel-item .fa-chevron-right { color: rgba(255, 255, 255, .7); font-size: 12px; }
@keyframes d-fadeIn {
  from { opacity: 0; transform: translateY(30px) scale(.96); }
  to { opacity: 1; transform: translateY(-50%) scale(1); }
}

/* ---------- Tarjeta 3D "Tu muestra en 3 pasos" (tilt + glare + flip) ---------- */
.hero-3d-card {
  position: absolute;
  left: auto;
  right: 5%;
  top: 50%;
  bottom: auto;
  z-index: 6;
  width: 400px;
  padding: 26px;
  border-radius: 24px;
  border: 1.5px solid transparent;
  background:
    linear-gradient(rgba(15, 23, 42, .92), rgba(30, 41, 59, .92)) padding-box,
    linear-gradient(135deg, rgba(240, 98, 34, .9), rgba(217, 119, 6, .9)) border-box;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .45);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transform-style: preserve-3d;
  transform: perspective(1200px) translateY(-50%) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  will-change: transform;
  animation: h3d-in 1s .4s cubic-bezier(.4, 0, .2, 1) both;
}
@keyframes h3d-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
.hero-3d-card .h3d-glare {
  position: absolute;
  inset: 0;
  border-radius: 24px;
  pointer-events: none;
  transform: translateZ(4px);
  background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, .10), transparent 38%);
  mix-blend-mode: screen;
}
.hero-3d-card .h3d-flip {
  display: grid;
  perspective: 900px;
  transform: translateZ(30px);
}
.hero-3d-card .h3d-step {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  backface-visibility: hidden;
  transform: rotateY(-90deg);
  transform-origin: left center;
  transition: transform .65s cubic-bezier(.4, 0, .2, 1), opacity .45s ease, visibility .65s;
}
.hero-3d-card .h3d-step.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: rotateY(0deg);
}
.hero-3d-card .h3d-step-icon {
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff;
  border-radius: 15px;
  background: var(--grad-brand);
  box-shadow: 0 10px 22px rgba(240, 98, 34, .45);
  margin-bottom: 14px;
}
.hero-3d-card .h3d-step-kicker {
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--amber-100);
  margin-bottom: 8px;
}
.hero-3d-card .h3d-step h4 {
  font-family: 'Poppins', sans-serif;
  font-size: 23px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 10px;
}
.hero-3d-card .h3d-step p {
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .8);
  margin: 0;
}
.hero-3d-card .h3d-step-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 13px 22px;
  border-radius: 14px;
  background: var(--grad-brand);
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(240, 98, 34, .4);
  transition: var(--transition);
}
.hero-3d-card .h3d-step-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(240, 98, 34, .55); }
.hero-3d-card .h3d-steps-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
  transform: translateZ(24px);
}
.hero-3d-card .h3d-dot {
  width: 26px;
  height: 6px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: rgba(255, 255, 255, .25);
  cursor: pointer;
  transition: var(--transition);
}
.hero-3d-card .h3d-dot.active { background: var(--grad-brand); width: 40px; }
.hero-3d-card .h3d-tip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 14px;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(240, 98, 34, .14);
  border: 1px solid rgba(240, 98, 34, .3);
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255, 255, 255, .88);
}
.hero-3d-card .h3d-tip i { color: #FFC24D; font-size: 16px; margin-top: 2px; flex: 0 0 auto; }
.hero-3d-card .h3d-tip strong { color: #FFC24D; font-weight: 600; }

/* Preparación variable por examen */
.hero-3d-card .h3d-prep { margin-top: 2px; }
.hero-3d-card .h3d-prep-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.hero-3d-card .h3d-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .85);
  font-family: 'Poppins', sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: var(--transition);
}
.hero-3d-card .h3d-chip i { font-size: 11px; color: var(--amber-100); }
.hero-3d-card .h3d-chip:hover { background: rgba(255, 255, 255, .14); }
.hero-3d-card .h3d-chip.active {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
}
.hero-3d-card .h3d-chip.active i { color: #fff; }
.hero-3d-card .h3d-prep-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, .85);
}
.hero-3d-card .h3d-prep-text strong { color: #FFC24D; }

/* Lista informativa de los pasos */
.hero-3d-card .h3d-list {
  list-style: none;
  margin: 13px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hero-3d-card .h3d-list li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 13.5px;
  line-height: 1.45;
  color: rgba(255, 255, 255, .82);
}
.hero-3d-card .h3d-list i { color: var(--amber-100); font-size: 13px; margin-top: 2px; flex: 0 0 auto; }

.hero-3d-card .h3d-refs {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  transform: translateZ(16px);
}
.hero-3d-card .h3d-refs-label {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .55);
  margin-bottom: 8px;
}
.hero-3d-card .h3d-refs-row { display: flex; gap: 10px; }
.hero-3d-card .h3d-ref {
  flex: 1;
  min-width: 0;
  padding: 10px 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  text-align: center;
}
.hero-3d-card .h3d-ref span {
  display: block;
  font-size: 11.5px;
  color: rgba(255, 255, 255, .65);
  margin-bottom: 4px;
  white-space: nowrap;
}
.hero-3d-card .h3d-ref em {
  display: block;
  font-style: normal;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}

/* ---------- SECTION HEADINGS ---------- */
.section-heading { margin-bottom: 30px; }
.section-heading h2 {
  font-size: 34px;
  font-weight: 700;
  color: var(--slate-800);
  padding-bottom: 14px;
  position: relative;
}
.section-heading .line {
  border: none;
  background: none;
  height: 5px;
  width: 96px;
  margin: 0 auto 20px;
  padding: 0;
  background: var(--grad-brand);
  border-radius: 999px;
  position: relative;
}
.section-heading .line::before,
.section-heading .line::after { display: none; }

/* ---------- FEATURE CARDS (Servicios / Horarios / Entrega) ---------- */
#topFeature { padding: 30px 0 10px; background: var(--slate-50); }
#topFeature .row { max-width: 1280px; margin: 0 auto; }
.single-top-feature {
  background: var(--white);
  border-radius: var(--radius);
  padding: 38px 32px 34px;
  margin-bottom: 40px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);
  border: 1px solid var(--slate-200);
  position: relative;
  overflow: hidden;
  transition: var(--transition);
  min-height: 360px;
}
.single-top-feature::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--grad-brand);
  opacity: 0;
  transition: var(--transition);
}
.single-top-feature::after {
  content: "";
  position: absolute;
  top: 0; left: -80%;
  width: 55%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .5), transparent);
  transform: skewX(-20deg);
  transition: left .7s ease;
  z-index: 1;
}
.single-top-feature:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
}
.single-top-feature:hover::before { opacity: 1; }
.single-top-feature:hover::after { left: 130%; }

.feature-icon {
  width: 76px; height: 76px;
  border-radius: 22px;
  background: var(--brand-050);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  box-shadow: 0 10px 22px rgba(240, 98, 34, .25);
  transition: var(--transition);
  position: relative;
}
.single-top-feature > .feature-icon > span {
  font-size: 36px;
  color: var(--brand);
  transition: var(--transition);
}
.single-top-feature:hover .feature-icon {
  background: #fff;
  transform: rotate(-6deg) scale(1.08);
}
.single-top-feature:hover .feature-icon > span { color: var(--brand); }

.single-top-feature > h3 {
  font-family: 'Poppins', sans-serif;
  font-size: 21px;
  font-weight: 600;
  color: var(--slate-800);
  margin: 0 0 12px;
  transition: var(--transition);
}
.single-top-feature > p {
  color: var(--slate-600);
  font-size: 15px;
  line-height: 1.7;
  transition: var(--transition);
  margin-bottom: 10px;
}
.single-top-feature:hover > h3,
.single-top-feature:hover > p { color: #fff; }
.single-top-feature:hover > p a { color: #fff; }

.feature-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 10px 22px;
  border-radius: 999px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #fff;
  background: var(--grad-brand);
  box-shadow: var(--shadow-brand);
  transition: var(--transition);
  position: relative;
}
.feature-link i { transition: transform .3s ease; }
.feature-link:hover { transform: translateY(-2px); }
.feature-link:hover i { transform: translateX(4px); }

/* Acentos por card */
.single-top-feature.feature-amber::before { background: var(--grad-amber); }
.single-top-feature.feature-amber .feature-icon { background: var(--amber-100); box-shadow: 0 10px 22px rgba(217, 119, 6, .25); }
.single-top-feature.feature-amber > .feature-icon > span { color: var(--amber); }
.single-top-feature.feature-amber .feature-link { background: var(--grad-amber); box-shadow: 0 10px 26px rgba(217, 119, 6, .4); }
.single-top-feature.feature-dark::before { background: var(--grad-dark); }
.single-top-feature.feature-dark .feature-icon { background: var(--slate-100); box-shadow: 0 10px 22px rgba(15, 23, 42, .25); }
.single-top-feature.feature-dark > .feature-icon > span { color: var(--slate-800); }
.single-top-feature.feature-dark .feature-link { background: var(--grad-dark); box-shadow: 0 10px 26px rgba(15, 23, 42, .4); }

/* Horarios */
.opening-hours { border-top: 4px solid var(--brand); }
.opening-hours .opening-table { margin: 12px 0 0; }
.opening-hours .opening-table li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0;
  border-bottom: 1px dashed var(--slate-200);
  color: var(--slate-600);
  transition: var(--transition);
}
.opening-hours:hover .opening-table li { color: #fff; border-color: rgba(255, 255, 255, .35); }
.opening-hours .opening-table .value { font-weight: 700; color: var(--amber-dark); }
.opening-hours:hover .opening-table .value { color: #fff; }

/* ---------- CONTADORES DE ESTADÍSTICAS ---------- */
#stats {
  background: linear-gradient(180deg, var(--slate-50), #fff);
  padding: 30px 0 10px;
  position: relative;
}
#stats .section-heading h2 { color: var(--slate-800); }
#stats .row > div[class^="col-"] { margin-bottom: 30px; }
.stats-item {
  text-align: center;
  height: 100%;
  padding: 34px 22px 30px;
  background: var(--white);
  border: 1px solid var(--slate-200);
  border-radius: var(--radius);
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);
  transition: var(--transition);
}
.stats-item:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-md);
  border-color: rgba(240, 98, 34, .35);
}
.stats-icon {
  font-size: 34px;
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
  margin-bottom: 12px;
}
.stats-item h3 {
  color: var(--slate-800);
  font-family: 'Poppins', sans-serif;
  font-size: 46px;
  font-weight: 700;
  line-height: 1;
  margin: 0 0 6px;
}
.stats-item .plus { font-style: normal; color: var(--brand); font-size: 30px; }
.stats-item p {
  color: var(--amber-dark);
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 15px;
  margin: 0 0 4px;
}
.stats-item small { color: var(--slate-500); font-size: 13px; }

/* ---------- ESPECIALIDADES CON IMAGEN ---------- */
#specialties { padding: 30px 0 10px; background: var(--white); }
.spec-card {
  display: block;
  background: var(--white);
  border: 1px solid var(--slate-200);
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 40px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);
  transition: var(--transition);
}
.spec-card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
  border-color: transparent;
}
.spec-img {
  position: relative;
  height: 210px;
  overflow: hidden;
}
.spec-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s ease;
}
.spec-card:hover .spec-img img { transform: scale(1.12); }
.spec-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent, rgba(15, 23, 42, .55));
  opacity: .6;
  transition: var(--transition);
}
.spec-card:hover .spec-overlay { opacity: 1; }
.spec-body {
  padding: 22px 24px 24px;
  position: relative;
}
.spec-body h3 {
  font-family: 'Poppins', sans-serif;
  font-size: 19px;
  font-weight: 600;
  color: var(--slate-800);
  margin: 0 0 8px;
  transition: var(--transition);
}
.spec-card:hover .spec-body h3 { color: var(--brand); }
.spec-body p {
  color: var(--slate-600);
  font-size: 14px;
  line-height: 1.7;
  margin: 0 0 14px;
}
.spec-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--amber);
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
}
.spec-link i { transition: transform .3s ease; }
.spec-card:hover .spec-link i { transform: translateX(5px); }
.spec-card:hover .spec-link { color: var(--brand); }

/* ---------- SERVICIOS ---------- */
#service { padding: 0 0 40px; background: var(--white); }
.single-service {
  text-align: center;
  padding: 34px 22px 28px;
  border-radius: var(--radius);
  border: 1px solid var(--slate-200);
  background: var(--white);
  margin-bottom: 30px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);
  transition: var(--transition);
}
.single-service:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
  border-color: transparent;
  background: linear-gradient(180deg, #fff, var(--slate-50));
}
.service-icon {
  width: 78px; height: 78px;
  margin: 0 auto 18px;
  border-radius: 22px;
  background: var(--amber-100);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--transition);
}
.service-icon .service-icon-effect {
  font-size: 34px;
  color: var(--amber);
  box-shadow: none !important;
  transition: var(--transition);
}
.service-icon .service-icon-effect:after { display: none; }
.single-service:hover .service-icon {
  background: var(--grad-brand);
  transform: rotate(-6deg) scale(1.05);
}
.single-service:hover .service-icon .service-icon-effect { color: #fff; }
.single-service > h3 { margin: 0; }
.single-service > h3 a {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: var(--slate-800);
}
.single-service > h3 a:hover { color: var(--brand); }

/* ---------- EQUIPO / TALENTO HUMANO (coverflow 3D) ---------- */
#meetDoctors { padding: 20px 0 40px; background: var(--slate-50); overflow: hidden; }
#meetDoctors .section-heading { margin-bottom: 40px; }
.coverflow-wrap {
  position: relative;
  max-width: 860px;
  margin: 0 auto;
}
.team-coverflow-wrap {
  padding: 70px 0 10px;
}
.coverflow-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 150px;
  line-height: 1;
  letter-spacing: 10px;
  white-space: nowrap;
  color: rgba(240, 98, 34, .16);
  -webkit-text-stroke: 2px rgba(240, 98, 34, .7);
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.coverflow {
  position: relative;
  height: 380px;
  z-index: 1;
}
.coverflow-track {
  position: relative;
  width: 100%;
  height: 100%;
}
.cf-card {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 240px;
  height: 340px;
  margin-left: -120px;
  margin-top: -170px;
  border-radius: var(--radius);
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, .5);
  box-shadow: 0 22px 50px rgba(15, 23, 42, .22);
  opacity: 0;
  pointer-events: none;
  transform: translateX(0) scale(.7);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transition: transform .7s cubic-bezier(.25, .46, .45, .94), opacity .6s ease, filter .6s ease;
}
.cf-card img {
  width: 100%;
  height: 100%;
  object-fit: unset;
  object-position: center top;
  display: block;
}
.cf-card.center {
  transform: translateX(0) scale(1.08);
  opacity: 1;
  pointer-events: auto;
  filter: none;
  z-index: 5;
  border-color: rgba(240, 98, 34, .55);
  box-shadow: 0 34px 70px rgba(15, 23, 42, .35);
}
.cf-card.left-1 { transform: translateX(-215px) scale(.9); opacity: .95; pointer-events: auto; filter: grayscale(45%); z-index: 4; }
.cf-card.right-1 { transform: translateX(215px) scale(.9); opacity: .95; pointer-events: auto; filter: grayscale(45%); z-index: 4; }
.cf-card.left-2 { transform: translateX(-430px) scale(.78); opacity: .6; filter: grayscale(85%); z-index: 3; }
.cf-card.right-2 { transform: translateX(430px) scale(.78); opacity: .6; filter: grayscale(85%); z-index: 3; }
.cf-card.hidden { opacity: 0; pointer-events: none; }

/* Efectos sutiles del carrusel de equipo */
.cf-card.left-1:hover,
.cf-card.right-1:hover { filter: grayscale(0); opacity: 1; }
.cf-card.left-2:hover,
.cf-card.right-2:hover { filter: grayscale(35%); opacity: .85; }
.cf-card.center { animation: d-cf-glow 3.8s ease-in-out infinite; }
.cf-card.center img { animation: d-cf-zoom 9s ease-in-out infinite alternate; }
.cf-card.center::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .18), transparent);
  transform: skewX(-18deg);
  animation: d-cf-shine 4.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes d-cf-zoom {
  from { transform: scale(1); }
  to { transform: scale(1.03); }
}
@keyframes d-cf-glow {
  0%, 100% { box-shadow: 0 34px 70px rgba(15, 23, 42, .35); }
  50% { box-shadow: 0 34px 70px rgba(15, 23, 42, .35), 0 0 0 6px rgba(240, 98, 34, .12); }
}
@keyframes d-cf-shine {
  0% { left: -60%; }
  55%, 100% { left: 130%; }
}
@media (prefers-reduced-motion: reduce) {
  .cf-card.center,
  .cf-card.center img,
  .cf-card.center::after { animation: none; }
}

.cf-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid var(--slate-200);
  background: var(--white);
  color: var(--slate-700);
  font-size: 17px;
  box-shadow: var(--shadow-md);
  transition: var(--transition);
  cursor: pointer;
  z-index: 6;
}
.cf-nav::before { display: none; }
.cf-prev { left: -6px; }
.cf-next { right: -6px; }
.cf-nav:hover {
  background: var(--grad-brand);
  border-color: var(--brand);
  color: #fff;
  transform: translateY(-50%) scale(1.08);
}

.cf-info {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-top: 24px;
}
.cf-info h3 {
  font-family: 'Poppins', sans-serif;
  font-size: 27px;
  font-weight: 700;
  color: var(--slate-800);
  margin: 0;
}
.cf-info p {
  color: var(--brand);
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: .5px;
  margin: 5px 0 0;
}
.cf-dots {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}
.cf-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: none;
  padding: 0;
  background: var(--slate-300);
  cursor: pointer;
  transition: var(--transition);
}
.cf-dot.active { width: 30px; background: var(--grad-brand); }
.cf-dot:hover { background: var(--brand); }

/* Carrusel especialidades */
.spec-slider { position: relative; }
.spec-slider .slick-track { padding: 12px 0; }
.spec-slide { padding: 0 12px; }
.spec-slide .spec-card { margin-bottom: 0; }
.spec-slider .slick-prev,
.spec-slider .slick-next {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--white);
  border: 1px solid var(--slate-200);
  color: var(--slate-700);
  box-shadow: var(--shadow-md);
  z-index: 3;
  top: 50%;
  margin-top: 0;
  padding: 0;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: var(--transition);
}
.spec-slider .slick-prev:hover,
.spec-slider .slick-next:hover {
  background: var(--grad-brand);
  border-color: var(--brand);
  color: #fff;
}
.spec-slider .slick-prev::before,
.spec-slider .slick-next::before,
.cf-nav::before { display: none; }
.spec-slider .slick-prev { left: -20px; }
.spec-slider .slick-next { right: -20px; }

/* ---------- BREADCRUMBS / HEADERS INTERNOS ---------- */
#blogArchive { padding: 0; }
.blog-breadcrumbs-area {
  background: var(--grad-dark);
  padding: 48px 0;
  margin-bottom: 32px;
  position: relative;
  overflow: hidden;
}
.blog-breadcrumbs-area .container {
  padding-left: 0;
  padding-right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.blog-breadcrumbs-left,
.blog-breadcrumbs-right { float: none !important; }
.blog-breadcrumbs-area::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 80% -20%, rgba(240, 98, 34, .35), transparent 45%),
    radial-gradient(circle at 10% 120%, rgba(217, 119, 6, .35), transparent 45%);
}
.blog-breadcrumbs-left h2 {
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  position: relative;
  z-index: 2;
}
.blog-breadcrumbs-right .breadcrumb {
  background: rgba(255, 255, 255, .12);
  backdrop-filter: blur(6px);
  border-radius: 999px;
  padding: 10px 20px;
  margin-bottom: 0;
  position: relative;
  z-index: 2;
}
.blog-breadcrumbs-right .breadcrumb a { color: rgba(255, 255, 255, .75); }
.blog-breadcrumbs-right .breadcrumb > .active,
.blog-breadcrumbs-right .breadcrumb a:hover { color: var(--brand); }
.blog-breadcrumbs-right .breadcrumb > li + li::before { color: rgba(255, 255, 255, .45); }

/* ---------- CONTENIDO INTERNO ---------- */
#extraFeatures,
#contact,
#blogDetails { padding: 0 0 60px; }
.container > section:not(#blogArchive) { padding-bottom: 40px; }
/* Neutraliza el contenedor anidado del template (evita doble padding) */
#service .container,
#extraFeatures .container {
  padding-left: 0;
  padding-right: 0;
}

/* ---------- IMAGEN DESTACADA (páginas internas) ---------- */
.feature-figure {
  position: relative;
  margin: 0;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border: 3px solid var(--white);
  outline: 1px solid var(--slate-200);
  background: var(--slate-50);
  animation: d-featureIn .8s cubic-bezier(.4, 0, .2, 1) both;
}
.feature-figure img {
  width: 100%;
  display: block;
  transition: transform .8s cubic-bezier(.4, 0, .2, 1);
}
.feature-figure:hover img { transform: scale(1.08); }
.feature-figure::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 55%, rgba(15, 23, 42, .62));
  opacity: 0;
  transition: opacity .5s;
  pointer-events: none;
}
.feature-figure:hover::before { opacity: 1; }
.feature-figure__badge {
  position: absolute;
  left: 50%;
  bottom: 20px;
  z-index: 2;
  transform: translateX(-50%) translateY(12px);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 999px;
  background: var(--grad-brand);
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  box-shadow: var(--shadow-brand);
  opacity: 0;
  transition: all .5s cubic-bezier(.4, 0, .2, 1);
}
.feature-figure:hover .feature-figure__badge {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
@keyframes d-featureIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
/* Centrado vertical de columnas en páginas internas */
.row.flex-center {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
/* Columnas con altura igualada (imagen ocupa el alto del texto) */
.row.flex-fill {
  display: flex;
  flex-wrap: wrap;
}
.row.flex-fill > [class^="col-"],
.row.flex-center > [class^="col-"] { min-width: 0; }
.feature-figure--fill {
  height: 100%;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.feature-figure--fill img {
  height: 100%;
  object-fit: cover;
}
/* Tarjeta de contenido profesional */
.content-card {
  background: var(--white);
  border: 1px solid var(--slate-100);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 34px 38px;
  animation: d-featureIn .7s cubic-bezier(.4, 0, .2, 1) both;
}
.content-card h3 { transition: color .3s; }
.content-card h3:hover { color: var(--brand); }
/* Reduce el espacio entre el título y la tarjeta de contenido */
#extraFeatures .section-heading { margin-bottom: 16px; }
#extraFeatures .content-card { padding-top: 24px; }
.content-card .section-heading { text-align: left; }
.content-card .section-heading .line { margin-left: 0; }

/* ---------- ACORDEÓN DE RECOMENDACIONES ---------- */
.rec-accordion { max-width: 960px; margin: 0 auto; }
.rec-panel { margin-bottom: 14px; }
.rec-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: var(--white);
  border: 1px solid var(--slate-100);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  color: var(--slate-800);
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s, border-color .3s;
}
.rec-header::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--grad-brand);
  border-radius: 0 4px 4px 0;
  opacity: 0;
  transition: opacity .3s;
}
.rec-header::after {
  content: "";
  position: absolute;
  top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .55), transparent);
  transform: skewX(-20deg);
  transition: left .6s ease;
}
.rec-header:hover, .rec-header:focus {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(15, 23, 42, .14);
  border-color: var(--brand-100);
  text-decoration: none;
  color: var(--slate-800);
}
.rec-header:hover::after { left: 120%; }
.rec-header:not(.collapsed) { border-color: var(--brand-100); }
.rec-header:not(.collapsed)::before { opacity: 1; }
.rec-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 12px;
  background: var(--brand-050);
  color: var(--brand);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: var(--transition);
}
.rec-header:not(.collapsed) .rec-icon {
  background: var(--grad-brand);
  color: #fff;
  transform: rotate(-6deg) scale(1.05);
}
.rec-title {
  flex: 1;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.4;
}
.rec-arrow {
  color: var(--brand);
  font-size: 15px;
  transition: transform .35s;
}
.rec-header:not(.collapsed) .rec-arrow { transform: rotate(180deg); }
.rec-body {
  margin-top: 8px;
  padding: 20px 24px;
  background: var(--white);
  border: 1px solid var(--slate-100);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
}
.rec-body p { color: var(--slate-600); margin: 8px 0; }
.rec-body ul { list-style: none; margin: 8px 0; padding: 0; }
.rec-body ul li {
  position: relative;
  padding: 6px 0 6px 26px;
  color: var(--slate-600);
  line-height: 1.7;
}
.rec-body ul li::before {
  content: "\f00c";
  font-family: 'FontAwesome';
  position: absolute;
  left: 4px; top: 8px;
  font-size: 11px;
  color: var(--brand);
}
.rec-body ul li.rec-subtitle {
  padding: 12px 0 4px 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  color: var(--amber-dark);
  font-size: 14px;
}
.rec-body ul li.rec-subtitle::before {
  content: "\f105";
  left: 0;
  top: 13px;
  font-size: 14px;
  color: var(--brand);
}

/* Reduce el espacio superior de la sección de valores */
#whychooseSection { padding: 15px 0 40px; }
.custom-panel .panel,
.panel-group .panel {
  border: 1px solid var(--slate-100);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  background: var(--white);
}
.custom-panel .panel-heading,
.panel-heading {
  background: var(--slate-50);
  border: none;
  padding: 14px 18px;
}
.custom-panel .panel-heading a {
  color: var(--slate-800);
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  background: none;
}
.custom-panel .panel-heading a:hover { color: var(--brand); }
.custom-panel .panel-heading a .fa { color: var(--brand); }
.panel-body { color: var(--slate-600); line-height: 1.8; padding: 20px 22px; }

/* ---------- VALORES CORPORATIVOS ---------- */
.whyChoose-right .media {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  background: var(--white);
  border: 1px solid var(--slate-100);
  border-radius: var(--radius-sm);
  padding: 20px 22px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}
.whyChoose-right .media:hover {
  box-shadow: var(--shadow-md);
  transform: translateX(6px);
  border-color: transparent;
}
.whyChoose-right .media-icon {
  width: 52px; height: 52px;
  flex: 0 0 52px;
  border-radius: 14px;
  background: var(--grad-brand);
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  box-shadow: var(--shadow-brand);
  transition: var(--transition);
}
.whyChoose-right .media-icon:hover { transform: rotate(-8deg) scale(1.06); }
.whyChoose-right .media-heading {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 17px;
  color: var(--slate-800);
  margin: 0 0 6px;
  color: var(--amber-dark);
}
.whyChoose-right .media-body p {
  color: var(--slate-600);
  margin: 0;
  line-height: 1.7;
}

/* ---------- RECOMENDACIONES / CONTENIDO TEXTO ---------- */
#content { padding: 10px 0 70px; }
#content .container_24,
#content #content {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}
/* Párrafo introductorio justo tras el breadcrumb (portafolio y afines) */
#blogArchive + p {
  color: var(--slate-600);
  font-size: 16px;
  line-height: 1.8;
  margin: 0 0 28px;
}

/* Tipografía común de páginas internas */
#content h2, #extraFeatures h2, #service h2, #whychooseSection h2,
#content h3, #extraFeatures h3, #service h3, #whychooseSection h3 {
  font-family: 'Poppins', sans-serif;
  color: var(--slate-800);
  margin: 30px 0 14px;
}
#content h2, #extraFeatures h2, #service h2, #whychooseSection h2 {
  font-size: 26px;
  font-weight: 700;
}
#content h3, #extraFeatures h3, #service h3, #whychooseSection h3 {
  font-size: 19px;
  font-weight: 600;
  color: var(--amber-dark);
  position: relative;
  padding-left: 16px;
}
#content h3::before, #extraFeatures h3::before, #service h3::before, #whychooseSection h3::before {
  content: "";
  position: absolute;
  left: 0; top: 5px; bottom: 5px;
  width: 5px;
  border-radius: 4px;
  background: var(--grad-brand);
}
#content p, #extraFeatures p, #service p, #whychooseSection p {
  color: var(--slate-600);
  line-height: 1.8;
  margin: 10px 0;
}
#content ul, #extraFeatures ul, #service ul, #whychooseSection ul {
  list-style: none;
  margin: 8px 0 18px;
  padding: 0;
}
#content ul li, #extraFeatures ul li, #service ul li, #whychooseSection ul li {
  color: var(--slate-600);
  padding: 7px 0 7px 26px;
  position: relative;
  line-height: 1.7;
  display: block;
}
#content ul li::before, #extraFeatures ul li::before, #service ul li::before, #whychooseSection ul li::before {
  content: "\f00c";
  position: absolute;
  left: 4px; top: 17px;
  font-family: 'FontAwesome';
  font-size: 11px;
  color: var(--brand);
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
}
#content ol, #extraFeatures ol {
  padding-left: 22px;
  margin: 10px 0 18px;
  color: var(--slate-600);
}
#content ol li, #extraFeatures ol li {
  padding: 6px 0;
  line-height: 1.7;
}
#content .hr-border, #extraFeatures .hr-border, #service .hr-border, #whychooseSection .hr-border {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, var(--slate-200), transparent);
  margin: 26px 0;
}

/* ---------- FORMULARIO CONTACTO ---------- */
#contact { padding: 10px 0 70px; }
.contact-form {
  background: var(--white);
  border: 1px solid var(--slate-100);
  border-radius: var(--radius);
  padding: 40px;
  box-shadow: var(--shadow-md);
}
.contact-form p { color: var(--slate-600); }
.wp-form-control {
  border: 1.5px solid var(--slate-200);
  border-radius: var(--radius-sm);
  padding: 13px 16px;
  font-size: 15px;
  color: var(--slate-700);
  background: var(--slate-50);
  transition: var(--transition);
  width: 100%;
  margin-bottom: 16px;
}
.wp-form-control:focus {
  border-color: var(--brand);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(240, 98, 34, .12);
}
.submitphoto_form .button--itzel,
.form-submit input {
  background: var(--grad-brand);
  border: none;
  border-radius: 999px;
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  padding: 14px 36px;
  box-shadow: var(--shadow-brand);
  transition: var(--transition);
}
.submitphoto_form .button--itzel:hover,
.form-submit input:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(240, 98, 34, .42); }
.wp-form-control:hover { border-color: var(--slate-300); }
textarea.wp-form-control { resize: vertical; min-height: 140px; }

/* ---------- PANEL DE CONTACTO ---------- */
.contact-panel {
  background: var(--grad-dark);
  border-radius: var(--radius);
  padding: 36px 32px;
  box-shadow: var(--shadow-lg);
  height: 100%;
  position: relative;
  color: #fff;
  display: flex;
  flex-direction: column;
}
.contact-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 85% 12%, rgba(240, 98, 34, .42), transparent 45%),
    radial-gradient(circle at 8% 96%, rgba(217, 119, 6, .35), transparent 45%);
  pointer-events: none;
}
.contact-panel .section-heading { position: relative; z-index: 1; text-align: left; }
.contact-panel .section-heading h2 { color: #fff; font-size: 24px; line-height: 1.3; }
.contact-panel .section-heading .line { background: var(--grad-brand); margin-left: 0; }
.contact-list {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  position: relative;
  z-index: 1;
}
.contact-list li {
  position: relative;
  padding: 14px 0 14px 60px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.contact-list li:last-child { border-bottom: none; }
.contact-icon {
  position: absolute;
  left: 0;
  top: 14px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--grad-brand);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  box-shadow: var(--shadow-brand);
}
.contact-list strong {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 2px;
}
.contact-list p {
  color: rgba(255, 255, 255, .8);
  font-size: 14px;
  margin: 0;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.contact-whatsapp {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  align-self: flex-start;
  padding: 12px 24px;
  border-radius: 999px;
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 14px;
  box-shadow: 0 10px 26px rgba(37, 211, 102, .4);
  transition: var(--transition);
}
.contact-whatsapp:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 14px 30px rgba(37, 211, 102, .5); }
.contact-whatsapp-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.contact-whatsapp-group .contact-whatsapp { margin-top: 0; }

/* WhatsApp desplegable en navbar (sedes) */
.navbar-whatsapp-dropdown { display: inline-block; position: relative; }
.navbar-whatsapp-dropdown .dropdown-menu {
  margin-top: 6px;
  border: none;
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  padding: 8px;
  min-width: 240px;
}
.navbar-whatsapp-dropdown .dropdown-menu > li > a {
  border-radius: 8px;
  font-family: 'Poppins', sans-serif;
  font-size: 13.5px;
  color: var(--ink);
  padding: 10px 14px;
}
.navbar-whatsapp-dropdown .dropdown-menu > li > a i { color: #25D366; margin-right: 8px; }
.navbar-whatsapp-dropdown .dropdown-menu > li > a:hover { background: var(--brand-050); color: var(--brand); }

/* ---------- BOTÓN SCROLL TOP + WHATSAPP FLOTANTE ---------- */
.scrollToTop {
  bottom: 90px;
  right: 26px;
  border-radius: 50%;
  background: var(--grad-brand);
  border: none;
  transform: rotate(43deg);
  box-shadow: var(--shadow-brand);
}
.scrollToTop:hover { background: var(--brand-600); }

/* ---------- FOOTER ---------- */
#footer {
  background: var(--navy);
  color: var(--slate-300);
  position: relative;
}
.footer-top {
  background: var(--grad-dark);
  padding: 70px 0 50px;
  border-top: 4px solid var(--brand);
}
#footer .single-footer-widget .section-heading { margin-bottom: 22px; text-align: left; }
#footer .single-footer-widget .section-heading h2 {
  color: #fff;
  font-size: 22px;
  padding-bottom: 12px;
}
#footer .single-footer-widget .section-heading .line {
  margin: 0;
  width: 56px;
  height: 4px;
  background: var(--grad-brand);
}
#footer p { color: var(--slate-400, #94A3B8); font-size: 14px; line-height: 1.8; }
.footer-service li > a {
  color: var(--slate-600);
  border: none;
  padding: 5px 0;
  display: inline-block;
  font-size: 15px;
}
.footer-service li > a:hover { color: var(--brand); padding-left: 6px; }
.footer-service li > a span { color: var(--brand); }
#footer .footer-service li > a { color: var(--slate-400, #94A3B8); font-size: 14px; }
#footer .footer-service li > a:hover { color: var(--brand); }
.contact-info > p { color: var(--slate-400, #94A3B8); }
.contact-info > p span { color: var(--brand); }

.footer-middle {
  background: var(--navy);
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.footer-copyright p { color: var(--slate-400, #94A3B8); }
.footer-copyright p a { color: var(--brand); }
.footer-social a {
  border: 1px solid rgba(255, 255, 255, .18);
  color: var(--slate-400, #94A3B8);
  border-radius: 50%;
  width: 38px; height: 38px;
  line-height: 36px;
  text-align: center;
  display: inline-block;
  margin-left: 6px;
}
.footer-social a:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  transform: translateY(-3px);
}

/* ---------- ANIMACIONES AOS ---------- */
/* Fallback: si AOS no inicializa, el contenido permanece visible */
[data-aos]:not(.aos-init) {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1199px) {
  .hero-3d-card { display: none; }
}
@media (max-width: 991px) {
  .slider-text h2 { font-size: 42px; }
  .navbar-brand img { height: 46px; }
  .top-slide-inner { height: 70vh; min-height: 480px; }
  .hero-3d-card { display: none; }
  .slider-text { max-width: 620px; }
  .spec-slider .slick-prev { left: 4px; }
  .spec-slider .slick-next { right: 4px; }
  .coverflow-bg { font-size: 110px; }
  .cf-card.left-1 { transform: translateX(-170px) scale(.9); }
  .cf-card.right-1 { transform: translateX(170px) scale(.9); }
  .cf-card.left-2 { transform: translateX(-340px) scale(.78); }
  .cf-card.right-2 { transform: translateX(340px) scale(.78); }
}
@media (max-width: 767px) {
  body { padding-top: 60px; }
  .topbar { display: none; }
  .top-slide-inner { height: 62vh; min-height: 440px; }
  .slider-text { padding: 0 24px; }
  .slider-text h2 { font-size: 30px; }
  .slider-text p { font-size: 15px; }
  .slider-cta .btn-slider { display: block; margin: 0 0 12px; text-align: center; }
  .float-icon { font-size: calc(var(--s, 40px) * .62); }
  .navbar-default .navbar-collapse {
    background: #fff;
    border-radius: 0 0 var(--radius) var(--radius);
    box-shadow: var(--shadow-lg);
    margin: 0 -15px;
    padding: 8px 15px;
  }
  .navbar-default .navbar-nav > li > a { padding: 12px 10px; }
  .navbar-default .navbar-nav > li > a::before { bottom: 6px; }
  .navbar-whatsapp { margin: 8px 10px; }
  .section-heading h2 { font-size: 27px; }
  .blog-breadcrumbs-area { padding: 44px 0; }
  .blog-breadcrumbs-left h2 { font-size: 26px; }
  .stats-item h3 { font-size: 38px; }
  .spec-img { height: 180px; }
  .coverflow { height: 340px; }
  .cf-card { width: 200px; height: 290px; margin-left: -100px; margin-top: -145px; }
  .cf-card.left-1 { transform: translateX(-120px) scale(.88); }
  .cf-card.right-1 { transform: translateX(120px) scale(.88); }
  .cf-card.left-2 { transform: translateX(-240px) scale(.76); }
  .cf-card.right-2 { transform: translateX(240px) scale(.76); }
  .coverflow-bg { font-size: 78px; }
  .cf-nav { width: 42px; height: 42px; font-size: 15px; }
}
@media (max-width: 480px) {
  .single-top-feature { padding: 30px 22px; min-height: 0; }
  .coverflow { height: 300px; }
  .cf-card { width: 180px; height: 260px; margin-left: -90px; margin-top: -130px; }
  .cf-card.left-1 { transform: translateX(-95px) scale(.86); }
  .cf-card.right-1 { transform: translateX(95px) scale(.86); }
  .cf-nav { width: 38px; height: 38px; }
  .cf-info h3 { font-size: 22px; }
}