/* ==========================================================================
   CISO 360 — estilos locales (armonizados con ASM y Argus)
   ========================================================================== */

/* ---------------------------- Hero CISO --------------------------------- */
.hero--ciso .ciso-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 12px;
}
.hero--ciso .ciso-logo img {
  max-width: 140px;
  height: auto;
  border-radius: 50%;
  border: 2px solid #e6ecf3;
  box-shadow: 0 6px 18px rgba(46,74,117,.08);
  background: #fff;
  padding: 6px;
}
.hero--ciso{
  background:
    radial-gradient(600px 400px at 90% -10%, color-mix(in oklab, var(--primary, #2563eb), #ffffff 90%) 10%, transparent 60%),
    linear-gradient(180deg, #f6f9fc, #ffffff);
  border: 1px solid #e6ecf3;
  border-radius: 16px;
  padding: clamp(18px, 4vw, 28px);
  box-shadow: 0 10px 30px rgba(46,74,117,.06);
  margin-top: 10px;
  text-align: center;
}
.hero--ciso h1{ letter-spacing:-0.015em; color:#23324a; }
.hero--ciso p{ margin:.35rem 0 0; color:#46566f; max-width:76ch; margin-left:auto; margin-right:auto; }

/* ------------------------ Tipografía de la página ----------------------- */
.prose p{ color:#46566f; }
.prose h2, .prose h3{ color:#23324a; }
.prose ul li, .prose ol li{ color:#2f3a4f; }

/* ----------------------------- Tarjetas --------------------------------- */
.card{
  background: linear-gradient(180deg, #ffffff, #f9fbff);
  border: 1px solid #e6ecf3;
  border-radius: 14px;
  padding: 12px;
  box-shadow: 0 10px 30px rgba(46,74,117,.08);
}
.card figcaption{ color:#6f7d95; }
.card .icon{ color:var(--primary, #2563eb); margin-bottom:6px; }

/* ---------------------- “Cómo trabajamos” lista ------------------------- */
.prose ol.list{
  list-style:none;
  padding:0;
  margin:0.75rem 0 0;
  display:grid;
  gap:12px;
  counter-reset:step;
}
.prose ol.list > li{
  background:#ffffff;
  color:#2a3448;
  border:1px solid #e6ecf3;
  border-radius:12px;
  padding:14px 16px 14px 46px;
  box-shadow:0 4px 12px rgba(46,74,117,.05);
  position:relative;
  line-height:1.45;
  font-weight:500;
}
.prose ol.list > li *{ color:inherit; }
.prose ol.list > li::marker{ content:""; }
.prose ol.list > li::before{
  content:counter(step);
  counter-increment:step;
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:24px;
  border-radius:50%;
  background:var(--primary, #2563eb);
  color:#fff;
  font-size:.9rem;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 2px 6px rgba(37,99,235,.25);
}
.prose ol.list > li:hover{
  border-color:#d8e3f2;
  box-shadow:0 6px 16px rgba(46,74,117,.08);
}

/* ------------------------- Así te ayudamos ------------------------------ */
.ciso-help{
  background: linear-gradient(180deg, #fff, #f9fbff);
  border:1px solid #e6ecf3;
  border-radius:16px;
  padding:24px 18px;
  box-shadow:0 10px 30px rgba(46,74,117,.06);
  text-align:center;
}
.ciso-help h2{ color:#23324a; margin-bottom:12px; }
.ciso-help p{ color:#46566f; max-width:70ch; margin:0 auto 20px auto; }

.ciso-help-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:20px;
}
.ciso-help-cards .card{
  padding:18px;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.ciso-help-cards .card h3{ color:#23324a; margin:0; }
.ciso-help-cards .card p{ color:#46566f; margin:0; }

/* -------------------------- Entregables 3x3 ----------------------------- */
.ciso-deliverables{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:20px;
}
.ciso-deliverables .card{
  padding:18px;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.ciso-deliverables .card h3{ color:#23324a; margin:0; }
.ciso-deliverables .card p{ color:#46566f; margin:0; }

/* ------------------------------- CTA ------------------------------------ */
.ciso-cta{
  background: linear-gradient(180deg, #fff, #f6f9ff);
  border: 1px solid #e6ecf3;
  border-radius: 16px;
  padding: 18px 16px;
  box-shadow: 0 10px 26px rgba(46,74,117,.06);
  text-align: center;
}
.ciso-cta h2{ color:#23324a; }
.ciso-cta .actions{ justify-content:center; gap:10px; }

/* ------------------------------ Botones --------------------------------- */
.btn.btn-primary{
  background:var(--primary, #2563eb);
  border-color:color-mix(in oklab, var(--primary, #2563eb), #0B1220 10%);
  box-shadow:0 12px 24px rgba(37,99,235,.15);
}
.btn.btn-primary:hover{ background:var(--primary-600, #1D4ED8); text-decoration:none; }
.btn.btn-secondary{ background:#f8fbff; border-color:#dce5f3; }
.btn.btn-secondary:hover{ border-color:var(--primary, #2563eb); color:var(--primary, #2563eb); text-decoration:none; }

/* ------------------------------ Responsive ------------------------------ */
@media (max-width: 1024px){
  .ciso-help-cards{ grid-template-columns:repeat(2,1fr); }
  .ciso-deliverables{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 720px){
  .hero--ciso{ padding:16px; }
  .ciso-cta{ padding:16px; }
  .ciso-help-cards{ grid-template-columns:1fr; }
  .ciso-deliverables{ grid-template-columns:1fr; }
}