.signos-page { width: 100%; max-width: 1060px; margin: 0 auto; padding: 14px 0 26px; }
.signos-hero {
  padding: clamp(16px, 4vw, 42px); border: 1px solid #557f78; border-radius: 22px;
  background: radial-gradient(ellipse at top right, #396b5d, #1e393c 65%);
}
.signos-kicker { color: #bdeed6; font-size: 13px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.signos-hero h2 { margin: 6px 0 8px; font-size: clamp(30px, 6vw, 50px); line-height: 1.05; }
.signos-hero > p:not(.signos-kicker) { max-width: 64ch; color: #eef8f3; line-height: 1.5; }
.signos-steps { display: flex; flex-wrap: wrap; gap: 7px; list-style: none; margin-top: 15px; }
.signos-steps li { display: flex; align-items: center; gap: 6px; padding: 5px 9px 5px 5px; border-radius: 99px; background: #c7efdb; color: #203e37; font-size: 13px; font-weight: 700; }
.signos-steps span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #285d50; color: #fff; }
.signos-heading { margin: 18px 0 10px; }
.signos-heading h2 { font-size: clamp(22px, 4vw, 27px); }
.signos-heading p { color: #c7d9e6; font-size: 14px; margin-top: 4px; }
.signos-lessons { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 263px), 1fr)); gap: 12px; align-items: start; }
.signos-lesson {
  --lesson-accent: #f4d991;
  display: grid; gap: 7px; padding: 13px; border: 1px solid #d4c399; border-top: 4px solid var(--lesson-accent);
  border-radius: 17px; background: #fff7e7; color: #293d38;
}
.signos-lesson:nth-child(3n + 2) { --lesson-accent: #cbd5f7; }
.signos-lesson:nth-child(3n + 3) { --lesson-accent: #b8dfc2; }
.signos-lesson header { padding: 0; border: 0; gap: 9px; flex-wrap: nowrap; background: none; }
.signos-lesson h3 { font-size: 19px; line-height: 1.2; }
.signos-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 42px; border-radius: 12px; background: var(--lesson-accent); font-size: 24px; }
.signos-model, .signos-lesson summary { min-height: 44px; border-radius: 10px; font-weight: 750; }
.signos-model { display: flex; align-items: center; justify-content: center; padding: 7px; background: #2d6156; color: white; text-decoration: none; }
.signos-model:hover { background: #204b41; text-decoration: underline; }
.signos-lesson summary { align-content: center; padding: 4px 8px; background: #f2e8cc; cursor: pointer; }
.signos-lesson details p { padding: 6px 5px; font-size: 15px; line-height: 1.45; }
.signos-note { margin-top: 14px; padding: 11px 13px; border-radius: 12px; background: #233b4a; color: #e4f2f3; line-height: 1.45; }
@media (prefers-reduced-motion: no-preference) {
  .signos-icon { transition: transform .2s ease; }
  .signos-lesson:focus-within .signos-icon, .signos-lesson:hover .signos-icon { transform: rotate(-7deg); }
  .signos-lesson details[open] p { animation: signos-reveal .24s ease-out; }
  @keyframes signos-reveal { from { opacity: .6; transform: translateY(-4px); } }
}