/* Dosis Kids — se carga después de /styles.css y /guardia-planner/gp.css */

.dc-soon { opacity: .55; cursor: default; pointer-events: none; }

/* Cómo funciona */
.dc-steps { list-style: none; padding: 0; margin: 48px 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.dc-steps li { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 22px; box-shadow: var(--shadow); }
.dc-step-n { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--teal-soft); color: var(--teal-strong); font-family: var(--mono); font-size: 14px; }
.dc-steps h3 { font-size: 19px; margin: 14px 0 6px; }
.dc-steps p { margin: 0; font-size: 15px; }

.dc-result { display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: center; margin-top: 28px; }
.dc-result-box { background: var(--ink); color: #fff; border-radius: var(--radius); padding: 22px 32px; }
.dc-result-k { margin: 0; font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #2ec4b6; }
.dc-result-v { margin: 4px 0 0; font-family: var(--serif); font-size: 52px; font-weight: 600; line-height: 1; }
.dc-result-v span { font-family: var(--sans); font-size: 18px; font-weight: 500; color: #c9d6e3; }
.dc-result > p { margin: 0; max-width: 34em; }

.dc-features { grid-template-columns: repeat(2, 1fr); }

/* Compra única */
.dc-buy { display: grid; grid-template-columns: 1.4fr 1fr; gap: 32px; margin-top: 40px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; box-shadow: var(--shadow); }
.dc-buy h3 { font-family: var(--serif); font-size: 26px; margin-bottom: 16px; }
.dc-buy ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.dc-buy li { display: flex; gap: 12px; align-items: flex-start; }
.dc-tick { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--teal-soft); display: grid; place-items: center; margin-top: 2px; }
.dc-tick svg { width: 14px; height: 14px; fill: none; stroke: var(--teal-strong); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.dc-buy-price { border-left: 1px solid var(--line); padding-left: 32px; }
.dc-price { margin: 0 0 12px; font-family: var(--serif); font-size: 26px; font-weight: 600; color: var(--teal-strong); }

@media (max-width: 980px) {
  .dc-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .dc-steps, .dc-features, .dc-buy, .dc-result { grid-template-columns: 1fr; }
  .dc-buy { padding: 24px; }
  .dc-buy-price { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: 20px; }
}
.dc-buy .plans-note { color: var(--muted); font-size: 14px; margin: 0; }