:root{
  /* Core */
  --bg:#f6f8fc;
  --surface:#ffffff;
  --ink:#0b1220;
  --muted:#475569;
  --border:#e5e7eb;

  /* Verijob palette (ajustable si tienes hex exactos) */
  --brand:#2563eb;      /* azul */
  --brand2:#dc2626;     /* rojo */
  --brandDark:#1e40af;

  /* UI */
  --radius:18px;
  --radiusSm:14px;
  --shadow:0 16px 44px rgba(2,6,23,.10);
  --shadowSm:0 10px 28px rgba(2,6,23,.08);
  --max:1200px;

  /* Type scale */
  --h1:52px;
  --h2:26px;
  --h3:18px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--ink);
  background:
    radial-gradient(1100px 500px at 15% -10%, rgba(37,99,235,.18), transparent 55%),
    radial-gradient(800px 500px at 90% 10%, rgba(220,38,38,.12), transparent 55%),
    linear-gradient(180deg, var(--bg), #fff);
}

a{color:inherit;text-decoration:none}
a:hover{opacity:.92}

.container{
  max-width:var(--max);
  margin:0 auto;
  padding-left:24px;
  padding-right:24px;
  width:100%;
  box-sizing:border-box;
}

.section > .container{
  width:100%;
  box-sizing:border-box;
}

.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(246,248,252,.86);
  backdrop-filter:saturate(170%) blur(10px);
  border-bottom:1px solid var(--border);
}

.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0;gap:12px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.02em}
.brand .mark{
  width:18px;height:18px;border-radius:6px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  box-shadow:0 10px 26px rgba(37,99,235,.22);
}
.navlinks{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.navlinks a{font-size:14px;color:var(--muted);font-weight:650}
.navlinks a.active{color:var(--ink)}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 12px;border-radius:999px;
  border:1px solid var(--border);
  font-weight:800;font-size:14px;
  background:rgba(255,255,255,.9);
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-solid{
  border:0;
  color:#fff;
  background:linear-gradient(135deg,var(--brand), #3b82f6);
  box-shadow:0 16px 44px rgba(37,99,235,.20);
}
.btn-outline{
  background:transparent;
  border:1px solid rgba(15,23,42,.14);
}
.btn-red{
  border:0;
  color:#fff;
  background:linear-gradient(135deg,var(--brand2), #ef4444);
  box-shadow:0 16px 44px rgba(220,38,38,.16);
}

.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 11px;border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.75);
  color:var(--muted);
  font-size:12px;
}

.hero{padding:46px 0 16px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:start}

.h1{font-size:var(--h1);line-height:1.02;letter-spacing:-.04em;margin:10px 0 0}
.h2{font-size:var(--h2);letter-spacing:-.02em;margin:0}
.h3{font-size:var(--h3);letter-spacing:-.01em;margin:0}
.p{font-size:18px;color:var(--muted);line-height:1.55;margin:12px 0 0;max-width:760px}

.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

.card{
  background:rgba(255,255,255,.96);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.panel{padding:18px}
.hr{height:1px;background:var(--border);margin:14px 0}

.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.item{
  padding:16px;border-radius:var(--radiusSm);
  border:1px solid var(--border);
  background:#fff;
  box-shadow:var(--shadowSm);
}
.item .desc{color:var(--muted);margin:8px 0 0;font-size:14px;line-height:1.5}
.item .meta{margin-top:10px;color:var(--muted);font-size:12px}
.list{margin:10px 0 0;padding-left:18px;color:var(--muted);font-size:14px;line-height:1.6}

.kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.kpi{border:1px solid var(--border);border-radius:14px;padding:12px;background:#fff}
.kpi .t{font-size:12px;color:var(--muted)}
.kpi .v{font-size:16px;font-weight:900;margin-top:6px}

.section{padding:18px 0}

.pricing{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:14px;
  width:100%;
}
.price{padding:18px}
.price .name{font-weight:950}
.price .money{font-size:28px;font-weight:950;margin:8px 0 0}
.price .sub{color:var(--muted);font-size:13px;margin:8px 0 0;line-height:1.45}
.price .features{margin:12px 0 0;padding-left:18px;color:var(--muted);font-size:14px;line-height:1.6}
.price .cta{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.price.featured{
  border:1px solid rgba(37,99,235,.35);
  box-shadow:0 18px 60px rgba(37,99,235,.14);
}

.footer{
  margin-top:28px;
  border-top:1px solid var(--border);
  padding:18px 0;
  color:var(--muted);
}
.footgrid{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footlinks{display:flex;gap:12px;flex-wrap:wrap}
.small{font-size:12px;color:var(--muted)}

.page{padding:26px 0; width:100%}
.page p{color:var(--muted);line-height:1.65}
.page h1{margin:0 0 10px;letter-spacing:-.03em;font-size:40px}
.page h2{margin:18px 0 6px;letter-spacing:-.02em}

.faq{margin-top:14px}
.q{padding:14px;border:1px solid var(--border);border-radius:14px;background:#fff;box-shadow:var(--shadowSm);margin-bottom:10px}
.q b{display:block}
.q span{display:block;color:var(--muted);margin-top:6px;line-height:1.55}

@media (max-width: 980px){
  :root{--h1:44px}
  .hero-grid{grid-template-columns:1fr}
  .grid3,.grid2,.pricing{grid-template-columns:1fr}
}

/* === Verijob: Hero background premium === */
:root{
  --vj-blue:#2563eb;
  --vj-red:#dc2626;
  --vj-ink:#0b1220;
  --vj-bg:#f6f8fc;
}

.hero-bg{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(900px 500px at 75% 10%, rgba(37,99,235,.16), rgba(37,99,235,0) 55%),
    radial-gradient(900px 500px at 90% 40%, rgba(220,38,38,.12), rgba(220,38,38,0) 55%),
    radial-gradient(700px 420px at 10% 20%, rgba(37,99,235,.10), rgba(37,99,235,0) 60%),
    linear-gradient(180deg, #ffffff 0%, var(--vj-bg) 100%);
}

.hero-bg:before{
  content:"";
  position:absolute;
  inset:-1px;
  background:
    radial-gradient(800px 220px at 50% 0%, rgba(2,6,23,.06), rgba(2,6,23,0) 65%);
  pointer-events:none;
}

.hero-bg:after{
  content:"";
  position:absolute;
  left:50%;
  top:-120px;
  width:900px;
  height:900px;
  transform:translateX(-50%);
  background:conic-gradient(from 210deg,
    rgba(37,99,235,.18),
    rgba(220,38,38,.14),
    rgba(37,99,235,.10),
    rgba(220,38,38,.08),
    rgba(37,99,235,.18)
  );
  filter: blur(48px);
  opacity:.35;
  border-radius:999px;
  pointer-events:none;
}

.pricing-section{
  padding:36px 0 46px;
}

.pricing-shell{
  max-width:1080px;
  margin:0 auto;
  border-radius:28px;
  padding:24px 18px 10px;
  background:linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.45));
  border:1px solid rgba(229,231,235,.9);
  box-shadow:0 18px 50px rgba(2,6,23,.07);
}

.pricing-group{
  margin-top:22px;
}

.pricing-group:first-of-type{
  margin-top:8px;
}

.pricing-shell .pricing{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;
  margin-top:16px;
}

.price{
  min-height:100%;
  display:flex;
  flex-direction:column;
}

.price-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.price-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(37,99,235,.24);
  background:rgba(37,99,235,.09);
  color:#1e40af;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
}

.price-main{
  margin-top:10px;
  font-size:32px;
  line-height:1.1;
  letter-spacing:-.02em;
  font-weight:900;
  color:#0b1220;
}

.price-alt{
  margin-top:4px;
  font-size:14px;
  line-height:1.4;
  color:#64748b;
  font-weight:600;
}

.price .sub{
  margin-top:10px;
}

.price .cta{
  margin-top:auto;
  padding-top:14px;
}

.price.featured{
  border:1px solid rgba(37,99,235,.42);
  box-shadow:0 20px 64px rgba(37,99,235,.16);
}

@media (max-width: 980px){
  .pricing-section{
    padding:26px 0 34px;
  }

  .pricing-shell{
    padding:18px 12px 8px;
    border-radius:22px;
  }

  .pricing-shell .pricing{
    gap:14px;
  }

  .price-main{
    font-size:28px;
  }
}

/* === PRICING MARGIN HOTFIX === */
.pricing-section {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}

.pricing-section > .container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}

.pricing-shell {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 28px !important;
  border-radius: 28px !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
  background: rgba(255,255,255,0.55) !important;
  box-sizing: border-box !important;
}

.pricing-shell h2,
.pricing-shell h3 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.pricing,
.pricing-grid,
.pricing-cards,
.plans-grid {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

.pricing > *,
.pricing-grid > *,
.pricing-cards > *,
.plans-grid > * {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.pricing-section .card,
.pricing-section .pricing-card,
.pricing-section .plan-card,
.pricing-section article {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  align-self: stretch !important;
}

.pricing-section .price-main {
  font-size: clamp(2rem, 2.8vw, 3rem) !important;
  line-height: 1.02 !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  margin-bottom: 6px !important;
}

.pricing-section .price-alt,
.pricing-section .price-secondary,
.pricing-section .annual-price,
.pricing-section .price-yearly {
  display: block !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  opacity: 0.72 !important;
  margin-top: 2px !important;
}

.pricing-section .badge,
.pricing-section .popular-badge,
.pricing-section .plan-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
}

.pricing-section .is-popular,
.pricing-section .popular,
.pricing-section .recommended {
  border-width: 1.5px !important;
  box-shadow: 0 14px 34px rgba(59, 91, 246, 0.12) !important;
}

.pricing-section .cta-row,
.pricing-section .plan-actions,
.pricing-section .pricing-actions {
  margin-top: auto !important;
  padding-top: 18px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

.pricing-section p,
.pricing-section li {
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 1024px) {
  .pricing-shell {
    max-width: 100% !important;
    padding: 22px !important;
  }
}

@media (max-width: 640px) {
  .pricing-section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .pricing-section > .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .pricing-shell {
    padding: 16px !important;
    border-radius: 22px !important;
  }

  .pricing,
  .pricing-grid,
  .pricing-cards,
  .plans-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* === INDEX GRID MARGIN FIX === */
.content-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: 12px 0 6px 0;
  box-sizing: border-box;
}

.content-shell > * + * {
  margin-top: 18px;
}

.practical-grid,
.process-grid,
.two-col-grid,
.feature-split,
.feature-grid,
.value-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}

.practical-grid > *,
.process-grid > *,
.two-col-grid > *,
.feature-split > *,
.feature-grid > *,
.value-grid > * {
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.content-shell .card,
.content-shell article,
.content-shell .panel,
.content-shell .feature-card,
.content-shell .value-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 22px !important;
  border-radius: 22px !important;
  box-sizing: border-box !important;
}

.content-shell h2 {
  margin-bottom: 10px !important;
}

.content-shell p,
.content-shell li {
  overflow-wrap: anywhere !important;
}

@media (max-width: 900px) {
  .content-shell {
    max-width: 100%;
  }

  .practical-grid,
  .process-grid,
  .two-col-grid,
  .feature-split,
  .feature-grid,
  .value-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

.content-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: 12px 0 8px 0;
  box-sizing: border-box;
}

.two-col-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
  align-items: stretch;
}

.two-col-grid > * {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.content-shell .card,
.content-shell article,
.content-shell .panel {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .two-col-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}



/* ===== HOME BLOCKS LEGACY (kept minimal for existing sections) ===== */
.vj-home-grid,
.vj-grid{
  display:grid;
  gap:24px;
  width:100%;
  max-width:100%;
  margin-top:16px;
}

.vj-home-grid-3,
.vj-grid-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.vj-home-grid-2,
.vj-grid-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.vj-home-card,
.vj-card,
.vj-shell{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

.vj-card,
.vj-home-card{
  padding:22px;
  border:1px solid #e5e7eb;
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadowSm);
}

/* ===== HOME ALIGNMENT (target 4 blocks) ===== */
.aligned-home-block > .content-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: 12px 0 8px;
  box-sizing: border-box;
}

.aligned-home-block .two-col-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
  align-items: stretch;
}

.aligned-home-block .two-col-grid > * {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.aligned-home-block .card,
.aligned-home-block article,
.aligned-home-block .panel {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

#home-pricing .pricing-shell {
  max-width: 1120px;
  margin: 0 auto;
}

@media (max-width: 900px) {
  .aligned-home-block .two-col-grid,
  .vj-home-grid-3,
  .vj-home-grid-2,
  .vj-grid-3,
  .vj-grid-2 {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}


/* === VERIJOB WEBSITE LAYOUT PATCH 20260308 === */

:root{
  --vj-shell-max: 1180px;
  --vj-shell-narrow: 1080px;
  --vj-gap-xl: 32px;
  --vj-gap-lg: 24px;
  --vj-gap-md: 18px;
  --vj-radius-xl: 22px;
  --vj-radius-lg: 18px;
  --vj-shadow-soft: 0 16px 40px rgba(15, 23, 42, 0.07);
  --vj-shadow-card: 0 10px 26px rgba(15, 23, 42, 0.06);
}

/* Contención global más robusta */
.container{
  width: min(100% - 32px, var(--vj-shell-max));
  margin-inline: auto;
}

@media (min-width: 900px){
  .container{
    width: min(100% - 56px, var(--vj-shell-max));
  }
}

/* Secciones problemáticas */
.aligned-home-block{
  position: relative;
}

.aligned-home-block > .content-shell{
  width: min(100%, var(--vj-shell-narrow));
  margin: 0 auto;
}

.aligned-home-block .two-col-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--vj-gap-xl);
  align-items: stretch;
}

@media (max-width: 900px){
  .aligned-home-block .two-col-grid{
    grid-template-columns: 1fr;
    gap: var(--vj-gap-lg);
  }
}

/* Evita que cualquier card o bloque interno coma márgenes */
.aligned-home-block .two-col-grid > *,
.aligned-home-block > .content-shell > *{
  min-width: 0;
}

.aligned-home-block .card,
.aligned-home-block .panel,
.aligned-home-block .feature-card,
.aligned-home-block .step,
.aligned-home-block .pricing-card{
  width: 100%;
  max-width: 100%;
  border-radius: var(--vj-radius-lg);
  box-shadow: var(--vj-shadow-card);
}

/* Si hay grids internos heredados, que no desborden */
.aligned-home-block .cards,
.aligned-home-block .grid,
.aligned-home-block .pricing-grid,
.aligned-home-block .steps,
.aligned-home-block .features{
  width: 100%;
  max-width: 100%;
}

/* Bloque "Cómo funciona en la práctica" y afines: mejor respiración */
#flow-diagram .content-shell,
#market-problem .content-shell,
#cv-verifiable-block .content-shell,
#home-pricing .content-shell{
  padding-inline: 0;
}

/* Tipografía y anchura de headers de sección */
.section-head,
.section-header,
.aligned-home-block h2,
.aligned-home-block .h2{
  max-width: 18ch;
}

.aligned-home-block p,
.aligned-home-block .p{
  max-width: 62ch;
}

/* Mejora sutil de botones sin romper paleta */
.btn{
  border-radius: 14px;
  transition: transform .14s ease, box-shadow .18s ease, opacity .18s ease;
}

.btn:hover{
  transform: translateY(-1px);
  box-shadow: var(--vj-shadow-card);
}

/* Mejora sutil de cards */
.card,
.panel,
.feature-card,
.pricing-card,
.step{
  overflow: hidden;
}

/* Evita sensación de estiramiento en desktop grande */
.hero,
.section,
.block,
.home-section{
  overflow-x: clip;
}

/* Ajuste fino para pricing si ese bloque usa cards muy anchas */
#home-pricing .pricing-grid,
#home-pricing .cards,
#home-pricing .grid{
  justify-content: center;
}

/* Mobile: más aire lateral */
@media (max-width: 640px){
  .container{
    width: min(100% - 24px, var(--vj-shell-max));
  }

  .aligned-home-block > .content-shell{
    width: 100%;
  }

  .card,
  .panel,
  .feature-card,
  .pricing-card,
  .step{
    border-radius: 16px;
  }
}


/* === VERIJOB WEBSITE SPACING PATCH 20260308B === */

/* 1) Ritmo vertical homogéneo entre bloques del home */
#market-problem,
#cv-verifiable-block,
#flow-diagram,
#home-pricing {
  padding-top: 22px;
  padding-bottom: 22px;
}

#market-problem + #cv-verifiable-block,
#cv-verifiable-block + #flow-diagram,
#flow-diagram + #home-pricing {
  margin-top: 6px;
}

/* 2) Shell interno: mismo espacio entre título y contenido */
#market-problem .content-shell,
#cv-verifiable-block .content-shell,
#flow-diagram .content-shell,
#home-pricing .content-shell {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

/* 3) Títulos: misma separación arriba/abajo */
#market-problem h2,
#cv-verifiable-block h2,
#flow-diagram h2,
#home-pricing h2,
#market-problem .section-title,
#cv-verifiable-block .section-title,
#flow-diagram .section-title,
#home-pricing .section-title,
#market-problem .section-header,
#cv-verifiable-block .section-header,
#flow-diagram .section-header,
#home-pricing .section-header {
  margin-top: 0;
  margin-bottom: 0;
}

/* 4) Grids: mismo gap horizontal y vertical */
#market-problem .grid,
#market-problem .cards,
#market-problem .two-col-grid,
#market-problem .features,
#cv-verifiable-block .grid,
#cv-verifiable-block .cards,
#cv-verifiable-block .two-col-grid,
#cv-verifiable-block .features,
#flow-diagram .grid,
#flow-diagram .cards,
#flow-diagram .steps,
#flow-diagram .two-col-grid,
#home-pricing .grid,
#home-pricing .cards,
#home-pricing .pricing-grid {
  gap: 24px !important;
}

/* 5) Cards: misma respiración y altura visual más consistente */
#market-problem .card,
#market-problem .feature-card,
#market-problem .panel,
#cv-verifiable-block .card,
#cv-verifiable-block .feature-card,
#cv-verifiable-block .panel,
#flow-diagram .card,
#flow-diagram .step,
#flow-diagram .panel,
#home-pricing .card,
#home-pricing .pricing-card,
#home-pricing .panel {
  padding: 24px 22px;
  min-height: 132px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* 6) Titulares dentro de cards */
#market-problem .card h3,
#market-problem .feature-card h3,
#market-problem .panel h3,
#cv-verifiable-block .card h3,
#cv-verifiable-block .feature-card h3,
#cv-verifiable-block .panel h3,
#flow-diagram .card h3,
#flow-diagram .step h3,
#flow-diagram .panel h3,
#home-pricing .card h3,
#home-pricing .pricing-card h3,
#home-pricing .panel h3 {
  margin: 0 0 12px 0;
  line-height: 1.15;
}

/* 7) Párrafos dentro de cards */
#market-problem .card p,
#market-problem .feature-card p,
#market-problem .panel p,
#cv-verifiable-block .card p,
#cv-verifiable-block .feature-card p,
#cv-verifiable-block .panel p,
#flow-diagram .card p,
#flow-diagram .step p,
#flow-diagram .panel p,
#home-pricing .card p,
#home-pricing .pricing-card p,
#home-pricing .panel p {
  margin: 0;
  line-height: 1.3;
  max-width: 30ch;
}

/* 8) “Cómo funciona”: dar más aire arriba para separarlo del bloque anterior */
#flow-diagram {
  margin-top: 10px;
}

/* 9) Mobile: mantener homogeneidad sin aplastar */
@media (max-width: 768px) {
  #market-problem,
  #cv-verifiable-block,
  #flow-diagram,
  #home-pricing {
    padding-top: 18px;
    padding-bottom: 18px;
  }

  #market-problem .content-shell,
  #cv-verifiable-block .content-shell,
  #flow-diagram .content-shell,
  #home-pricing .content-shell {
    gap: 18px;
  }

  #market-problem .card,
  #market-problem .feature-card,
  #market-problem .panel,
  #cv-verifiable-block .card,
  #cv-verifiable-block .feature-card,
  #cv-verifiable-block .panel,
  #flow-diagram .card,
  #flow-diagram .step,
  #flow-diagram .panel,
  #home-pricing .card,
  #home-pricing .pricing-card,
  #home-pricing .panel {
    min-height: auto;
    padding: 20px 18px;
  }
}



/* === VERIJOB CANDIDATE JOURNEY BLOCK 20260308 === */

.candidate-journey-block {
  padding-top: 28px;
  padding-bottom: 28px;
}

.candidate-journey-block > .content-shell {
  width: min(100%, 1240px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.candidate-journey-block .journey-header {
  max-width: 920px;
}

.candidate-journey-block .journey-header h2 {
  margin: 0;
}

.candidate-journey-block .journey-figure {
  margin: 0;
  padding: 0;
  border-radius: 24px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05), 0 2px 10px rgba(15, 23, 42, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.16);
}

.candidate-journey-block .journey-figure img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 900px) {
  .candidate-journey-block {
    padding-top: 22px;
    padding-bottom: 22px;
  }

  .candidate-journey-block > .content-shell {
    gap: 16px;
  }

  .candidate-journey-block .journey-figure {
    border-radius: 18px;
  }
}

@media (max-width: 640px) {
  .candidate-journey-block .journey-figure {
    border-radius: 14px;
  }
}