/* ============================================================
   DiagnosticBike · Landing de producto tipo CURSO
   ============================================================ */
:root{
	--dbk-red:#c8102e;
	--dbk-red-d:#8f0a1f;
	--dbk-dark:#0c1116;
	--dbk-dark-2:#141b21;
	--dbk-light:#ffffff;
	--dbk-gray:#f4f5f6;
	--dbk-text:#4a5257;
	--dbk-radius:14px;
	--dbk-wrap:1200px;
}

/* Ocultar el banner de título del tema solo en cursos */
body.single-course .page-title-container{ display:none !important; }
/* Cerrar el hueco superior/inferior: el tema pone margin-top/bottom 90-120px
   en .content-wrapper; al ocultar el banner ese margen queda como espacio. */
body.single-course .content-wrapper{ margin-top:0 !important; margin-bottom:0 !important; }

.dbk-course{ font-family:inherit; color:var(--dbk-text); line-height:1.6; }
.dbk-course *{ box-sizing:border-box; }

/* Quitar la viñeta fontello que el tema añade a todos los ul > li
   (mis listas ya usan sus propios iconos: chevron / check) */
.dbk-course ul{ list-style:none; }
.dbk-course ul > li:before{ content:none !important; display:none !important; }

/* Secciones a todo ancho (rompen cualquier contenedor) */
.dbk-course .dbk-sec,
.dbk-course .dbk-hero{
	position:relative;
	width:100vw;
	left:50%;
	transform:translateX(-50%);
	padding:72px 24px;
}
.dbk-wrap{ max-width:var(--dbk-wrap); margin:0 auto; width:100%; }

.dbk-sec--dark,.dbk-hero{ background:var(--dbk-dark); color:#cfd5da; }
.dbk-sec--light{ background:var(--dbk-light); color:var(--dbk-text); }

/* Forzar texto blanco en secciones oscuras (el tema pinta los h1-h6 en oscuro) */
body.single-course .dbk-hero__title,
body.single-course .dbk-h2--light,
body.single-course .dbk-col__title,
body.single-course .dbk-cta__title{ color:#fff !important; }

.dbk-eyebrow{ display:block; color:var(--dbk-red); font-weight:700; letter-spacing:.18em; text-transform:uppercase; font-size:13px; margin-bottom:14px; }
.dbk-eyebrow--soft{ color:rgba(255,255,255,.65); }

.dbk-h2{ font-size:34px; font-weight:800; line-height:1.15; margin:0 0 36px; color:#101820; }
.dbk-h2--light{ color:#fff; }
.dbk-sec__lead{ margin:-22px 0 34px; color:rgba(255,255,255,.6); }

/* ---------- HERO ---------- */
.dbk-hero__grid{ display:grid; grid-template-columns:minmax(0,460px) 1fr; gap:48px; align-items:center; }
.dbk-hero__media img{ width:100%; height:100%; object-fit:cover; border-radius:var(--dbk-radius); display:block; }
.dbk-hero__title{ font-size:46px; line-height:1.08; font-weight:800; color:#fff; margin:0 0 18px; }
.dbk-hero__intro{ color:rgba(255,255,255,.72); font-size:17px; margin-bottom:28px; }
.dbk-hero__intro p{ margin:0; }

.dbk-meta{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:28px; }
.dbk-meta__card{ background:var(--dbk-dark-2); border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:16px 18px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center; }
.dbk-meta__icon{ grid-row:1/3; width:34px; height:34px; color:var(--dbk-red); }
.dbk-meta__icon svg{ width:100%; height:100%; }
.dbk-meta__label{ font-size:12px; color:rgba(255,255,255,.5); }
.dbk-meta__value{ font-weight:700; color:#fff; font-size:15px; }
.dbk-meta__value .amount,.dbk-meta__value bdi{ color:#fff; }

/* ---------- Botones ---------- */
.dbk-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; background:var(--dbk-red); color:#fff !important; font-weight:700; text-decoration:none; padding:17px 30px; border-radius:10px; transition:.2s; border:0; cursor:pointer; }
.dbk-btn:hover{ background:var(--dbk-red-d); }
.dbk-btn svg{ width:18px; height:18px; }
.dbk-btn--block{ width:100%; }
.dbk-btn--invert{ background:#fff; color:var(--dbk-red) !important; }
.dbk-btn--invert:hover{ background:#f0f0f0; }

/* El botón de inscripción usa el estilo NATIVO del tema
   (clases single_add_to_cart_button button alt) → misma apariencia que la ficha normal.
   Solo quitamos el margen del formulario para encajarlo en la maquetación. */
.dbk-course form.cart.dbk-enroll{ margin:0; padding:0; }
/* Centrar el botón en la llamada final (el tema lo alinea a la izquierda en .cart) */
.dbk-cta .dbk-enroll{ justify-content:center !important; width:100%; }
/* Texto (y flecha) del botón de inscripción en blanco */
.dbk-course .single_add_to_cart_button,
.dbk-course .single_add_to_cart_button:hover,
.dbk-course .single_add_to_cart_button:focus,
.dbk-course .single_add_to_cart_button:after{ color:#fff !important; }

/* ---------- Lista de objetivos / puntos ---------- */
.dbk-objlist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.dbk-objlist li{ position:relative; background:var(--dbk-dark-2); border-left:3px solid var(--dbk-red); border-radius:8px; padding:18px 20px 18px 52px; color:#cfd5da; }
.dbk-chev{ position:absolute; left:18px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--dbk-red); }
.dbk-chev svg{ width:100%; height:100%; }

/* ---------- Tarjetas "Dirigido a" ---------- */
.dbk-cards{ display:grid; gap:22px; }
.dbk-cards--4{ grid-template-columns:repeat(4,1fr); }
.dbk-card{ background:var(--dbk-gray); border-radius:var(--dbk-radius); padding:30px 26px; }
.dbk-card__icon{ display:block; width:34px; height:34px; color:var(--dbk-red); margin-bottom:20px; }
.dbk-card__icon svg{ width:100%; height:100%; }
.dbk-card__title{ font-size:18px; font-weight:800; color:#101820; margin:0 0 8px; }
.dbk-card__sub{ margin:0; color:#8a9097; font-size:14px; }

/* ---------- Metodología (2 columnas) ---------- */
.dbk-cols{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.dbk-col{ background:var(--dbk-dark-2); border:1px solid rgba(255,255,255,.06); border-radius:var(--dbk-radius); padding:34px 30px; }
.dbk-col__icon{ display:inline-flex; width:54px; height:54px; padding:13px; background:var(--dbk-red); color:#fff; border-radius:12px; margin-bottom:22px; }
.dbk-col__icon svg{ width:100%; height:100%; }
.dbk-col__title{ font-size:24px; font-weight:800; color:#fff; margin:0 0 22px; }

/* ---------- Certificación ---------- */
.dbk-cert{ display:grid; grid-template-columns:1fr minmax(0,360px); gap:48px; align-items:center; }
.dbk-cert__text{ font-size:17px; margin:0 0 22px; }
.dbk-checklist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.dbk-checklist li{ display:flex; align-items:center; gap:12px; font-weight:600; color:#101820; }
.dbk-check{ width:22px; height:22px; color:var(--dbk-red); flex:0 0 auto; }
.dbk-check svg{ width:100%; height:100%; }
.dbk-cert__badge{ background:var(--dbk-gray); border-radius:var(--dbk-radius); padding:44px 30px; text-align:center; }
.dbk-cert__seal{ display:inline-flex; width:60px; height:60px; color:var(--dbk-red); margin-bottom:18px; }
.dbk-cert__seal svg{ width:100%; height:100%; }
.dbk-cert__badge-title{ display:block; font-size:20px; font-weight:800; color:#101820; line-height:1.3; }
.dbk-cert__badge-sub{ display:block; margin-top:10px; color:#8a9097; font-size:14px; }

/* ---------- CTA final ---------- */
.dbk-cta{ background:linear-gradient(180deg,#0c1116 0%,var(--dbk-red-d) 55%,var(--dbk-red) 100%); color:#fff; }
/* Con imagen de fondo: imagen a cubrir + degradado rojo semitransparente encima */
.dbk-cta--has-bg{ background-size:cover; background-position:center; background-repeat:no-repeat; }
.dbk-cta--has-bg::before{ content:''; position:absolute; top:0; right:0; bottom:0; left:0;
	background:linear-gradient(180deg, rgba(12,17,22,.92) 0%, rgba(143,10,31,.85) 55%, rgba(200,16,46,.80) 100%); z-index:0; }
.dbk-cta__inner{ text-align:center; max-width:760px; position:relative; z-index:1; }
.dbk-cta__title{ font-size:40px; font-weight:800; line-height:1.12; margin:0 0 18px; color:#fff; }
.dbk-cta__cohorte{ color:rgba(255,255,255,.8); margin:0 0 22px; }
.dbk-cta__price{ font-size:52px; font-weight:800; color:#fff; margin-bottom:8px; }
.dbk-cta__price .amount,.dbk-cta__price bdi{ color:#fff; }
.dbk-cta .dbk-btn{ margin-top:18px; }
.dbk-cta__note{ margin-top:22px; color:rgba(255,255,255,.7); font-size:14px; }

/* ---------- Responsive ---------- */
@media(max-width:980px){
	.dbk-hero__grid{ grid-template-columns:1fr; }
	.dbk-cards--4{ grid-template-columns:repeat(2,1fr); }
	.dbk-cols{ grid-template-columns:1fr; }
	.dbk-cert{ grid-template-columns:1fr; }
	.dbk-hero__title{ font-size:36px; }
	.dbk-h2,.dbk-cta__title{ font-size:30px; }
}
@media(max-width:560px){
	.dbk-course .dbk-sec,.dbk-course .dbk-hero{ padding:48px 18px; }
	.dbk-meta,.dbk-cards--4{ grid-template-columns:1fr; }
	.dbk-cta__price{ font-size:42px; }
}