[hidden] {
  display: none !important;
}

.profile-cards {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.profile-card {
  background: #ffffff;
  border: 1px solid #d7e5f4;
  border-radius: 12px;
  cursor: pointer;
  display: grid;
  gap: 7px;
  min-height: 118px;
  padding: 16px;
  text-align: left;
}

.profile-card.active {
  background: #f1f7fd;
  border-color: #9bb9d8;
  box-shadow: inset 0 0 0 1px rgba(51,102,153,.08), 0 12px 22px rgba(31, 41, 55, 0.07);
}

.profile-card span {
  color: #60738c;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.profile-card strong {
  color: #14243a;
  font-size: 32px;
  line-height: 1;
}

.profile-card em {
  color: var(--primary-dark);
  font-style: normal;
  font-weight: 900;
}

.filters {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) 260px 150px;
}

.filters label {
  color: #14243a;
  display: grid;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
}

.filters input,
.filters select {
  background: #ffffff;
  border: 1px solid #d7e0eb;
  border-radius: 8px;
  color: var(--text);
  min-height: 46px;
  min-width: 0;
  padding: 0 13px;
  width: 100%;
}

.filters button {
  align-self: end;
  background: #ffffff;
  border: 1px solid #cbd9e8;
  border-radius: 8px;
  color: var(--primary-dark);
  cursor: pointer;
  font-weight: 900;
  min-height: 46px;
}

.list,
.updates-grid,
.report-table {
  display: grid;
  gap: 14px;
}

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

.item-card,
.update-card,
.report-row {
  background: #f8fbff;
  border: 1px solid #dce8f4;
  border-radius: 8px;
  display: grid;
  gap: 14px;
  padding: 14px;
}

.update-card img {
  aspect-ratio: 16 / 9;
  background: #eef5fc;
  border: 1px solid #cfe0f2;
  border-radius: 8px;
  object-fit: contain;
  padding: 8px;
  width: 100%;
}

.count-pill {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: var(--primary-dark);
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  min-height: 38px;
  padding: 0 14px;
  white-space: nowrap;
}

.manual-button {
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  border: 1px solid #d7e5f4;
  border-left: 4px solid transparent;
  border-radius: 12px;
  cursor: pointer;
  display: grid;
  gap: 7px;
  padding: 14px;
  text-align: left;
  width: 100%;
}

.manual-button.active {
  background: #f1f7fd;
  border-color: #9bb9d8;
  border-left-color: var(--primary);
}

.doc-box {
  color: #1f2937;
  display: grid;
  gap: 12px;
  font-size: 15px;
  line-height: 1.65;
}

.doc-info {
  background: linear-gradient(90deg, #eef4ff, #f7faff);
  border-left: 5px solid #2f5b89;
  border-radius: 8px;
  padding: 12px 14px;
}

.doc-note {
  background: linear-gradient(90deg, #eaf8ee, #f4fff6);
  border-left: 5px solid #28a745;
  border-radius: 8px;
  padding: 12px 14px;
}

.floating-chat {
  display: none;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: auto;
  max-height: min(520px, calc(100vh - 128px));
  min-height: 0;
}

.floating-chat.open {
  display: grid;
}

.floating-chat.open ~ .floating-chat-launcher {
  display: none;
}

.floating-chat.chat-positioned {
  bottom: auto;
  right: auto;
}

.floating-chat-header {
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.floating-chat.chat-dragging .floating-chat-header {
  cursor: grabbing;
}

.floating-chat-header {
  align-items: center;
  background: linear-gradient(135deg, var(--primary-dark), var(--primary));
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  padding: 15px 16px;
}

.floating-chat-header strong {
  color: #ffffff;
  font-size: 15px;
}

.floating-chat-header button {
  align-items: center;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 22px;
  height: 34px;
  justify-content: center;
  line-height: 1;
  min-height: 34px;
  padding: 0;
  width: 34px;
}

.floating-chat .chat-messages {
  background: linear-gradient(180deg, #f8fbff, #ffffff);
  display: grid;
  gap: 10px;
  max-height: 330px;
  min-height: 180px;
  overflow: auto;
  padding: 16px;
}

.floating-chat .chat-messages p {
  background: #ffffff;
  border: 1px solid #d9e6f3;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(31, 41, 55, 0.05);
  color: #25415f;
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
  max-width: 88%;
  padding: 12px 14px;
  white-space: pre-line;
}

.floating-chat .chat-messages .user {
  background: var(--primary);
  border-color: var(--primary);
  color: #ffffff;
  justify-self: end;
}

.floating-chat .chat-messages .assistant {
  justify-self: start;
}

.chat-profile-options {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.chat-profile-options button {
  background: #eef6ff;
  border: 1px solid #c8d9eb;
  border-radius: 999px;
  color: var(--primary-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  min-height: 32px;
  padding: 0 10px;
}

.chat-profile-options button:hover,
.chat-profile-options button:focus-visible,
.chat-profile-options button.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #ffffff;
}

.chat-contact-card {
  background: #ffffff;
  border: 1px solid #d8e2dc;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(17, 40, 36, .08);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  max-width: 100%;
  padding: 14px;
}

.chat-contact-heading {
  background: linear-gradient(135deg, #f0fbf6, #ffffff);
  border-left: 3px solid #128c7e;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  grid-column: 1 / -1;
  margin-bottom: 2px;
  padding: 9px 10px;
}

.chat-contact-heading strong {
  color: #17324d;
  font-size: 16px;
}

.chat-contact-heading span,
.chat-contact-card small {
  color: #61758c;
  font-size: 11px;
  line-height: 1.35;
}

.chat-contact-card label {
  color: #35536d;
  display: grid;
  font-size: 11px;
  font-weight: 700;
  gap: 4px;
}

.chat-contact-school-field,
.chat-contact-submit,
.chat-contact-note {
  grid-column: 1 / -1;
}

.chat-contact-card input,
.chat-contact-card select {
  background: #fbfdfd;
  border: 1px solid #cbd9d4;
  border-radius: 7px;
  color: #1f2d2a;
  font: inherit;
  min-height: 38px;
  padding: 7px 9px;
  width: 100%;
}

.chat-contact-card input:focus,
.chat-contact-card select:focus {
  border-color: #128c7e;
  box-shadow: 0 0 0 3px rgba(18, 140, 126, .12);
  outline: 0;
}

.chat-contact-submit {
  background: #128c7e;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 40px;
  padding: 0 14px;
}

.chat-contact-submit:hover,
.chat-contact-submit:focus-visible {
  background: #075e54;
}

#chatContactStart.chat-contact-after-answer {
  display: block;
  padding-top: 4px;
}

#chatContactStart.chat-contact-after-answer .chat-contact-card {
  border-color: #a8ddcb;
  box-shadow: 0 8px 20px rgba(18, 140, 126, .12);
}

#chatContactStart.chat-contact-after-answer .chat-contact-heading {
  background: linear-gradient(135deg, #e9fbf4, #ffffff);
}

.chat-contact-returning {
  gap: 10px;
}

.chat-contact-summary {
  background: #f4faf7;
  border: 1px solid #d8eee3;
  border-radius: 8px;
  color: #35536d;
  display: grid;
  font-size: 11px;
  gap: 3px;
  padding: 8px 9px;
}

.chat-contact-summary b {
  color: #075e54;
}

.chat-contact-returning p {
  color: #35536d;
  font-size: 12px;
  line-height: 1.35;
  margin: 0;
}

.chat-ticket-card {
  background: linear-gradient(180deg, #f8fbff, #ffffff);
  border: 1px solid #c8d9eb;
  border-left: 5px solid var(--accent);
  border-radius: 12px;
  display: grid;
  gap: 7px;
  margin-top: 10px;
  padding: 12px;
}

.chat-ticket-card strong {
  color: #17324d;
}

.chat-ticket-card span {
  color: #536981;
  font-size: 13px;
}

.chat-support-card {
  border-left-color: #16825d;
  gap: 10px;
  padding: 14px;
}

.chat-support-card strong {
  font-size: 14px;
}

.chat-support-card .chat-support-note {
  line-height: 1.45;
}

.chat-ticket-card a,
.chat-ticket-card button {
  align-items: center;
  background: #24966d;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  text-decoration: none;
  width: fit-content;
}

.chat-support-card a.chat-support-action {
  background: #16825d;
  font-size: 14px;
  min-height: 46px;
  padding: 0 16px;
  width: 100%;
}

.chat-ticket-card a:hover,
.chat-ticket-card a:focus-visible,
.chat-ticket-card button:hover,
.chat-ticket-card button:focus-visible {
  background: #1f7f5d;
}

.chat-tutorial-card {
  background: linear-gradient(180deg, #f8fbff, #ffffff);
  border: 1px solid #c8d9eb;
  border-left: 5px solid #2f5b89;
  border-radius: 12px;
  display: grid;
  gap: 9px;
  margin-top: 10px;
  padding: 13px;
  white-space: normal;
}

.chat-tutorial-card > strong,
.chat-tutorial-card > span {
  display: block;
}

.chat-tutorial-badge {
  background: #fff7d6;
  border: 1px solid #f7c948;
  border-radius: 999px;
  color: #9a6700;
  font-size: 11px;
  font-weight: 900;
  justify-self: start;
  letter-spacing: .02em;
  padding: 4px 9px;
}

.chat-tutorial-title {
  color: #17324d;
  font-size: 16px;
}

.chat-tutorial-route {
  color: #536981;
  font-size: 12px;
  line-height: 1.45;
}

.chat-tutorial-route b,
.chat-tutorial-info b,
.chat-tutorial-steps > b,
.chat-tutorial-important > b {
  color: #2f5b89;
}

.chat-tutorial-info,
.chat-tutorial-steps,
.chat-tutorial-important,
.chat-tutorial-note {
  border-radius: 9px;
  padding: 10px 11px;
}

.chat-tutorial-info {
  background: #f3f8ff;
  border-left: 4px solid #2f5b89;
  color: #425873;
  display: grid !important;
  gap: 4px;
  font-size: 12px;
  line-height: 1.45;
}

.chat-tutorial-steps {
  background: #ffffff;
  border: 1px solid #dce9f6;
  color: #425873;
  font-size: 12px;
  line-height: 1.45;
}

.chat-tutorial-steps ol,
.chat-tutorial-important ul {
  margin: 6px 0 0 18px;
  padding: 0;
}

.chat-tutorial-steps li,
.chat-tutorial-important li {
  margin: 4px 0;
}

.chat-tutorial-important {
  background: #fff8ed;
  border-left: 4px solid #f59e0b;
  color: #7c4a03;
  font-size: 12px;
  line-height: 1.45;
}

.chat-tutorial-important > b {
  color: #b45309;
}

.chat-tutorial-note {
  background: #f0fbf4;
  border-left: 4px solid #28a745;
  color: #356047;
  font-size: 12px;
  line-height: 1.45;
}

.chat-tutorial-video {
  align-items: center;
  background: #e21b23;
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .16);
  color: #ffffff;
  display: inline-flex !important;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  justify-content: center;
  min-height: 34px;
  padding: 0 13px;
  text-decoration: none;
  width: fit-content;
}

.chat-tutorial-video:hover,
.chat-tutorial-video:focus-visible {
  background: #b91c1c;
}

.chat-rating-card {
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  border: 1px solid #c8d9eb;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(31, 74, 112, .08);
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 12px;
}

.chat-rating-card strong {
  color: #17324d;
  font-size: 14px;
}

.chat-rating-card > span:not(.chat-star-rating),
.chat-rating-card em {
  color: #536981;
  font-size: 12px;
  font-style: normal;
}

.chat-star-rating {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.chat-star-rating button {
  align-items: center;
  background: #fff8e6;
  border: 1px solid #f4d27a;
  border-radius: 12px;
  color: #9a6a00;
  cursor: pointer;
  display: grid;
  gap: 2px;
  justify-items: center;
  min-height: 54px;
  padding: 7px 4px;
}

.chat-star-rating button span {
  color: #f0ad00;
  display: block;
  font-size: 11px;
  letter-spacing: 0;
  line-height: 1;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
}

.chat-star-rating button small {
  color: #5d4600;
  font-size: 11px;
  font-weight: 900;
}

.chat-star-rating button:hover,
.chat-star-rating button:focus-visible {
  background: #ffefbd;
  border-color: #e3aa19;
  transform: translateY(-1px);
}

.chat-star-rating button:disabled {
  cursor: default;
  opacity: .65;
  transform: none;
}

.floating-chat .chat-form {
  background: #ffffff;
  border-top: 1px solid var(--line);
  display: block;
  padding: 12px;
}

.floating-chat .chat-form div {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 46px;
}

.floating-chat .chat-form input {
  border: 1px solid #d7e0eb;
  border-radius: 999px;
  color: var(--text);
  height: 46px;
  min-height: 46px;
  min-width: 0;
  padding: 0 16px;
  width: 100%;
}

.floating-chat .chat-form button {
  align-items: center;
  background: #128c7e;
  border: 0;
  border-radius: 50%;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 16px;
  font-weight: 900;
  height: 46px;
  justify-content: center;
  line-height: 1;
  min-height: 46px;
  padding: 0;
  width: 46px;
}

.floating-chat .chat-form.is-whatsapp-locked {
  opacity: .78;
}

.floating-chat .chat-form.is-whatsapp-locked input,
.floating-chat .chat-form.is-whatsapp-locked button {
  background: #eef3f7;
  color: #7890a4;
  cursor: not-allowed;
}

.floating-chat .chat-form.is-whatsapp-locked button {
  border: 1px solid #cbd5df;
}

.chat-tabs {
  background: #f7fbff;
  border-bottom: 1px solid #d8e6f5;
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 8px 10px;
}

.chat-tabs button {
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #24496d;
  cursor: pointer;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 900;
  min-height: 30px;
  padding: 0 11px;
}

.chat-tabs button.active {
  background: #0f6fae;
  border-color: #0f6fae;
  color: #ffffff;
}

.chat-panels {
  background: linear-gradient(180deg, #f7fbff, #ffffff);
  min-height: 0;
  overflow: hidden;
}

.chat-panel {
  display: none;
  height: 100%;
  min-height: 0;
  overflow: auto;
  padding: 14px;
}

.chat-panel.active {
  display: block;
}

.chat-panel-support.active {
  display: grid;
  padding: 0;
}

.chat-panel-back {
  align-items: center;
  background: transparent;
  border: 0;
  color: #23608f;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  margin: 0 0 9px;
  padding: 0;
}

.chat-profile-summary,
.chat-empty,
.chat-panel-heading {
  background: #ffffff;
  border: 1px solid #d9e6f3;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(31, 74, 112, .05);
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
  padding: 10px 12px;
}

.chat-home-hero {
  background:
    radial-gradient(circle at 88% 8%, rgba(255, 255, 255, .28) 0 34px, transparent 35px),
    linear-gradient(135deg, #0b6d91 0%, #118b7d 100%);
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 16px;
  box-shadow: 0 16px 32px rgba(7, 94, 84, .18);
  color: #ffffff;
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
  padding: 12px 15px;
  position: relative;
}

.chat-hero-icon {
  align-items: center;
  background: rgba(255, 255, 255, .18);
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 12px;
  display: inline-flex;
  height: 34px;
  justify-content: center;
  margin-bottom: 1px;
  width: 34px;
}

.chat-hero-icon svg,
.chat-home-search svg,
.chat-home-actions i svg {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 18px;
}

.chat-home-eyebrow,
.chat-profile-summary span,
.chat-panel-heading span,
.chat-help-result span,
.chat-news-card span,
.chat-news-card small {
  color: #58708a;
  font-size: 11px;
  font-weight: 800;
}

.chat-home-hero .chat-home-eyebrow {
  color: rgba(255, 255, 255, .82);
  font-size: 11px;
  text-transform: uppercase;
}

.chat-home-hero strong {
  color: #ffffff;
  font-size: 17px;
  line-height: 1.18;
}

.chat-home-hero p {
  color: rgba(255, 255, 255, .86);
  font-size: 12px;
  line-height: 1.28;
  margin: 0;
  max-width: 34ch;
}

.chat-profile-summary strong,
.chat-panel-heading strong,
.chat-empty strong {
  color: #102b46;
  font-size: 15px;
}

.chat-empty p {
  color: #506a84;
  font-size: 12px;
  line-height: 1.38;
  margin: 0;
}

.chat-home-search {
  align-items: center;
  background: #ffffff;
  border: 1px solid #b9d7ef;
  border-radius: 999px;
  box-shadow: 0 10px 20px rgba(31, 74, 112, .08);
  color: #31506d;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 9px;
  margin-bottom: 9px;
  min-height: 42px;
  padding: 0 13px;
  text-align: left;
  width: 100%;
}

.chat-home-search span {
  align-items: center;
  background: #eaf5ff;
  border-radius: 50%;
  color: #0f6fae;
  display: inline-flex;
  flex: 0 0 auto;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.chat-profile-summary {
  align-items: center;
  grid-template-columns: 1fr;
  padding: 10px 12px 11px;
}

.chat-profile-summary .chat-profile-options {
  gap: 6px;
  justify-content: flex-start;
  margin-top: 2px;
}

.chat-profile-summary > div:first-child {
  align-items: baseline;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.chat-profile-summary > div:first-child strong {
  font-size: 14px;
  text-align: right;
}

.chat-home-actions {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 9px;
}

.chat-home-actions button,
.chat-recent button,
.chat-help-result {
  background: #ffffff;
  border: 1px solid #d4e4f4;
  border-radius: 12px;
  color: #17324d;
  cursor: pointer;
  display: grid;
  gap: 3px;
  min-height: 86px;
  padding: 10px;
  text-align: left;
  width: 100%;
}

.chat-home-actions button i {
  align-items: center;
  background: #e8f5ff;
  border-radius: 12px;
  color: #0f6fae;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  margin-bottom: 3px;
  width: 30px;
}

.chat-home-actions button:nth-child(2) i {
  background: #fff7da;
  color: #997100;
}

.chat-home-actions button:nth-child(3) i {
  background: #e9f8ef;
  color: #08765a;
}

.chat-home-actions button strong {
  font-size: 13px;
  line-height: 1.15;
}

.chat-home-actions button:hover,
.chat-home-actions button:focus-visible,
.chat-recent button:hover,
.chat-recent button:focus-visible,
.chat-help-result:hover,
.chat-help-result:focus-visible {
  border-color: #7fb7e8;
  box-shadow: 0 10px 24px rgba(21, 102, 170, .12);
}

.chat-home-actions span,
.chat-recent span {
  color: #607891;
  font-size: 11px;
  line-height: 1.25;
}

.chat-recent {
  display: grid;
  gap: 7px;
}

.chat-recent > strong {
  color: #24496d;
  font-size: 12px;
}

.chat-recent p {
  color: #607891;
  font-size: 12px;
  margin: 0;
}

.chat-search {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}

.chat-search span {
  color: #17324d;
  font-size: 12px;
  font-weight: 900;
}

.chat-search input {
  border: 1px solid #cdddec;
  border-radius: 14px;
  color: #17324d;
  min-height: 42px;
  padding: 0 12px;
}

.chat-panel-results,
.chat-news-list {
  display: grid;
  gap: 8px;
}

.chat-help-navigation {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.chat-help-navigation .chat-panel-back {
  margin-bottom: 1px;
}

.chat-help-profile-picker {
  display: grid;
  gap: 10px;
}

.chat-help-profile-intro {
  background: linear-gradient(135deg, #edf8ff, #ffffff);
  border: 1px solid #cfe4f7;
  border-radius: 13px;
  display: grid;
  gap: 4px;
  padding: 13px;
}

.chat-help-profile-intro > span {
  color: #15716b;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
}

.chat-help-profile-intro strong {
  color: #133654;
  font-size: 15px;
}

.chat-help-profile-intro p,
.chat-help-profile-current {
  color: #526d87;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}

.chat-help-profile-options {
  display: grid;
  gap: 8px;
}

.chat-help-profile-option {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe1f0;
  border-radius: 13px;
  color: #17324d;
  cursor: pointer;
  display: grid;
  gap: 10px;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  padding: 11px;
  text-align: left;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.chat-help-profile-option > i {
  align-items: center;
  background: #e9f5ff;
  border: 1px solid #beddfa;
  border-radius: 10px;
  color: #0b619e;
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 950;
  height: 34px;
  justify-content: center;
  width: 34px;
}

.chat-help-profile-option > span {
  display: grid;
  gap: 3px;
}

.chat-help-profile-option strong {
  color: #17324d;
  font-size: 12px;
}

.chat-help-profile-option small {
  color: #607891;
  font-size: 10px;
  line-height: 1.32;
}

.chat-help-profile-option em {
  background: #effaf5;
  border: 1px solid #bfe7d5;
  border-radius: 999px;
  color: #147254;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  padding: 5px 7px;
  white-space: nowrap;
}

.chat-help-profile-option:hover,
.chat-help-profile-option:focus-visible {
  border-color: #4da6d9;
  box-shadow: 0 9px 19px rgba(19, 103, 163, .13);
  outline: 0;
  transform: translateY(-1px);
}

.chat-empty-action button,
.chat-secondary-action,
.chat-rating-panel button,
.chat-news-card button {
  background: #eaf5ff;
  border: 1px solid #b8dcfa;
  border-radius: 999px;
  color: #075e9d;
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
  padding: 0 12px;
  width: fit-content;
}

.chat-news-card {
  background: #ffffff;
  border: 1px solid #d4e4f4;
  border-radius: 14px;
  display: grid;
  gap: 10px;
  grid-template-columns: 86px minmax(0, 1fr);
  padding: 10px;
}

.chat-news-card img,
.chat-news-placeholder {
  align-items: center;
  aspect-ratio: 1 / .78;
  background: #e9f3fc;
  border: 1px solid #c8ddf0;
  border-radius: 10px;
  color: #24496d;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-content: center;
  object-fit: cover;
  width: 86px;
}

.chat-news-card div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.chat-news-card strong {
  color: #102b46;
  font-size: 13px;
  line-height: 1.2;
}

.chat-news-card button {
  margin-top: 4px;
}

.chat-rating-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.floating-chat .chat-form[hidden] {
  display: none;
}

.floating-chat {
  border-color: #b7e6cf;
  border-radius: 18px;
  box-shadow: 0 26px 80px rgba(7, 94, 84, .24);
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: min(700px, calc(100vh - 32px));
  max-height: calc(100vh - 32px);
  width: min(560px, calc(100vw - 24px));
}

.floating-chat-header {
  background: linear-gradient(135deg, #075e54 0%, #128c7e 100%);
  gap: 12px;
  min-height: 58px;
  padding: 10px 14px 10px 16px;
}

.chat-header-title {
  align-items: center;
  display: inline-flex;
  flex: 1 1 auto;
  gap: 0;
  min-width: 0;
}

.chat-status-dot {
  display: none;
}

/* Restauracion visual del inicio aprobado. */
.client-masthead.help-hero {
  margin-bottom: 16px;
}

.help-hero > div:first-child {
  background:
    radial-gradient(circle at 73% 18%, rgba(115, 194, 255, .42), transparent 23%),
    radial-gradient(circle at 50% 80%, rgba(0, 65, 130, .35), transparent 32%),
    linear-gradient(115deg, #064a8d 0%, #0f69ad 48%, #1e92df 100%);
  border-radius: 12px;
  box-shadow: 0 16px 34px rgba(18, 74, 127, .22);
  min-height: 156px;
  overflow: hidden;
  padding: 26px 34px;
  position: relative;
}

.help-hero > div:first-child::before,
.help-hero > div:first-child::after {
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  content: "";
  pointer-events: none;
  position: absolute;
}

.help-hero > div:first-child::before {
  height: 220px;
  right: 190px;
  top: -110px;
  width: 220px;
}

.help-hero > div:first-child::after {
  bottom: -140px;
  height: 280px;
  right: -80px;
  width: 280px;
}

.help-hero-shell {
  align-items: center;
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(280px, 1.05fr) minmax(250px, .9fr) minmax(150px, .35fr);
}

.help-hero-copy,
.help-hero-visual,
.help-hero-tagline {
  position: relative;
  z-index: 1;
}

.help-hero-copy {
  display: grid;
  gap: 8px;
}

.help-hero-kicker {
  align-items: center;
  color: #ffffff;
  display: inline-flex;
  font-size: 15px;
  font-weight: 800;
  gap: 8px;
}

.help-hero-kicker i {
  background: #ffc20a;
  border-radius: 999px;
  display: inline-block;
  height: 6px;
  width: 28px;
}

.help-hero-kicker i + i {
  margin-left: -20px;
  margin-top: 14px;
  width: 18px;
}

.help-hero h1 {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: clamp(34px, 4vw, 54px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.02;
  margin: 0 0 10px;
}

.help-hero p {
  font-size: clamp(15px, 1.5vw, 18px);
  font-weight: 500;
  line-height: 1.45;
  max-width: 520px;
}

.help-hero-visual {
  min-height: 128px;
}

.hero-device {
  bottom: 4px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
  width: min(280px, 100%);
}

.hero-device-screen {
  align-items: center;
  background: linear-gradient(180deg, #ffffff, #dfeeff);
  border: 7px solid rgba(255, 255, 255, .72);
  border-radius: 16px;
  box-shadow: 0 18px 34px rgba(0, 37, 82, .28);
  display: flex;
  height: 110px;
  justify-content: center;
  padding: 16px;
}

.hero-device-screen img {
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
  max-width: 170px;
  width: 78%;
}

.hero-device-base {
  background: rgba(255, 255, 255, .84);
  border-radius: 0 0 16px 16px;
  display: block;
  height: 10px;
  margin: 0 auto;
  width: 72%;
}

.hero-bulb,
.hero-play,
.hero-note,
.hero-question {
  align-items: center;
  border-radius: 18px;
  box-shadow: 0 12px 24px rgba(0, 46, 98, .2);
  display: inline-flex;
  justify-content: center;
  position: absolute;
}

.hero-bulb {
  background: #ffd84f;
  color: #935a00;
  height: 60px;
  left: 18%;
  top: -6px;
  width: 60px;
}

.hero-play {
  background: #2787f5;
  color: #ffffff;
  height: 58px;
  right: 13%;
  top: 0;
  width: 58px;
}

.hero-note {
  background: #ffffff;
  color: #1d6faa;
  height: 58px;
  right: 2%;
  top: 66px;
  width: 58px;
}

.hero-question {
  background: #3f9df1;
  color: #ffffff;
  font-size: 32px;
  font-weight: 900;
  height: 58px;
  left: 70%;
  top: 80px;
  width: 58px;
}

.hero-bulb svg,
.hero-play svg,
.hero-note svg {
  fill: none;
  height: 30px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
  width: 30px;
}

.help-hero-tagline {
  color: #ffffff;
  font-size: clamp(22px, 2.5vw, 34px);
  font-style: italic;
  font-weight: 800;
  line-height: 1.02;
  text-align: right;
  text-shadow: 0 8px 16px rgba(0, 35, 75, .22);
}

.help-hero-tagline span {
  display: block;
}

.help-hero-tagline::after {
  background: #ffc20a;
  border-radius: 999px;
  content: "";
  display: block;
  height: 5px;
  margin: 12px 0 0 auto;
  transform: rotate(-13deg);
  width: 110px;
}

.quick-grid {
  align-items: stretch;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  justify-content: stretch;
}

.quick-card {
  align-content: start;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border-color: #e1eaf3;
  border-radius: 10px;
  box-shadow: 0 12px 26px rgba(31, 41, 55, .055);
  justify-items: start;
  min-height: 168px;
  min-width: 0;
  padding: 18px 18px 16px;
  text-align: left;
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease, transform .28s ease;
}

.quick-card-icon {
  border: 0;
  height: 52px;
  margin-bottom: 10px;
  width: 52px;
}

.quick-card-icon svg {
  height: 27px;
  width: 27px;
}

.quick-card strong {
  font-size: clamp(15px, 1.2vw, 17px);
  font-weight: 900;
  line-height: 1.2;
  margin-bottom: 4px;
}

.quick-card small {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.38;
  min-height: 50px;
}

.quick-card em {
  color: #006ddb;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  margin-top: 10px;
}

.quick-card[data-view="manual"] .quick-card-icon {
  background: #d9efff;
  color: #09649f;
}

.quick-card[data-view="videos"] .quick-card-icon {
  background: #d9c8ff;
  color: #5a35b5;
}

.quick-card[data-view="novedades"] .quick-card-icon {
  background: #ffd963;
  color: #7b5700;
}

.quick-card[data-view="preguntas"] .quick-card-icon {
  background: #9df1c7;
  color: #08744c;
}

.quick-card[data-view="herramientas"] .quick-card-icon {
  background: #ffb5b7;
  color: #8b232b;
}

.quick-card:hover,
.quick-card:focus-visible {
  background: linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%);
  border-color: #8fb4d7;
  box-shadow: 0 24px 46px rgba(37, 79, 120, .15);
  transform: translateY(-7px);
}

.home-updates {
  background: linear-gradient(180deg, #f6fbff 0%, #ffffff 100%);
  border-color: #cfe3f8;
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(31, 74, 112, .08);
  overflow: hidden;
  padding: 0;
  position: relative;
}

.home-updates::before {
  background: linear-gradient(90deg, #ffc20a, #2f6fa8 38%, #4d8acc);
  content: "";
  height: 4px;
  inset: 0 0 auto;
  position: absolute;
}

.home-updates .section-heading {
  align-items: center;
  border-bottom: 1px solid #dbe7f3;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px 24px 14px;
}

.home-updates-title {
  align-items: center;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.home-updates-title-icon {
  align-items: center;
  background: #e8f5ff;
  border: 1px solid #bfddf6;
  border-radius: 14px;
  color: #1684e5;
  display: inline-flex;
  flex: 0 0 40px;
  height: 40px;
  justify-content: center;
  transform: rotate(-10deg);
  width: 40px;
}

.home-updates-title-icon svg {
  fill: none;
  height: 25px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 25px;
}

.home-updates .section-heading h2 {
  color: #102a43;
  font-size: clamp(19px, 1.6vw, 24px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.1;
  margin-bottom: 4px;
}

.home-updates .section-heading p {
  color: #53677f;
  font-size: 12px;
  line-height: 1.35;
  margin: 0;
  max-width: 560px;
}

.home-updates-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.home-updates-count {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #255783;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
  padding: 0 12px;
}

.home-updates .updates-preview-grid {
  align-items: stretch;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(260px, 1.08fr) repeat(3, minmax(210px, 1fr));
  padding: 14px 22px 20px;
}

.home-updates .updates-preview-list {
  display: contents;
}

.home-updates .public-update-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%);
  border: 1px solid #cfe3f8;
  border-radius: 14px;
  box-shadow: 0 14px 28px rgba(31, 74, 112, .07);
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 190px;
  padding: 16px 16px 14px;
  position: relative;
}

.home-updates .public-update-card::before {
  display: none;
}

.home-updates .public-update-card:hover,
.home-updates .public-update-card:focus-within {
  border-color: #9fc2e4;
  box-shadow: 0 22px 42px rgba(37, 79, 120, .14);
  transform: translateY(-3px);
}

.home-update-card-head {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 2px;
}

.home-update-icon {
  align-items: center;
  background: linear-gradient(135deg, #3293ff, #1374e6);
  border-radius: 999px;
  box-shadow: 0 10px 20px rgba(19, 116, 230, .2);
  color: #ffffff;
  display: inline-flex;
  flex: 0 0 42px;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.home-update-icon svg {
  fill: none;
  height: 22px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 22px;
}

.home-update-status {
  background: #e8f3ff;
  border-radius: 999px;
  color: #3281d9;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 9px;
  text-transform: uppercase;
}

.home-updates .public-update-card h3 {
  color: #102a43;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.12;
  margin: 2px 0 0;
}

.home-updates .public-update-card .route {
  color: #0f5fae;
  display: -webkit-box;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.35;
  margin: 0;
  overflow: hidden;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home-updates .public-update-card p:not(.route),
.home-updates .public-update-card .rich-update-description {
  color: #53677f;
  font-size: 12px;
  line-height: 1.42;
}

.home-updates .update-card-actions {
  margin-top: auto;
}

.home-updates .update-card-actions button {
  background: #eaf6ff;
  border-color: #bfdef8;
  color: #0f5fae;
  font-size: 12px;
  min-height: 34px;
  padding: 8px 13px;
}

.home-whatsapp-callout {
  align-items: stretch;
  background:
    radial-gradient(circle at 88% 18%, rgba(255, 210, 72, .48) 0 4px, transparent 5px),
    radial-gradient(circle at 94% 28%, rgba(255, 210, 72, .58) 0 3px, transparent 4px),
    linear-gradient(135deg, #e0fbf4 0%, #d7f1ff 58%, #effaff 100%);
  border: 1px solid #bee6dd;
  border-radius: 14px;
  box-shadow: 0 14px 28px rgba(16, 132, 92, .12);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) 92px;
  min-height: 190px;
  overflow: hidden;
  padding: 16px;
  position: relative;
}

.home-whatsapp-callout::after {
  background: rgba(255, 255, 255, .62);
  border-radius: 999px;
  bottom: -44px;
  content: "";
  height: 86px;
  left: 34px;
  position: absolute;
  transform: rotate(-13deg);
  width: 190px;
}

.home-whatsapp-callout .whatsapp-channel-copy {
  align-content: start;
  align-items: start;
  display: grid;
  gap: 10px;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.home-whatsapp-callout .whatsapp-channel-icon {
  background: #22b873;
  border-radius: 999px;
  color: #ffffff;
  height: 42px;
  width: 42px;
}

.home-whatsapp-callout strong {
  color: #0b3d52;
  display: block;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.14;
  max-width: 220px;
}

.home-whatsapp-callout p {
  color: #356478;
  font-size: 11px;
  line-height: 1.38;
  margin: 6px 0 0;
  max-width: 230px;
}

.home-whatsapp-callout .whatsapp-channel-button {
  align-self: end;
  background: linear-gradient(135deg, #1faf71, #0d9163);
  border: 0;
  border-radius: 999px;
  box-shadow: 0 10px 20px rgba(15, 145, 99, .24);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  grid-column: 1 / 2;
  justify-self: start;
  min-height: 36px;
  padding: 10px 14px;
  position: relative;
  text-decoration: none;
  z-index: 1;
}

.whatsapp-card-phone {
  align-self: end;
  background: linear-gradient(160deg, #164c85, #2086d0);
  border: 5px solid #1b69aa;
  border-radius: 18px;
  box-shadow: 0 18px 28px rgba(19, 89, 145, .24);
  display: block;
  height: 128px;
  justify-self: end;
  position: relative;
  transform: rotate(8deg);
  width: 70px;
  z-index: 1;
}

.whatsapp-card-phone i {
  background: rgba(255, 255, 255, .18);
  border-radius: 999px;
  display: block;
  height: 8px;
  left: 50%;
  position: absolute;
  top: 9px;
  transform: translateX(-50%);
  width: 26px;
}

.whatsapp-card-phone b {
  align-items: center;
  background: #21c175;
  border: 3px solid #ffffff;
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  height: 42px;
  justify-content: center;
  left: -15px;
  position: absolute;
  top: 52px;
  width: 42px;
}

.whatsapp-card-phone svg {
  fill: none;
  height: 24px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 24px;
}

.manual-list-hint {
  color: #61758c;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  margin: 0 0 10px;
}

.guided-step-panel.is-guided-focus {
  animation: guidedFocusPulse 1.8s ease;
  outline: 3px solid rgba(255, 194, 10, .75);
  outline-offset: 4px;
}

@keyframes guidedFocusPulse {
  0%, 100% { box-shadow: 0 18px 38px rgba(31, 74, 112, .08); }
  45% { box-shadow: 0 0 0 8px rgba(255, 194, 10, .18), 0 22px 44px rgba(31, 74, 112, .14); }
}

@media (max-width: 1180px) {
  .help-hero-shell {
    grid-template-columns: minmax(260px, 1fr) minmax(220px, .8fr);
  }

  .help-hero-tagline {
    display: none;
  }

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

@media (max-width: 1020px) {
  .home-updates .section-heading {
    align-items: flex-start;
  }

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

@media (max-width: 820px) {
  .help-hero > div:first-child {
    padding: 26px;
  }

  .help-hero-shell {
    grid-template-columns: 1fr;
  }

  .help-hero-visual {
    display: none;
  }
}

@media (max-width: 720px) {
  .quick-grid {
    grid-template-columns: 1fr;
  }

  .home-updates .section-heading {
    display: grid;
    padding: 24px 20px 18px;
  }

  .home-updates-actions {
    justify-content: flex-start;
  }

  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr;
    padding: 16px;
  }
}

@media (max-width: 520px) {
  .help-hero > div:first-child {
    padding: 22px;
  }

  .help-hero h1 {
    font-size: 34px;
  }

  .home-whatsapp-callout {
    grid-template-columns: 1fr;
  }

  .whatsapp-card-phone {
    display: none;
  }
}

.floating-chat-header strong {
  display: block;
  font-size: 16px;
  line-height: 1.15;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.floating-chat .chat-messages {
  background:
    radial-gradient(circle at 12px 12px, rgba(7, 94, 84, .05) 0 2px, transparent 3px),
    linear-gradient(180deg, #efeae2 0%, #f7f4ee 100%);
  max-height: none;
  min-height: 230px;
  padding: 16px 16px 12px;
  align-content: start;
}

.floating-chat .chat-messages p {
  border-color: #d8e2dc;
  border-radius: 7px 16px 16px 16px;
  box-shadow: 0 4px 12px rgba(17, 40, 36, .08);
  color: #1f2d2a;
  max-width: 92%;
}

.floating-chat .chat-messages p:not(.user) {
  background: #ffffff;
  justify-self: start;
}

.floating-chat .chat-messages .assistant {
  background: #ffffff;
  justify-self: start;
}

.floating-chat .chat-messages .user {
  background: #dcf8c6;
  border-color: #c8efad;
  border-radius: 16px 7px 16px 16px;
  color: #14352d;
}

.floating-chat .chat-message-time {
  display: block;
  margin-top: 8px;
  color: #72817a;
  font-size: 10px;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  line-height: 1;
  text-align: right;
}

.floating-chat .chat-messages .user .chat-message-time {
  color: #4e6d5a;
}

.floating-chat .chat-form {
  background: #f0f2f0;
  border-top-color: #d8e2dc;
}

.floating-chat .chat-form input {
  border-color: #d4ded8;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}

.chat-profile-options button {
  background: #e8f8ef;
  border-color: #b7e6cf;
  color: #075e54;
}

.chat-profile-options button:hover,
.chat-profile-options button:focus-visible,
.chat-profile-options button.active {
  background: #128c7e;
  border-color: #128c7e;
}

.floating-chat-button {
  background: linear-gradient(135deg, #25d366 0%, #128c7e 100%) !important;
  box-shadow: 0 18px 38px rgba(18, 140, 126, .32) !important;
}

.floating-chat-button::before {
  border-color: rgba(37, 211, 102, .85) !important;
  box-shadow: 0 0 28px rgba(37, 211, 102, .42), 0 0 44px rgba(18, 140, 126, .24) !important;
}

.floating-chat-button:hover,
.floating-chat-button:focus-visible {
  box-shadow:
    0 0 0 7px rgba(37, 211, 102, .16),
    0 0 0 14px rgba(18, 140, 126, .12),
    0 22px 42px rgba(7, 94, 84, .34) !important;
}

.chat-launcher-hint {
  border-color: #b7e6cf !important;
  color: #075e54 !important;
}

.video-list .menu-accordion-body {
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
  padding: 10px;
}

.video-list .resource-row {
  gap: 8px;
  padding: 10px;
  border-radius: 9px;
}

.video-list .video-preview {
  aspect-ratio: 16 / 9;
  max-height: 168px;
}

.video-list .resource-content h3 {
  display: -webkit-box;
  overflow: hidden;
  color: #14243a;
  font-size: 16px;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.video-list .resource-content {
  gap: 5px;
}

.video-list .route {
  display: -webkit-box;
  overflow: hidden;
  margin-bottom: 3px;
  font-size: 10.5px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.video-list .resource-content a {
  font-size: 12px;
  margin-top: 2px;
}

#videoList .menu-accordion-body {
  display: grid !important;
  background:
    linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);
  border-top: 1px solid #dbe7f4;
  gap: 16px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  justify-content: center !important;
  padding: 18px !important;
}

#videoList .menu-accordion-body.compact-video-grid--few {
  grid-template-columns: repeat(auto-fit, minmax(280px, 360px)) !important;
}

#videoList .video-menu-tabs-layout {
  display: grid;
  gap: 14px;
}

#videoList .video-menu-tabs {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 2px 2px 8px;
  scrollbar-width: thin;
  scrollbar-color: #9bb8d6 transparent;
}

#videoList .video-menu-tab {
  position: relative;
  align-items: center;
  background: linear-gradient(180deg, #ffffff, #f3f8fd);
  border: 1px solid #cfe0f2;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(22, 53, 84, .07);
  color: #17446e;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  gap: 14px;
  justify-content: space-between;
  min-height: 50px;
  min-width: 180px;
  overflow: hidden;
  padding: 10px 13px 12px 15px;
  text-align: left;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, color .2s ease;
}

#videoList .video-menu-tab::before {
  background: transparent;
  border-radius: 999px;
  bottom: 6px;
  content: "";
  height: 3px;
  left: 13px;
  position: absolute;
  right: 13px;
  transform: scaleX(.32);
  transform-origin: left center;
  transition: background .2s ease, transform .2s ease;
}

#videoList .video-menu-tab:hover,
#videoList .video-menu-tab:focus-visible {
  background: linear-gradient(180deg, #fbfdff, #eaf3fb);
  border-color: #9fc3e4;
  box-shadow: 0 16px 30px rgba(37, 79, 120, .14);
  outline: none;
  transform: translateY(-2px);
}

#videoList .video-menu-tab.active {
  background: linear-gradient(135deg, #2f669b, #4d8dcc);
  border-color: #2f669b;
  box-shadow: 0 18px 34px rgba(47, 102, 155, .24);
  color: #ffffff;
}

#videoList .video-menu-tab.active::before {
  background: var(--accent);
  transform: scaleX(1);
}

#videoList .video-menu-tab strong {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 12px;
  justify-content: center;
  min-height: 26px;
  min-width: 32px;
  padding: 0 9px;
}

#videoList .video-menu-tab.active strong {
  background: rgba(255, 255, 255, .16);
  border-color: rgba(255, 255, 255, .52);
  color: #ffffff;
}

#videoList .video-menu-tab-panel {
  animation: publicVideoPanelReveal .22s ease both;
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  border: 1px solid #cfe0f2;
  border-radius: 16px;
  box-shadow: 0 14px 30px rgba(22, 53, 84, .06);
  display: grid;
  gap: 12px;
  overflow: hidden;
}

#videoList .video-menu-panel-heading {
  align-items: center;
  background: linear-gradient(135deg, #2f669b, #4d8dcc);
  color: #ffffff;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-height: 50px;
  padding: 12px 16px;
}

#videoList .video-menu-panel-heading strong {
  font-size: 16px;
}

#videoList .video-menu-panel-heading span {
  align-items: center;
  background: rgba(255, 255, 255, .15);
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  min-height: 28px;
  padding: 0 10px;
  white-space: nowrap;
}

#videoList .video-branch-tabs {
  align-items: stretch;
  background: #f7fbff;
  border-top: 1px solid #dbe7f4;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 14px 4px;
}

#videoList .video-branch-tab {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #24527f;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  gap: 8px;
  justify-content: space-between;
  min-height: 38px;
  padding: 7px 10px 7px 13px;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease;
}

#videoList .video-branch-tab:hover,
#videoList .video-branch-tab:focus-visible {
  border-color: #9fc3e4;
  box-shadow: 0 8px 18px rgba(37, 79, 120, .1);
  outline: none;
  transform: translateY(-1px);
}

#videoList .video-branch-tab.active {
  background: linear-gradient(135deg, #e7f3ff, #ffffff);
  border-color: #2f669b;
  box-shadow: 0 10px 22px rgba(47, 102, 155, .13);
  color: #17446e;
}

#videoList .video-branch-tab strong {
  align-items: center;
  background: #edf6ff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-height: 22px;
  min-width: 26px;
  padding: 0 7px;
}

#videoList .video-branch-panel {
  animation: publicVideoPanelReveal .2s ease both;
  background: #ffffff;
  border-top: 1px solid #dbe7f4;
  display: grid;
  gap: 0;
}

#videoList .video-branch-heading {
  align-items: center;
  background: linear-gradient(90deg, #ffffff, #f6faff);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-height: 44px;
  padding: 10px 16px;
}

#videoList .video-branch-heading strong {
  color: #173a5f;
  font-size: 14px;
}

#videoList .video-branch-heading span {
  color: #52657d;
  font-size: 12px;
  font-weight: 800;
}

@keyframes publicVideoPanelReveal {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#videoList .compact-video-card {
  align-content: start;
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  border: 1px solid #d8e7f6 !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 24px rgba(22, 53, 84, 0.06) !important;
  gap: 11px !important;
  max-width: none !important;
  min-width: 0;
  overflow: hidden;
  padding: 10px !important;
  position: relative;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
  width: 100% !important;
}

#videoList .compact-video-card::before {
  background:
    linear-gradient(180deg, rgba(47,111,168,.06), rgba(47,111,168,0));
  content: "";
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity .28s ease;
  z-index: 0;
}

#videoList .compact-video-card > * {
  position: relative;
  z-index: 1;
}

#videoList .compact-video-card:hover,
#videoList .compact-video-card:focus-within {
  background:
    linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%) !important;
  border-color: #8fb9df !important;
  box-shadow: 0 24px 46px rgba(37, 79, 120, 0.16) !important;
  transform: translateY(-6px);
}

#videoList .compact-video-card:hover::before,
#videoList .compact-video-card:focus-within::before {
  opacity: 1;
}

#videoList .compact-video-card .video-preview {
  aspect-ratio: 16 / 9 !important;
  border: 1px solid #cfe0f2;
  border-radius: 11px !important;
  background: #dceaf7;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.38);
  height: auto !important;
  max-height: 132px !important;
  min-height: 0 !important;
  overflow: hidden;
  transition: border-color .28s ease, box-shadow .28s ease, transform .28s ease;
  width: 100% !important;
}

#videoList .compact-video-card:hover .video-preview,
#videoList .compact-video-card:focus-within .video-preview {
  border-color: #9fc3e4;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.55),
    0 12px 24px rgba(37, 79, 120, .12);
  transform: translateY(-1px);
}

#videoList .compact-video-card .video-placeholder {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

#videoList .video-thumb-link {
  display: block;
  height: 100%;
  position: relative;
  text-decoration: none;
  width: 100%;
}

#videoList .video-thumb-link::after {
  background:
    linear-gradient(180deg, rgba(8, 22, 38, .06), rgba(8, 22, 38, .25));
  content: "";
  inset: 0;
  position: absolute;
  transition: background .28s ease, opacity .28s ease;
}

#videoList .compact-video-card:hover .video-thumb-link::after,
#videoList .compact-video-card:focus-within .video-thumb-link::after {
  background:
    linear-gradient(180deg, rgba(8, 22, 38, .02), rgba(8, 22, 38, .16));
}

#videoList .video-thumb-link img {
  display: block;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: filter .28s ease, transform .36s ease;
  width: 100%;
}

#videoList .compact-video-card:hover .video-thumb-link img,
#videoList .compact-video-card:focus-within .video-thumb-link img {
  filter: saturate(1.08) contrast(1.04);
  transform: scale(1.055);
}

#videoList .video-type-chip {
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 999px;
  color: #17446e;
  font-size: 10px;
  font-weight: 900;
  left: 10px;
  letter-spacing: .01em;
  padding: 4px 8px;
  position: absolute;
  top: 10px;
  transition: background .28s ease, box-shadow .28s ease, transform .28s ease;
  z-index: 1;
}

#videoList .compact-video-card:hover .video-type-chip,
#videoList .compact-video-card:focus-within .video-type-chip {
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 8px 18px rgba(22, 53, 84, .14);
  transform: translateY(-1px);
}

#videoList .video-play-badge {
  align-items: center;
  background: rgba(240, 24, 40, .94);
  border: 2px solid rgba(255, 255, 255, .9);
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(22, 53, 84, .18);
  color: #ffffff;
  display: inline-flex;
  height: 38px;
  justify-content: center;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: background .28s ease, box-shadow .28s ease, transform .28s ease;
  width: 38px;
  z-index: 1;
}

#videoList .compact-video-card:hover .video-play-badge,
#videoList .compact-video-card:focus-within .video-play-badge {
  background: #f01828;
  box-shadow:
    0 0 0 9px rgba(240, 24, 40, .14),
    0 16px 28px rgba(22, 53, 84, .22);
  transform: translate(-50%, -50%) scale(1.14);
}

#videoList .video-play-badge svg {
  fill: currentColor;
  height: 15px;
  margin-left: 2px;
  width: 15px;
}

#videoList .compact-video-card .resource-content {
  display: grid;
  gap: 7px !important;
  padding: 0 4px 3px;
}

#videoList .compact-video-card h3 {
  color: #10233f;
  display: -webkit-box;
  font-size: 14px !important;
  line-height: 1.22 !important;
  margin: 0 !important;
  min-height: 34px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#videoList .compact-video-card .route {
  color: #17446e;
  font-size: 8.6px !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  min-height: 22px;
  opacity: .9;
}

#videoList .compact-video-card .resource-content a {
  align-items: center;
  background: linear-gradient(90deg, #edf6ff 0%, #e4f1ff 100%);
  border: 1px solid #cfe3f8;
  border-radius: 999px;
  color: #0f4c7f;
  display: inline-flex;
  gap: 6px;
  font-size: 11px !important;
  justify-content: center;
  justify-self: stretch;
  margin-top: 2px;
  min-height: 32px;
  padding: 0 11px;
  text-decoration: none;
  transition: background .24s ease, border-color .24s ease, box-shadow .24s ease, color .24s ease, transform .24s ease;
}

#videoList .compact-video-card .resource-content a svg {
  fill: none;
  height: 14px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 14px;
}

#videoList .compact-video-card:hover .resource-content a,
#videoList .compact-video-card:focus-within .resource-content a,
#videoList .compact-video-card .resource-content a:hover {
  background: linear-gradient(90deg, #2f6fa8 0%, #4d8acc 100%);
  border-color: #2f6fa8;
  box-shadow: 0 10px 20px rgba(47, 111, 168, .18);
  color: #ffffff;
  transform: translateY(-1px);
}

#videoList .video-card-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 2px;
}

#videoList .video-card-actions .video-card-action {
  margin-top: 0;
  min-width: 0;
}

#videoList .video-card-actions .video-share-action {
  background: linear-gradient(90deg, #eafbf2 0%, #dff8eb 100%);
  border-color: #b9ecd0;
  color: #087d45;
}

#videoList .compact-video-card:hover .resource-content .video-share-action,
#videoList .compact-video-card:focus-within .resource-content .video-share-action,
#videoList .compact-video-card .resource-content .video-share-action:hover,
#videoList .compact-video-card .resource-content .video-share-action:focus-visible {
  background: linear-gradient(90deg, #25d366 0%, #128c7e 100%);
  border-color: #16b861;
  box-shadow: 0 10px 20px rgba(18, 140, 126, .18);
  color: #ffffff;
}

.public-updates-list {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.public-updates-list .public-update-row {
  gap: 10px;
  padding: 12px;
}

.updates-notice-trigger {
  align-items: center;
  background: #eef6ff;
  border: 1px solid #c8d9eb;
  border-radius: 999px;
  color: var(--primary-dark);
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  min-height: 36px;
  padding: 0 13px;
}

.updates-notice-trigger:hover,
.updates-notice-trigger:focus-visible {
  background: var(--primary);
  border-color: var(--primary);
  color: #ffffff;
}

.updates-modal-profile-filters {
  background: #f7fbff;
  border-bottom: 1px solid #e0eaf5;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 12px 24px 10px;
  scrollbar-width: thin;
  scrollbar-color: #9bb8d6 transparent;
}

.updates-modal-profile-filters:empty {
  display: none;
}

.updates-modal-profile-filters button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  min-height: 34px;
  padding: 0 11px;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.updates-modal-profile-filters button span {
  align-items: center;
  background: #eef6ff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-height: 22px;
  min-width: 24px;
  padding: 0 7px;
}

.updates-modal-profile-filters button:hover,
.updates-modal-profile-filters button:focus-visible,
.updates-modal-profile-filters button.active {
  background: #128c7e;
  border-color: #128c7e;
  box-shadow: 0 10px 20px rgba(18, 140, 126, .15);
  color: #ffffff;
  outline: none;
  transform: translateY(-1px);
}

.updates-modal-profile-filters button:hover span,
.updates-modal-profile-filters button:focus-visible span,
.updates-modal-profile-filters button.active span {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.42);
  color: #ffffff;
}

.home-update-profile-filters {
  align-items: center;
  background: #f7fbff;
  border-bottom: 1px solid #dce9f6;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 14px 24px;
  scrollbar-color: #9bb8d6 transparent;
  scrollbar-width: thin;
}

.home-update-profile-filters:empty {
  display: none;
}

.home-update-profile-filters button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.home-update-profile-filters button span {
  align-items: center;
  background: #eef6ff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-height: 22px;
  min-width: 24px;
  padding: 0 7px;
}

.home-update-profile-filters button:hover,
.home-update-profile-filters button:focus-visible,
.home-update-profile-filters button.active {
  background: #128c7e;
  border-color: #128c7e;
  box-shadow: 0 12px 22px rgba(18, 140, 126, .16);
  color: #ffffff;
  outline: none;
  transform: translateY(-1px);
}

.home-update-profile-filters button:hover span,
.home-update-profile-filters button:focus-visible span,
.home-update-profile-filters button.active span {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.42);
  color: #ffffff;
}

.faq-panel {
  display: grid;
  gap: 18px;
}

.faq-filters {
  background: #f7fbff;
  border: 1px solid #d7e5f4;
  border-radius: 12px;
  display: grid;
  gap: 14px;
  padding: 18px;
}

.faq-filters label {
  color: #09213e;
  display: grid;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
}

.faq-filters input {
  background: #ffffff;
  border: 1px solid #c8d9eb;
  border-radius: 10px;
  color: #09213e;
  font: inherit;
  font-weight: 700;
  min-height: 48px;
  outline: none;
  padding: 0 14px;
}

.faq-filters input:focus {
  border-color: #2f6fa8;
  box-shadow: 0 0 0 3px rgba(47, 111, 168, .14);
}

.faq-profile-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.faq-profile-filters button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

.faq-profile-filters button span {
  align-items: center;
  background: #eef6ff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-height: 22px;
  min-width: 24px;
  padding: 0 7px;
}

.faq-profile-filters button:hover,
.faq-profile-filters button:focus-visible,
.faq-profile-filters button.active {
  background: #128c7e;
  border-color: #128c7e;
  box-shadow: 0 12px 22px rgba(18, 140, 126, .16);
  color: #ffffff;
  outline: none;
  transform: translateY(-1px);
}

.faq-profile-filters button:hover span,
.faq-profile-filters button:focus-visible span,
.faq-profile-filters button.active span {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.42);
  color: #ffffff;
}

.faq-list {
  display: grid;
  gap: 12px;
}

.faq-card {
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  border: 1px solid #cfe0f2;
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(22, 53, 84, .06);
  overflow: hidden;
}

.faq-question {
  align-items: center;
  background: transparent;
  border: 0;
  color: #09213e;
  cursor: pointer;
  display: flex;
  font: inherit;
  gap: 14px;
  justify-content: space-between;
  padding: 16px 18px;
  text-align: left;
  width: 100%;
}

.faq-question small {
  background: #eef6ff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 8px;
  padding: 5px 10px;
  text-transform: uppercase;
}

.faq-question strong {
  display: block;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.25;
}

.faq-question i {
  align-items: center;
  background: #eafbf2;
  border: 1px solid #b9ecd0;
  border-radius: 999px;
  color: #087d45;
  display: inline-flex;
  flex: 0 0 auto;
  font-style: normal;
  font-weight: 900;
  height: 34px;
  justify-content: center;
  width: 34px;
}

.faq-question:hover,
.faq-question:focus-visible {
  background: #f4fbff;
  outline: none;
}

.faq-answer {
  border-top: 1px solid #dce9f6;
  color: #405c7c;
  line-height: 1.65;
  padding: 0 18px 18px;
  white-space: pre-line;
}

.faq-answer p {
  margin: 14px 0 10px;
}

.faq-answer span {
  color: #17446e;
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
}

.public-updates-list .public-update-row img,
.public-updates-list .public-update-row .public-update-empty {
  aspect-ratio: 16 / 9;
  max-height: 210px;
  object-fit: contain;
  padding: 6px;
}

.update-image-button,
.updates-modal-image,
.update-detail-image {
  appearance: none;
  background: #f3f8fd;
  border: 1px solid #cfe0f2;
  border-radius: 10px;
  cursor: zoom-in;
  display: grid;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}

.update-image-button img,
.updates-modal-image img,
.update-detail-image img {
  border: 0 !important;
  border-radius: 0 !important;
  display: block;
  object-fit: contain;
  padding: 6px;
  width: 100%;
}

.update-image-button span,
.updates-modal-image span,
.update-detail-image strong {
  align-items: center;
  background: rgba(7, 94, 84, .92);
  border-radius: 999px;
  bottom: 10px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-self: center;
  min-height: 28px;
  opacity: 0;
  padding: 0 10px;
  position: absolute;
  transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease;
}

.update-image-button:hover span,
.update-image-button:focus-visible span,
.updates-modal-image:hover span,
.updates-modal-image:focus-visible span,
.update-detail-image:hover strong,
.update-detail-image:focus-visible strong {
  opacity: 1;
  transform: translateY(0);
}

.updates-modal-route {
  color: #17456e;
  display: -webkit-box;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.35;
  margin: 7px 0 0;
  overflow: hidden;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.update-card-actions,
.update-inline-actions,
.update-detail-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.update-card-actions button,
.update-card-actions a,
.update-inline-actions button,
.update-inline-actions a,
.update-detail-actions button,
.update-detail-actions a {
  align-items: center;
  background: #eef7ff;
  border: 1px solid #c8dff4;
  border-radius: 999px;
  color: #17456e;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  text-decoration: none;
}

.update-card-actions button:first-child,
.update-inline-actions button:first-child,
.update-detail-actions button:first-child {
  background: #e8f8ef;
  border-color: #b7e6cf;
  color: #075e54;
}

.update-card-actions button:hover,
.update-card-actions a:hover,
.update-card-actions button:focus-visible,
.update-card-actions a:focus-visible,
.update-inline-actions button:hover,
.update-inline-actions a:hover,
.update-inline-actions button:focus-visible,
.update-inline-actions a:focus-visible,
.update-detail-actions button:hover,
.update-detail-actions a:hover,
.update-detail-actions button:focus-visible,
.update-detail-actions a:focus-visible {
  background: #128c7e;
  border-color: #128c7e;
  color: #ffffff;
}

.image-preview-backdrop,
.update-detail-backdrop {
  align-items: center;
  animation: modalBackdropIn .22s ease both;
  background: rgba(10, 24, 38, .62);
  backdrop-filter: blur(4px);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 22px;
  position: fixed;
  z-index: 120;
}

.image-preview-modal,
.update-detail-modal {
  animation: modalCardIn .24s ease both;
  background: #ffffff;
  border: 1px solid #d7e6f5;
  border-radius: 18px;
  box-shadow: 0 30px 90px rgba(10, 24, 38, .34);
  max-height: min(88vh, 820px);
  overflow: hidden;
  position: relative;
  width: min(100%, 980px);
}

.image-preview-modal {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.image-preview-heading,
.update-detail-heading {
  background: linear-gradient(135deg, #075e54 0%, #128c7e 100%);
  color: #ffffff;
  padding: 18px 68px 18px 22px;
}

.image-preview-heading strong,
.update-detail-heading h2 {
  color: #ffffff;
  display: block;
  font-size: clamp(20px, 2.2vw, 30px);
  font-weight: 900;
  line-height: 1.15;
  margin: 5px 0 6px;
}

.image-preview-heading span,
.update-detail-heading p,
.update-detail-heading span {
  color: rgba(255, 255, 255, .9);
  font-size: 13px;
  font-weight: 800;
}

.update-detail-heading span {
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  display: inline-flex;
  margin: 0 6px 8px 0;
  padding: 6px 9px;
  text-transform: uppercase;
}

.image-preview-modal img {
  background: #f8fbff;
  max-height: calc(88vh - 94px);
  object-fit: contain;
  padding: 18px;
  width: 100%;
}

.image-preview-close,
.update-detail-close {
  align-items: center;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .34);
  border-radius: 50%;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 25px;
  font-weight: 900;
  height: 40px;
  justify-content: center;
  line-height: 1;
  position: absolute;
  right: 18px;
  top: 16px;
  width: 40px;
  z-index: 2;
}

.update-detail-modal {
  max-width: 820px;
  overflow-y: auto;
}

.update-detail-image {
  border-radius: 0;
  border-width: 0 0 1px;
}

.update-detail-image img {
  max-height: 420px;
  object-fit: contain;
  padding: 16px;
}

.update-detail-body {
  color: #415670;
  font-size: 15px;
  line-height: 1.6;
  padding: 20px 24px 4px;
}

.rich-update-description {
  color: #516782;
  font-size: 14px;
  line-height: 1.5;
}

.rich-update-description p {
  margin: 0 0 8px;
}

.rich-update-description ul,
.rich-update-description ol {
  margin: 0 0 8px 20px;
  padding: 0;
}

.rich-update-description a {
  color: #1f5f9a;
  font-weight: 900;
  text-decoration: underline;
}

.update-detail-body .rich-update-description {
  color: #415670;
  font-size: 15px;
  line-height: 1.6;
}

.update-detail-actions {
  border-top: 1px solid #e1ebf5;
  justify-content: flex-end;
  padding: 18px 24px 22px;
}

.public-update-card.is-highlighted,
.public-update-row.is-highlighted,
.update-card.is-highlighted {
  animation: updateHighlight 2.2s ease both;
}

@keyframes updateHighlight {
  0%, 100% {
    box-shadow: 0 10px 24px rgba(31, 41, 55, .04);
  }
  18%, 68% {
    border-color: #25d366;
    box-shadow: 0 0 0 4px rgba(37, 211, 102, .18), 0 18px 34px rgba(7, 94, 84, .18);
  }
}

.public-updates-list .public-update-row h3 {
  font-size: clamp(17px, 1.25vw, 20px);
}

.public-updates-list .public-update-row p {
  margin-bottom: 8px;
}

#updatesList.public-updates-list {
  background: #ffffff;
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
  padding: 18px 24px 24px;
}

#updatesList .public-update-row {
  align-items: stretch;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid #d7e6f5;
  border-left: 5px solid #2f73b8;
  border-radius: 14px;
  box-shadow: 0 12px 24px rgba(22, 53, 84, .055);
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
  padding: 14px 16px 14px 12px;
}

#updatesList .public-update-row.no-media {
  grid-template-columns: minmax(0, 1fr) auto;
  padding-left: 18px;
}

#updatesList .public-update-row:hover,
#updatesList .public-update-row:focus-within {
  border-color: #9fc3e4;
  border-left-color: #1f5f9b;
  box-shadow: 0 18px 34px rgba(37, 79, 120, .12);
  transform: translateY(-1px);
}

#updatesList .update-image-button {
  align-self: stretch;
  background: #eef5fc;
  border-radius: 10px;
  min-height: 132px;
}

#updatesList .update-image-button img {
  height: 100%;
  max-height: 132px;
  object-fit: contain;
}

#updatesList .public-update-row > div {
  align-content: center;
  display: grid;
  gap: 8px;
  min-width: 0;
}

#updatesList .update-public-meta {
  gap: 6px;
  margin-bottom: 2px;
}

#updatesList .update-public-meta span {
  font-size: 11px;
  padding: 6px 8px;
}

#updatesList .public-update-row h3 {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: clamp(17px, 1.35vw, 21px);
  font-weight: 900;
  line-height: 1.18;
  margin: 0;
}

#updatesList .public-update-row .route {
  color: #17446e;
  display: -webkit-box;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.35;
  margin: 0;
  overflow: hidden;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#updatesList .public-update-row .update-summary {
  color: #516782;
  display: -webkit-box;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#updatesList .public-update-row p:not(.route) {
  color: #516782;
  display: -webkit-box;
  font-size: 14px;
  line-height: 1.45;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#updatesList .public-update-row .update-summary {
  font-size: 13px;
}

#updatesList .public-update-row .rich-update-description,
.home-updates .public-update-card .rich-update-description,
.updates-modal-item .rich-update-description {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

#updatesList .public-update-row .rich-update-description p,
.home-updates .public-update-card .rich-update-description p,
.updates-modal-item .rich-update-description p {
  margin: 0;
}

#updatesList .update-card-actions {
  align-self: center;
  justify-content: flex-end;
  margin-top: 0;
}

#updatesList .update-card-actions button,
#updatesList .update-card-actions a {
  min-width: 112px;
  white-space: nowrap;
}

.support-resource-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.support-resource-card.install-resource-card {
  appearance: none;
  cursor: pointer;
  text-align: left;
}

.install-resource-card .support-resource-icon {
  background: var(--primary-soft);
  border-color: #cfe0f2;
  color: var(--primary-dark);
}

.install-resource-card::before {
  background: linear-gradient(90deg, var(--primary), #4d8acc);
}

.install-resource-card:hover,
.install-resource-card:focus-visible {
  border-color: #8bbde8;
  box-shadow: 0 24px 46px rgba(37, 79, 120, .14);
  outline: none;
}

.install-resource-card.is-installed {
  border-color: #9bb9d8;
}

.install-resource-card.is-installed::before {
  background: linear-gradient(90deg, var(--primary), #4d8acc);
}

.install-resource-card.is-installed .support-resource-icon {
  background: var(--primary-soft);
  border-color: #cfe0f2;
  color: var(--primary-dark);
}

.install-resource-card.is-unavailable {
  border-color: #9bb9d8;
}

.install-resource-card.is-unavailable::before {
  background: linear-gradient(90deg, var(--primary), #4d8acc);
}

.help-footer {
  display: grid;
  grid-template-columns: minmax(220px, .85fr) minmax(300px, 1fr);
  gap: 32px;
  align-items: start;
  margin: 24px 0 0;
  padding: 28px 32px;
  border-radius: 12px;
  background: linear-gradient(135deg, #285579, #2d628e);
  color: #ffffff;
  box-shadow: 0 16px 32px rgba(31, 41, 55, .12);
}

.help-footer-column {
  display: grid;
  gap: 12px;
}

.help-footer h2 {
  margin: 0;
  color: #ffc20a;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 8px;
  background: rgba(255, 255, 255, .12);
  color: #ffffff;
  text-decoration: none;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.social-link:hover,
.social-link:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(255, 255, 255, .55);
  background: rgba(255, 255, 255, .2);
  box-shadow: 0 10px 18px rgba(0, 0, 0, .16);
  outline: none;
}

.social-link svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.social-link.whatsapp {
  color: #25d366;
}

.social-link.facebook {
  color: #9cc7ff;
}

.social-link.youtube {
  color: #ff3b30;
}

.social-link.instagram {
  color: #ff77b7;
}

.social-link.twitter {
  color: #8fd7ff;
}

.support-hours {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.support-hours li {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #ffffff;
  font-size: 15px;
  line-height: 1.4;
}

.support-hours span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255, 194, 10, .65);
  border-radius: 8px;
  background: rgba(255, 194, 10, .1);
  color: #ffc20a;
}

.support-hours svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.support-hours a {
  color: #ffffff;
  font-weight: 800;
  text-decoration: none;
}

.support-hours a:hover,
.support-hours a:focus-visible {
  color: #ffc20a;
  outline: none;
}

@media (max-width: 1020px) {
  .profile-cards,
  .filters,
  .updates-grid {
    grid-template-columns: 1fr;
  }

  .help-footer {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

@media (max-width: 640px) {
  .help-footer {
    padding: 24px 20px;
  }

  .support-hours li {
    align-items: flex-start;
  }
}

/* Centro de Ayuda 2026: evolución visual sin cambios de lógica. */
.manual-app {
  padding-top: 14px;
  width: min(1360px, calc(100% - 40px));
}

.client-masthead.help-hero {
  margin-bottom: 12px;
}

.help-hero > div:first-child {
  background: linear-gradient(100deg, #2c5f8f 0%, #417fb9 100%);
  border-radius: 9px;
  box-shadow: 0 12px 26px rgba(37, 79, 120, .14);
  padding: 18px 24px;
}

.help-hero-brand {
  gap: 20px;
}

.brand-logo-main {
  width: 178px;
}

.help-hero h1 {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: clamp(28px, 3vw, 38px);
  font-weight: 700;
  letter-spacing: 0;
  margin-bottom: 6px;
}

.help-hero p {
  font-size: 14px;
  font-weight: 400;
}

.main-menu.help-menu {
  align-items: center;
  display: grid !important;
  gap: 8px;
  grid-template-columns: repeat(6, minmax(118px, 1fr)) 46px !important;
  margin-bottom: 18px;
  padding: 6px;
}

.main-menu button,
.main-menu a {
  font-size: 12px;
  font-weight: 700;
  min-height: 40px;
}

.main-menu svg {
  height: 15px;
  width: 15px;
}

.main-menu.help-menu .admin-link {
  grid-column: auto !important;
  grid-row: auto !important;
  justify-self: stretch;
}

@media (max-width: 1020px) {
  .main-menu.help-menu {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .main-menu.help-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  .main-menu.help-menu {
    gap: 6px;
  }

  .main-menu button,
  .main-menu a {
    font-size: 11px;
    padding: 0 8px;
  }
}

@media (max-width: 420px) {
  .main-menu.help-menu {
    grid-template-columns: 1fr !important;
  }
}

.help-search-panel {
  border: 1px solid #dbe6f1;
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(31, 41, 55, .045);
  padding: 28px 30px;
}

.help-search-panel label {
  font-size: clamp(24px, 2.2vw, 30px);
  font-weight: 700;
  gap: 10px;
}

.help-search-panel label::after {
  color: #5f7288;
  content: "Busca manuales, videos, rutas y recursos disponibles en el centro de ayuda.";
  font-size: 14px;
  font-weight: 500;
  order: 1;
}

.home-search-input {
  border-color: #d6e2ee;
  border-radius: 12px;
  min-height: 58px;
  order: 2;
}

.help-search-panel label > small {
  font-size: 12.5px;
  font-weight: 600;
  order: 3;
}

.quick-grid {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  justify-content: center;
}

.quick-card {
  align-content: start;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border-color: #e1eaf3;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(31, 41, 55, .045);
  flex: 1 1 160px;
  max-width: 220px;
  min-height: 178px;
  min-width: 158px;
  padding: 20px 16px;
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease, transform .28s ease;
}

.quick-card-icon {
  height: 58px;
  margin-bottom: 6px;
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease, color .28s ease, transform .28s ease;
  width: 58px;
}

.quick-card-icon svg {
  height: 28px;
  transition: transform .28s ease;
  width: 28px;
}

.quick-card strong {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.quick-card small {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.35;
}

.quick-card em {
  font-size: 12px;
  font-weight: 700;
  transition: color .28s ease, transform .28s ease;
}

.quick-card:hover,
.quick-card:focus-visible {
  background: linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%);
  border-color: #8fb4d7;
  box-shadow: 0 24px 46px rgba(37, 79, 120, .15);
  transform: translateY(-7px);
}

.quick-card:hover .quick-card-icon,
.quick-card:focus-visible .quick-card-icon {
  background: #e2f0ff;
  border-color: #a7c8e8;
  box-shadow: 0 12px 24px rgba(51, 102, 153, .18);
  color: #255783;
  transform: translateY(-4px) scale(1.08);
}

.quick-card:hover .quick-card-icon svg,
.quick-card:focus-visible .quick-card-icon svg {
  transform: scale(1.08);
}

.quick-card:hover em,
.quick-card:focus-visible em {
  color: #17456e;
  transform: translateX(6px);
}

.home-updates {
  position: relative;
  overflow: hidden;
  border-color: #d7e6f5;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(47, 111, 168, .08), rgba(255, 255, 255, 0) 34%),
    #ffffff;
  box-shadow: 0 16px 34px rgba(31, 41, 55, .065);
  padding: 0;
}

.home-updates::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, #ffc20a, #2f6fa8 38%, #4d8acc);
}

.home-updates .section-heading {
  align-items: end;
  border-bottom: 1px solid #dbe7f3;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 30px 32px 24px;
}

.home-updates .section-heading h2 {
  color: #102a43;
  font-size: clamp(24px, 2.2vw, 34px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.12;
  margin-bottom: 8px;
}

.home-updates .section-heading p {
  color: #53677f;
  font-size: 14px;
  line-height: 1.45;
  margin: 0;
  max-width: 560px;
}

.home-updates-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.home-updates-count {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #255783;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
  padding: 0 12px;
}

.home-updates .updates-preview-grid {
  align-items: stretch;
  gap: 14px;
  grid-template-columns: minmax(320px, 1.15fr) repeat(2, minmax(230px, .85fr));
  padding: 22px 30px 24px;
}

.home-updates .public-update-card {
  position: relative;
  border-color: #d6e5f4;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(31, 41, 55, .055);
  gap: 12px;
  padding: 16px;
}

.home-updates .public-update-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: #2f6fa8;
  opacity: .16;
}

.home-updates .public-update-card:first-child {
  background:
    linear-gradient(135deg, rgba(47, 111, 168, .10), rgba(255, 255, 255, 0) 46%),
    #ffffff;
  border-color: #bcd4ec;
  box-shadow: 0 18px 36px rgba(37, 79, 120, .11);
}

.home-updates .public-update-card:first-child::before {
  background: #ffc20a;
  opacity: 1;
}

.home-updates .public-update-card:hover,
.home-updates .public-update-card:focus-within {
  border-color: #9fc2e4;
  box-shadow: 0 22px 42px rgba(37, 79, 120, .14);
  transform: translateY(-3px);
}

.home-updates .update-public-meta {
  gap: 7px;
  margin-bottom: 2px;
}

.home-updates .update-public-meta span {
  background: #edf6ff;
  border-color: #c7dff5;
  color: #255783;
  font-size: 11px;
  padding: 7px 9px;
}

.home-updates .public-update-card h3 {
  color: #102a43;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: clamp(17px, 1.45vw, 21px);
  font-weight: 900;
  line-height: 1.22;
  margin: 2px 0 0;
}

.home-updates .public-update-card:first-child h3 {
  font-size: clamp(20px, 1.8vw, 26px);
}

.home-updates .public-update-card .route {
  color: #17456e;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.45;
}

.home-updates .public-update-card p:not(.route) {
  color: #53677f;
  font-size: 14px;
  line-height: 1.55;
}

.home-updates .public-update-card .rich-update-description {
  color: #53677f;
  font-size: 14px;
  line-height: 1.55;
}

.home-updates .empty-state-card {
  grid-column: 1 / -1;
}

@media (max-width: 1020px) {
  .home-updates .section-heading {
    align-items: flex-start;
  }

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

  .home-updates .public-update-card:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .home-updates .section-heading {
    display: grid;
    padding: 24px 20px 18px;
  }

  .home-update-profile-filters {
    padding: 12px 18px;
  }

  .home-updates-actions {
    justify-content: flex-start;
  }

  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .home-updates .public-update-card:first-child {
    grid-column: auto;
  }
}

.empty-state-card {
  align-items: center;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  border: 1px dashed #cbdced;
  border-radius: 12px;
  color: #52657d;
  display: grid;
  gap: 8px;
  justify-items: center;
  min-height: 150px;
  padding: 26px;
  text-align: center;
}

.empty-state-card svg {
  fill: none;
  height: 34px;
  stroke: #336699;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 34px;
}

.empty-state-card strong {
  color: #172033;
  font-size: 17px;
  font-weight: 700;
}

.empty-state-card p {
  color: #60738c;
  font-weight: 400;
  margin: 0;
  max-width: 520px;
}

.public-module-hero {
  min-height: 112px;
  padding: 20px 24px;
}

.public-module-hero h2 {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: clamp(25px, 2.7vw, 34px);
  font-weight: 700;
  letter-spacing: 0;
}

.manual-count-pill {
  font-weight: 700;
}

.manual-profile-cards {
  gap: 14px;
  padding: 18px 24px 10px;
}

#view-manual .profile-selection-step,
#view-videos .profile-selection-step,
#view-novedades .profile-selection-step {
  background: #ffffff;
  border-color: #d9e7f5;
  border-radius: 0;
  border-width: 0 0 1px;
  padding: 18px 24px 22px;
}

.guided-step-heading {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
}

.guided-step-number {
  align-items: center;
  background: #eaf4ff;
  border: 1px solid #c7def4;
  border-radius: 999px;
  color: #1f5d92;
  display: inline-flex;
  flex: 0 0 30px;
  font-size: 14px;
  font-weight: 900;
  height: 30px;
  justify-content: center;
  line-height: 1;
}

.guided-step-heading h3 {
  color: #082341;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
  margin: 0 0 5px;
}

.guided-step-heading p {
  color: #52657d;
  font-size: 14px;
  line-height: 1.45;
  margin: 0;
}

.guided-profile-cards {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0;
}

#view-manual .guided-profile-card,
#view-videos .guided-profile-card,
#view-novedades .guided-profile-card {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid #d5e5f4;
  border-top: 4px solid #336699;
  border-radius: 16px;
  box-shadow: 0 16px 34px rgba(26, 49, 78, .08);
  display: grid;
  gap: 14px;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  min-height: 132px;
  padding: 16px;
  text-align: left;
}

#view-manual .guided-profile-card.profile-docente,
#view-videos .guided-profile-card.profile-docente,
#view-novedades .guided-profile-card.profile-docente {
  border-top-color: #159b77;
}

#view-manual .guided-profile-card.profile-estudiante,
#view-videos .guided-profile-card.profile-estudiante,
#view-novedades .guided-profile-card.profile-estudiante {
  border-top-color: #e67b0a;
}

#view-manual .guided-profile-card:hover,
#view-manual .guided-profile-card.active,
#view-videos .guided-profile-card:hover,
#view-videos .guided-profile-card.active,
#view-novedades .guided-profile-card:hover,
#view-novedades .guided-profile-card.active {
  border-color: #93c5fd;
  box-shadow: 0 20px 42px rgba(26, 49, 78, .14);
  transform: translateY(-2px);
}

.guided-profile-art {
  align-items: center;
  background: #eaf4ff;
  border: 1px solid #c9dff5;
  border-radius: 18px;
  color: #255f92;
  display: inline-flex;
  height: 74px;
  justify-content: center;
  width: 74px;
}

.profile-docente .guided-profile-art {
  background: #eafaf4;
  border-color: #bfead8;
  color: #08775a;
}

.profile-estudiante .guided-profile-art {
  background: #fff4e4;
  border-color: #f8d7a9;
  color: #bd6100;
}

.guided-profile-art svg {
  display: block;
  fill: currentColor;
  height: 46px;
  stroke: none;
  width: 46px;
}

.guided-profile-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
  text-transform: none !important;
}

#view-manual .guided-profile-copy strong,
#view-videos .guided-profile-copy strong,
#view-novedades .guided-profile-copy strong {
  color: #09223d;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
  text-transform: none !important;
}

#view-manual .guided-profile-copy small,
#view-videos .guided-profile-copy small,
#view-novedades .guided-profile-copy small {
  color: #526b88;
  display: block;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  max-width: 260px;
  text-transform: none !important;
}

.guided-profile-action {
  align-items: center;
  align-self: end;
  background: #eaf6ff;
  border: 1px solid #cce2f7;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 5px;
  grid-column: 2 / 3;
  justify-content: center;
  justify-self: start;
  min-height: 30px;
  padding: 7px 12px;
  text-transform: none !important;
  white-space: nowrap;
}

.guided-profile-count {
  align-items: center;
  background: #f2f8ff;
  border: 1px solid #cfe2f5;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  height: 34px;
  justify-content: center;
  min-width: 34px;
}

.platform-update-callout {
  align-content: center;
  align-items: stretch;
  animation: modalBackdropIn .22s ease both;
  backdrop-filter: blur(5px);
  background: rgba(10, 24, 38, .58);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #173a5c;
  display: grid;
  grid-template-rows: auto auto;
  inset: 0;
  justify-content: center;
  margin: 0;
  max-width: none;
  overflow: auto;
  padding: 24px;
  position: fixed;
  width: auto;
  z-index: 118;
}

.platform-update-callout.is-dismissed {
  display: none;
}

.platform-update-window-head {
  align-items: center;
  animation: modalCardIn .24s ease both;
  background: linear-gradient(90deg, #2b5d8d 0%, #4d8acc 100%);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 30px 90px rgba(10, 24, 38, .34);
  color: #ffffff;
  display: flex;
  gap: 12px;
  min-height: 62px;
  padding: 14px 16px 14px 18px;
  width: min(760px, calc(100vw - 48px));
}

.platform-update-window-head strong {
  color: #ffffff;
  display: block;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.2;
}

.platform-update-window-body {
  animation: modalCardIn .24s ease both;
  background: #ffffff;
  border: 1px solid #d7e6f5;
  border-radius: 0 0 20px 20px;
  border-top: 0;
  box-shadow: 0 30px 90px rgba(10, 24, 38, .34);
  display: grid;
  gap: 10px;
  padding: 20px 22px 22px;
  width: min(760px, calc(100vw - 48px));
}

.platform-update-window-body h3 {
  color: #082341;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.25;
  margin: 0;
}

.platform-update-window-body p {
  color: #425d7d;
  line-height: 1.55;
  margin: 0;
}

.platform-update-window-body span {
  background: #eff6ff;
  border: 1px solid #d7e8f9;
  border-radius: 14px;
  color: #17446e;
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  padding: 10px 12px;
}

.platform-update-window-body b {
  color: #0f4d83;
}

.platform-update-actions {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: flex-end;
  margin-top: 2px;
}

.platform-update-actions small {
  color: #4d6682;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.platform-update-actions button {
  align-items: center;
  background: linear-gradient(90deg, #1f5f9b 0%, #4d8acc 100%);
  border: 0;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(31, 95, 155, .22);
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 14px;
  font-weight: 900;
  justify-content: center;
  min-height: 42px;
  padding: 0 22px;
  white-space: nowrap;
}

.platform-update-actions button:hover,
.platform-update-actions button:focus-visible {
  box-shadow: 0 16px 34px rgba(31, 95, 155, .28);
  outline: none;
  transform: translateY(-1px);
}

.platform-update-close {
  align-items: center;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-size: 22px;
  font-weight: 800;
  height: 34px;
  justify-content: center;
  line-height: 1;
  margin-left: auto;
  padding: 0;
  width: 34px;
  z-index: 2;
}

.platform-update-close:hover,
.platform-update-close:focus-visible {
  background: rgba(255,255,255,.26);
  outline: none;
  transform: translateY(-1px);
}

.platform-update-icon {
  align-items: center;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 13px;
  color: #ffffff;
  display: inline-flex;
  flex: 0 0 42px;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.platform-update-icon svg {
  height: 23px;
  width: 23px;
}

.video-platform-callout .platform-update-window-head {
  background: linear-gradient(90deg, #d91414 0%, #ff4d4d 100%);
}

.video-platform-callout .platform-update-window-body span {
  background: #fff5f5;
  border-color: #ffd4d4;
  color: #7a1b1b;
}

.video-platform-callout .platform-update-window-body b {
  color: #c71f1f;
}

.profile-summary-card {
  border-color: #e0eaf4;
  border-radius: 10px;
  box-shadow: none;
  min-height: 82px;
}

.profile-summary-card:hover,
.profile-summary-card.active {
  box-shadow: 0 12px 24px rgba(31, 41, 55, .065);
}

.profile-summary-card span {
  font-size: 12px;
  font-weight: 700;
}

.profile-summary-card strong {
  font-size: 28px;
  font-weight: 700;
}

.manual-search-panel,
.tutorial-filters {
  background: #f8fbff;
  border-color: #e1eaf3;
}

.manual-search-panel {
  gap: 12px;
  padding: 18px 24px;
}

.manual-search-panel label,
.tutorial-filters label {
  font-weight: 700;
}

.manual-search-panel label {
  font-size: 17px;
}

.manual-filter-row.manual-menu-tabs-row {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr) auto;
}

.manual-search-panel input,
.manual-filter-row select,
.tutorial-filters input,
.tutorial-filters select,
.tutorial-filters button {
  border-color: #d4e1ee;
  border-radius: 10px;
}

.manual-layout {
  gap: 18px;
  padding: 22px 24px 24px;
}

.manual-index,
.manual-entry {
  border-color: #d7e6f5;
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(24, 39, 75, .08);
}

.manual-index {
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,251,255,.98)),
    #ffffff;
}

.manual-route-group {
  border-color: #dce9f5;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(31, 41, 55, .045);
}

.manual-route-group-heading {
  background: linear-gradient(90deg, #ffffff 0%, #f6faff 100%);
}

.manual-index .manual-process-card {
  border-radius: 12px;
  box-shadow: 0 8px 16px rgba(31, 41, 55, .035);
}

.manual-index .manual-process-card:hover,
.manual-index .manual-process-card:focus-visible {
  box-shadow: 0 14px 28px rgba(37, 79, 120, .12);
  transform: translateY(-2px);
}

.manual-entry h3 {
  font-weight: 700;
}

.manual-menu-tabs {
  display: flex;
  gap: 10px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px 2px 8px;
  scrollbar-width: thin;
  scrollbar-color: #9bb8d6 transparent;
}

.manual-menu-tab {
  align-items: center;
  background: linear-gradient(180deg, #ffffff, #f3f8fd);
  border: 1px solid #cfe0f2;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(22, 53, 84, .07);
  color: #17446e;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 900;
  gap: 13px;
  justify-content: space-between;
  min-height: 48px;
  min-width: 150px;
  overflow: hidden;
  padding: 10px 13px 12px 14px;
  position: relative;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, color .2s ease;
}

.manual-menu-tab::before {
  background: transparent;
  border-radius: 999px;
  bottom: 6px;
  content: "";
  height: 3px;
  left: 13px;
  position: absolute;
  right: 13px;
  transform: scaleX(.32);
  transform-origin: left center;
  transition: background .2s ease, transform .2s ease;
}

.manual-menu-tab:hover,
.manual-menu-tab:focus-visible {
  background: linear-gradient(180deg, #fbfdff, #eaf3fb);
  border-color: #9fc3e4;
  box-shadow: 0 16px 30px rgba(37, 79, 120, .14);
  outline: none;
  transform: translateY(-2px);
}

.manual-menu-tab.active {
  background: linear-gradient(135deg, #2f669b, #4d8dcc);
  border-color: #2f669b;
  box-shadow: 0 18px 34px rgba(47, 102, 155, .24);
  color: #ffffff;
}

.manual-menu-tab.active::before {
  background: var(--accent);
  transform: scaleX(1);
}

.manual-menu-tab strong {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f2;
  border-radius: 999px;
  color: #17446e;
  display: inline-flex;
  font-size: 12px;
  justify-content: center;
  min-height: 26px;
  min-width: 32px;
  padding: 0 9px;
}

.manual-menu-tab.active strong {
  background: rgba(255, 255, 255, .16);
  border-color: rgba(255, 255, 255, .52);
  color: #ffffff;
}

.manual-active-menu-panel {
  animation: manualPanelReveal .22s ease both;
  display: grid;
  gap: 8px;
}

@keyframes manualPanelReveal {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.menu-accordion {
  border-color: #dfe9f4;
  border-radius: 10px;
}

.menu-accordion-header {
  min-height: 48px;
}

.resource-row {
  border-color: #e0eaf4;
  box-shadow: 0 8px 18px rgba(31, 41, 55, .035);
}

.help-footer {
  margin-top: 22px;
  padding: 24px 30px;
}

.help-footer h2 {
  font-size: 17px;
}

.social-link {
  border-radius: 9px;
  height: 40px;
  width: 40px;
}

.support-hours {
  gap: 10px;
}

.support-hours li {
  font-size: 14px;
}

.support-hours li:last-child a {
  background: rgba(255, 194, 10, .14);
  border: 1px solid rgba(255, 194, 10, .38);
  border-radius: 999px;
  padding: 4px 10px;
}

@media (max-width: 1020px) {
  .quick-grid {
    justify-content: center;
  }

  .quick-card {
    flex-basis: min(31%, 230px);
    max-width: 230px;
  }

  .support-resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .public-module-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  #videoList .menu-accordion-body.compact-video-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #updatesList .public-update-row,
  #updatesList .public-update-row.no-media {
    grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
  }

  #updatesList .update-card-actions {
    grid-column: 2;
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .manual-app {
    width: min(100% - 24px, 1380px);
  }

  .help-hero > div:first-child {
    padding: 18px;
  }

  .help-search-panel,
  .home-updates,
  .manual-layout {
    padding: 20px 18px;
  }

  .platform-update-callout {
    inset: 0;
    margin: 0;
    max-height: none;
    overflow: auto;
    padding: 18px;
    width: auto;
  }

  .platform-update-window-head,
  .platform-update-window-body {
    width: min(100%, 760px);
  }

  .platform-update-actions {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .platform-update-actions button {
    width: 100%;
  }

  #view-manual .profile-selection-step,
  #view-videos .profile-selection-step,
  #view-novedades .profile-selection-step,
  .manual-search-panel,
  .tutorial-filters {
    padding: 16px 18px;
  }

  .guided-profile-cards {
    grid-template-columns: 1fr;
  }

  #view-manual .guided-profile-card,
  #view-videos .guided-profile-card,
  #view-novedades .guided-profile-card {
    gap: 12px;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    min-height: auto;
    padding: 14px;
  }

  .guided-profile-art {
    border-radius: 16px;
    height: 62px;
    width: 62px;
  }

  .guided-profile-art svg {
    height: 38px;
    width: 38px;
  }

  .guided-profile-action {
    grid-column: 2 / -1;
  }

  .platform-update-close {
    margin-left: auto;
  }

  .platform-update-icon {
    height: 42px;
    width: 42px;
  }

  .platform-update-window-head strong {
    font-size: 15px;
  }

  .platform-update-window-body h3 {
    font-size: 16px;
  }

  .platform-update-window-body span {
    border-radius: 12px;
    display: block;
    overflow-wrap: anywhere;
  }

  .quick-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .support-resource-grid {
    grid-template-columns: 1fr !important;
  }

  .quick-card {
    max-width: none;
    min-height: 190px;
  }

  #videoList .menu-accordion-body.compact-video-grid {
    grid-template-columns: 1fr !important;
  }

  #updatesList.public-updates-list {
    padding: 16px 18px 20px;
  }

  #updatesList .public-update-row,
  #updatesList .public-update-row.no-media {
    grid-template-columns: 1fr;
    padding: 12px;
  }

  #updatesList .update-image-button {
    min-height: 170px;
  }

  #updatesList .update-image-button img {
    max-height: 190px;
  }

  #updatesList .update-card-actions {
    grid-column: auto;
  }

  #videoList .compact-video-card .video-preview {
    max-height: none !important;
  }
}

@media (max-width: 720px) {
  .manual-app {
    padding-bottom: 28px;
    width: min(100% - 20px, 1380px);
  }

  .main-menu.help-menu {
    border-radius: 12px;
    gap: 8px;
    padding: 8px;
  }

  .main-menu.help-menu button,
  .main-menu.help-menu a {
    font-size: 12px;
    min-height: 42px;
    padding: 8px 10px;
  }

  .help-menu button svg,
  .help-menu a svg {
    height: 16px;
    margin-right: 6px;
    width: 16px;
  }

  .help-hero h1 {
    font-size: 28px;
    line-height: 1.08;
  }

  .help-hero p {
    font-size: 13px;
    line-height: 1.45;
  }

  .brand-logo-main {
    width: 150px;
  }

  .help-search-panel label {
    font-size: 24px;
    gap: 10px;
  }

  .home-search-input {
    grid-template-columns: 20px minmax(0, 1fr);
    min-height: 48px;
    padding: 0 13px;
  }

  .home-search-input input {
    font-size: 14px;
    min-width: 0;
    text-overflow: ellipsis;
  }

  .quick-card {
    align-items: center;
    gap: 12px 16px;
    grid-template-columns: 64px minmax(0, 1fr);
    justify-items: start;
    min-height: auto;
    padding: 18px;
    text-align: left;
  }

  .quick-card-icon {
    grid-row: span 3;
    height: 58px;
    width: 58px;
  }

  .quick-card strong,
  .quick-card small,
  .quick-card em {
    max-width: 100%;
    min-width: 0;
  }

  .chat-launcher-hint {
    display: none;
  }

  .floating-chat {
    bottom: 18px;
    height: min(520px, calc(100vh - 36px));
    max-height: calc(100vh - 36px);
    right: 10px;
    width: calc(100vw - 20px);
  }

  .floating-chat .chat-messages {
    min-height: 260px;
  }
}

@media (max-width: 420px) {
  .manual-app {
    width: min(100% - 14px, 1380px);
  }

  .main-menu.help-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .main-menu.help-menu .admin-link {
    grid-column: span 2;
  }

  .help-hero > div:first-child {
    padding: 16px;
  }

  .help-hero h1 {
    font-size: 25px;
  }

  .help-search-panel label {
    font-size: 22px;
  }

  .quick-card {
    grid-template-columns: 52px minmax(0, 1fr);
    padding: 16px;
  }

  .platform-update-callout {
    inset: 0;
    padding: 12px;
  }

  .platform-update-close {
    margin-left: auto;
  }

  .quick-card-icon {
    height: 50px;
    width: 50px;
  }
}

/* Novedades: listado limpio y detalle compacto en la misma ventana. */
.updates-modal-item {
  align-items: stretch;
  grid-template-columns: 122px minmax(0, 1fr);
  min-height: 132px;
  padding: 12px;
}

.updates-modal-item > div {
  align-content: center;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.updates-modal-image,
.updates-modal-icon {
  align-self: stretch;
  min-height: 108px;
}

.updates-modal-image img {
  height: 100%;
  max-height: 130px;
}

.updates-modal-item .route,
.updates-modal-route {
  color: #17446e;
  display: -webkit-box;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.35;
  margin: 0;
  overflow: hidden;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.updates-modal-item .rich-update-description,
.updates-modal-item > div > p:not(.route):not(.updates-modal-route) {
  display: none !important;
}

.updates-modal-actions .updates-modal-back {
  background: #eef7ff;
  border-color: #c8dff4;
  color: #17456e;
  margin-right: auto;
}

.updates-modal-list.is-detail-view {
  max-height: none;
  overflow: visible;
  padding: 12px 14px 4px;
}

.updates-modal.is-detail-mode {
  max-height: min(88vh, 760px);
  max-width: 940px;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  background: linear-gradient(90deg, #075e54 0%, #128c7e 100%);
  padding: 14px 64px 12px 18px;
}

.updates-modal.is-detail-mode .updates-modal-heading .eyebrow {
  color: #c9fff3;
  min-height: 18px;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(20px, 2.5vw, 26px);
  margin: 6px 0 4px;
}

.updates-modal.is-detail-mode .updates-modal-heading p {
  color: rgba(255,255,255,.92);
  display: -webkit-box;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  max-width: 680px;
  overflow: hidden;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.updates-modal.is-detail-mode .updates-modal-count {
  background: rgba(255,255,255,.16);
  border-color: rgba(255,255,255,.34);
  color: #ffffff;
  margin-top: 8px;
}

.updates-modal-detail {
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  border: 1px solid #dbe7f3;
  border-radius: 14px;
  display: grid;
  gap: 12px 14px;
  grid-template-columns: minmax(320px, 1.08fr) minmax(260px, .92fr);
  overflow: hidden;
  padding: 12px;
}

.updates-modal-detail-meta {
  display: none;
}

.update-detail-image {
  align-self: stretch;
  border-radius: 12px;
  border-width: 1px;
  margin: 0;
  min-height: 280px;
}

.update-detail-image img {
  height: 100%;
  max-height: 380px;
  object-fit: contain;
  padding: 10px;
}

.update-detail-body {
  align-self: start;
  color: #415670;
  font-size: 13px;
  line-height: 1.48;
  min-width: 0;
  padding: 0;
}

.update-detail-body .route {
  background: #f0f7ff;
  border: 1px solid #d4e6f8;
  border-radius: 10px;
  color: #17446e;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.35;
  margin: 0 0 10px;
  padding: 8px 10px;
  text-transform: uppercase;
}

.update-detail-body .rich-update-description {
  color: #415670;
  font-size: 13px;
  line-height: 1.42;
}

.updates-modal-detail-empty {
  align-items: center;
  background: #eef6ff;
  border: 1px solid #cfe0f2;
  border-radius: 12px;
  color: #17446e;
  display: flex;
  font-size: 16px;
  font-weight: 900;
  justify-content: center;
  margin: 0;
  min-height: 120px;
}

.updates-modal-detail .update-detail-actions {
  border-top: 1px solid #e1ebf5;
  grid-column: 1 / -1;
  justify-content: flex-end;
  margin: 0 -12px -12px;
  padding: 10px 12px 12px;
}

@media (max-width: 720px) {
  .updates-modal-item {
    grid-template-columns: 92px minmax(0, 1fr);
    min-height: 108px;
    padding: 10px;
  }

  .updates-modal-image,
  .updates-modal-icon {
    min-height: 86px;
  }

  .updates-modal-image img {
    max-height: 96px;
    padding: 4px;
  }

  .updates-modal.is-detail-mode {
    max-height: calc(100dvh - 16px);
  }

  .updates-modal.is-detail-mode .updates-modal-heading {
    padding: 16px 58px 14px 18px;
  }

  .updates-modal-list.is-detail-view {
    padding: 12px 10px 0;
  }

  .updates-modal-detail {
    gap: 10px;
    grid-template-columns: 1fr;
    padding: 10px;
  }

  .update-detail-image {
    min-height: 190px;
  }

  .update-detail-image img {
    max-height: 230px;
    padding: 8px;
  }

  .updates-modal-detail .update-detail-actions {
    justify-content: stretch;
    margin: 0 -10px -10px;
    padding: 10px;
  }

  .updates-modal-detail .update-detail-actions button,
  .updates-modal-detail .update-detail-actions a {
    width: 100%;
  }
}

/* Ajuste fino: menos alto de imagen para que el texto del detalle respire sin scroll. */
.updates-modal.is-detail-mode {
  max-width: 900px;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  padding-bottom: 10px;
  padding-top: 12px;
}

.updates-modal-detail {
  grid-template-columns: minmax(280px, .95fr) minmax(280px, 1.05fr);
}

.updates-modal-detail .update-detail-image {
  align-self: start;
  max-height: 300px;
  min-height: 0;
}

.updates-modal-detail .update-detail-image img {
  height: auto;
  max-height: 300px;
  padding: 8px;
}

.updates-modal-detail .update-detail-body .route {
  margin-bottom: 8px;
  padding: 7px 9px;
}

.updates-modal-detail .update-detail-body .rich-update-description {
  line-height: 1.38;
}

@media (max-width: 720px) {
  .updates-modal-detail {
    grid-template-columns: 1fr;
  }

  .updates-modal-detail .update-detail-image,
  .updates-modal-detail .update-detail-image img {
    max-height: 190px;
  }
}

/* Encabezado del detalle: sin ruta arriba y con título en una línea. */
.updates-modal.is-detail-mode .updates-modal-heading {
  display: block;
  min-height: 118px;
  padding: 16px 250px 14px 22px;
  position: relative;
}

.updates-modal.is-detail-mode .updates-modal-heading .eyebrow {
  display: block;
  margin-bottom: 8px;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(20px, 2.25vw, 25px);
  line-height: 1.08;
  margin: 0;
  max-width: 100%;
  overflow: visible;
  white-space: nowrap;
}

.updates-modal.is-detail-mode .updates-modal-heading p {
  display: none;
}

.updates-modal.is-detail-mode .updates-modal-count {
  margin: 0;
  position: absolute;
  right: 66px;
  top: 26px;
  white-space: nowrap;
}

@media (max-width: 820px) {
  .updates-modal.is-detail-mode .updates-modal-heading {
    min-height: 126px;
    padding: 16px 62px 14px 20px;
  }

  .updates-modal.is-detail-mode .updates-modal-count {
    display: inline-flex;
    margin-top: 10px;
    position: static;
  }

  .updates-modal.is-detail-mode .updates-modal-heading h2 {
    font-size: 23px;
    white-space: normal;
  }
}

/* Modal de novedades: evita que el cuarto registro quede cortado en escritorio. */
@media (min-width: 760px) {
  .updates-modal:not(.is-detail-mode) {
    max-height: calc(100dvh - 28px);
    max-width: 940px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-heading {
    padding-bottom: 20px;
    padding-top: 22px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-profile-filters {
    padding-bottom: 10px;
    padding-top: 10px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-list {
    gap: 10px;
    grid-template-columns: 1fr;
    max-height: none;
    overflow: visible;
    padding: 14px 24px 4px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    align-items: center;
    gap: 14px;
    grid-template-columns: 118px minmax(0, 1fr);
    min-height: 104px;
    padding: 10px 12px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-image,
  .updates-modal:not(.is-detail-mode) .updates-modal-icon {
    min-height: 84px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-meta {
    gap: 5px;
    margin-bottom: 2px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-meta span {
    font-size: 10px;
    padding: 6px 8px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item strong {
    font-size: 18px;
    line-height: 1.18;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-route {
    font-size: 11px;
    -webkit-line-clamp: 1;
  }

  .updates-modal:not(.is-detail-mode) .update-inline-actions {
    margin-top: 5px;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-actions {
    margin-top: 8px;
    padding: 14px 24px 18px;
  }
}

/* Herramientas: tarjetas mas claras y cercanas al flujo visual del inicio. */
.support-panel .support-resource-grid {
  gap: 18px;
  padding: 26px;
}

.support-panel .support-resource-card {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(244, 250, 255, 0.96));
  border: 1px solid #c8ddf2;
  border-radius: 14px;
  box-shadow: 0 20px 44px rgba(31, 63, 99, 0.08);
  gap: 18px;
  min-height: 252px;
  overflow: hidden;
  padding: 22px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.support-panel .support-resource-card::before {
  background: linear-gradient(90deg, #2f68a0, #55a4e8);
  height: 4px;
}

.support-panel .support-resource-card::after {
  background: rgba(77, 138, 204, 0.12);
  border-radius: 0 0 0 34px;
  content: "";
  height: 64px;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 4px;
  width: 64px;
}

.support-panel .support-resource-card:nth-child(1)::before {
  background: linear-gradient(90deg, #159a83, #4d8acc);
}

.support-panel .support-resource-card:nth-child(2)::before {
  background: linear-gradient(90deg, #2f68a0, #7aa7dd);
}

.support-panel .support-resource-card:nth-child(3)::before {
  background: linear-gradient(90deg, #0f8e80, #f6b800);
}

.support-panel .support-resource-card:nth-child(4)::before {
  background: linear-gradient(90deg, #316da7, #21ad74);
}

.support-panel .support-resource-card:hover,
.support-panel .support-resource-card:focus-visible {
  border-color: #8fb8df;
  box-shadow: 0 26px 52px rgba(31, 63, 99, 0.14);
  transform: translateY(-3px);
}

.support-panel .support-resource-icon {
  background: #eaf4ff;
  border-color: #bfdbf5;
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 12px 24px rgba(49, 109, 167, 0.1);
  color: #245782;
  height: 64px;
  position: relative;
  width: 64px;
  z-index: 1;
}

.support-panel .support-resource-icon svg {
  height: 31px;
  width: 31px;
}

.support-panel .support-resource-content {
  align-content: start;
  gap: 9px;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.support-resource-tag {
  align-items: center;
  background: #e9f4ff;
  border: 1px solid #c8def4;
  border-radius: 999px;
  color: #1e5687;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  justify-self: start;
  line-height: 1;
  padding: 6px 10px;
  text-transform: uppercase;
}

.support-panel .support-resource-content strong {
  color: #102842;
  font-size: 22px;
  line-height: 1.12;
}

.support-panel .support-resource-content small {
  color: #46617e;
  font-size: 14px;
  line-height: 1.52;
}

.support-panel .support-resource-content em,
.support-panel .ip-action-link {
  align-items: center;
  align-self: end;
  background: #eaf4ff;
  border: 1px solid #bdd8f3;
  border-radius: 999px;
  color: #174d7e;
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  justify-self: start;
  min-height: 38px;
  padding: 0 14px;
  text-decoration: none;
}

.support-panel .support-resource-card:hover .support-resource-content em,
.support-panel .support-resource-card:focus-visible .support-resource-content em,
.support-panel .ip-action-link:hover,
.support-panel .ip-action-link:focus-visible {
  background: #2f68a0;
  border-color: #2f68a0;
  color: #ffffff;
}

.support-panel .ip-support-card {
  min-height: 252px;
}

.support-panel .ip-support-box {
  background: #f8fcff;
  border-color: #c9ddf1;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  position: relative;
  z-index: 1;
}

.support-panel .install-resource-card[hidden] {
  display: none;
}

/* Pulido visual de las secciones públicas: avisos, preguntas frecuentes y herramientas. */
:root {
  --public-ink: #102d4d;
  --public-muted: #58708c;
  --public-line: #cfe1f3;
  --public-blue: #2f79ba;
  --public-blue-dark: #15578f;
  --public-teal: #0e9f82;
}

/* Avisos de actualización: una ventana más ligera, con jerarquía clara y acento por sección. */
.platform-update-callout {
  background:
    radial-gradient(circle at 15% 20%, rgba(108, 184, 238, .16), transparent 34%),
    rgba(7, 26, 48, .66);
  backdrop-filter: blur(10px) saturate(1.08);
  padding: clamp(18px, 4vw, 34px);
}

.platform-update-window-head,
.platform-update-window-body {
  width: min(780px, calc(100vw - 36px));
}

.platform-update-window-head {
  background:
    radial-gradient(circle at 88% 14%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(120deg, #1f5f98, #4a93d4);
  border-radius: 22px 22px 0 0;
  min-height: 70px;
  padding: 14px 18px;
  position: relative;
  overflow: hidden;
}

.platform-update-window-head::after {
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  content: "";
  height: 170px;
  pointer-events: none;
  position: absolute;
  right: -72px;
  top: -100px;
  width: 170px;
}

.platform-update-window-head strong {
  font-size: 17px;
  letter-spacing: -.01em;
  position: relative;
  z-index: 1;
}

.platform-update-window-body {
  border-color: rgba(201, 221, 239, .96);
  border-radius: 0 0 22px 22px;
  box-shadow: 0 32px 90px rgba(3, 24, 48, .34);
  gap: 14px;
  padding: 25px 26px 26px;
}

.platform-update-window-body h3 {
  color: var(--public-ink);
  font-size: clamp(19px, 2.3vw, 23px);
  letter-spacing: -.02em;
}

.platform-update-window-body p {
  color: var(--public-muted);
  font-size: 15px;
  line-height: 1.65;
}

.platform-update-window-body span {
  background: linear-gradient(135deg, #f1f8ff, #e8f3ff);
  border: 1px solid #c9e0f6;
  border-left: 4px solid #3a8bca;
  border-radius: 13px;
  color: #285477;
  font-size: 13px;
  line-height: 1.5;
  padding: 12px 14px;
}

.platform-update-actions {
  margin-top: 4px;
}

.platform-update-actions button {
  background: linear-gradient(105deg, #185b94, #4a93d4);
  min-height: 45px;
  padding: 0 24px;
  transition: box-shadow .2s ease, transform .2s ease, filter .2s ease;
}

.platform-update-actions button:hover,
.platform-update-actions button:focus-visible {
  filter: saturate(1.08) brightness(1.04);
}

.platform-update-icon {
  background: rgba(255,255,255,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 8px 20px rgba(0,0,0,.12);
  position: relative;
  z-index: 1;
}

.video-platform-callout .platform-update-window-head {
  background:
    radial-gradient(circle at 88% 14%, rgba(255,255,255,.2), transparent 28%),
    linear-gradient(120deg, #c91f35, #f05a58);
}

.video-platform-callout .platform-update-window-body span {
  background: linear-gradient(135deg, #fff5f5, #fff0f0);
  border-color: #ffd4d4;
  border-left-color: #e33c46;
  color: #772b31;
}

/* Preguntas frecuentes: filtros y respuestas con apariencia de panel de ayuda. */
.faq-panel {
  background: linear-gradient(180deg, rgba(244, 250, 255, .72), rgba(255,255,255,.9));
  border: 1px solid rgba(207, 225, 243, .76);
  border-radius: 22px;
  gap: 20px;
  padding-bottom: 8px;
}

.faq-panel .public-module-hero {
  border-radius: 20px 20px 0 0;
}

.faq-filters {
  background: linear-gradient(135deg, #f7fbff, #edf6ff);
  border-color: #c9def1;
  border-radius: 17px;
  box-shadow: 0 14px 30px rgba(35, 86, 132, .07);
  gap: 15px;
  margin: 0 2px;
  padding: 20px;
}

.faq-filters label {
  color: var(--public-ink);
  font-size: 13px;
  letter-spacing: .01em;
}

.faq-filters input {
  border-color: #bfd7ec;
  border-radius: 13px;
  box-shadow: inset 0 1px 2px rgba(15, 65, 104, .04);
  min-height: 50px;
  padding: 0 16px;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.faq-filters input:focus {
  border-color: #3987c8;
  box-shadow: 0 0 0 4px rgba(57, 135, 200, .13), 0 8px 18px rgba(35, 98, 151, .08);
  transform: translateY(-1px);
}

.faq-profile-filters {
  gap: 9px;
}

.faq-profile-filters button {
  background: rgba(255,255,255,.8);
  min-height: 40px;
  padding: 0 15px;
}

.faq-profile-filters button:hover,
.faq-profile-filters button:focus-visible,
.faq-profile-filters button.active {
  background: linear-gradient(105deg, #118d7d, #21ad91);
  box-shadow: 0 10px 20px rgba(18, 140, 126, .2);
}

.faq-list {
  gap: 13px;
  padding: 0 2px 6px;
}

.faq-card {
  background: linear-gradient(135deg, #ffffff 0%, #fafdff 100%);
  border-color: #c9deef;
  border-radius: 17px;
  box-shadow: 0 10px 24px rgba(22, 63, 102, .065);
  position: relative;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.faq-card::before {
  background: linear-gradient(180deg, #20aa8b, #6cb8ee);
  border-radius: 17px 0 0 17px;
  bottom: 12px;
  content: "";
  left: 0;
  position: absolute;
  top: 12px;
  width: 3px;
}

.faq-card:hover {
  border-color: #a5c9e6;
  box-shadow: 0 18px 34px rgba(22, 63, 102, .11);
  transform: translateY(-2px);
}

.faq-question {
  gap: 18px;
  min-height: 84px;
  padding: 18px 20px 18px 23px;
}

.faq-question small {
  background: #eef7ff;
  border-color: #c8e0f5;
  color: #245d8d;
  margin-bottom: 8px;
  padding: 5px 10px;
}

.faq-question strong {
  color: var(--public-ink);
  font-size: clamp(16px, 1.8vw, 19px);
  letter-spacing: -.01em;
}

.faq-question i {
  background: linear-gradient(135deg, #ecfff7, #dff8ed);
  box-shadow: 0 5px 12px rgba(14, 159, 130, .1);
  flex: 0 0 37px;
  height: 37px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
  width: 37px;
}

.faq-question:hover i,
.faq-question:focus-visible i {
  background: #0e9f82;
  color: #ffffff;
  transform: scale(1.05);
}

.faq-answer {
  background: rgba(243, 249, 255, .7);
  border-top-color: #d7e7f5;
  padding: 0 22px 20px 23px;
}

.faq-answer p {
  color: #3b5976;
  font-size: 14px;
  line-height: 1.7;
  margin: 16px 0 11px;
}

.faq-answer span {
  background: #eaf5ff;
  border: 1px solid #cfe4f5;
  border-radius: 999px;
  color: #2c628f;
  padding: 5px 10px;
}

/* Herramientas: tarjetas con profundidad suave y llamados a la acción consistentes. */
.support-panel {
  background: linear-gradient(180deg, rgba(244,250,255,.78), rgba(255,255,255,.94));
  border: 1px solid rgba(207,225,243,.78);
  border-radius: 22px;
}

.support-panel .support-heading {
  border-radius: 20px 20px 0 0;
}

.support-panel .support-resource-grid {
  gap: 18px;
  padding: 22px;
}

.support-panel .support-resource-card {
  background:
    radial-gradient(circle at 100% 0, rgba(92, 161, 220, .14), transparent 32%),
    linear-gradient(145deg, #ffffff, #f4faff);
  border-color: #c7ddf1;
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(31, 70, 109, .08);
  gap: 15px;
  min-height: 270px;
  padding: 22px;
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.support-panel .support-resource-card::after {
  background: rgba(105, 171, 224, .15);
  border-radius: 0 0 0 52px;
  height: 86px;
  width: 86px;
}

.support-panel .support-resource-card:hover,
.support-panel .support-resource-card:focus-visible {
  border-color: #8dbce1;
  box-shadow: 0 22px 40px rgba(31, 70, 109, .15);
  transform: translateY(-5px);
}

.support-panel .support-resource-icon {
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 10px 20px rgba(42, 112, 171, .13);
  height: 60px;
  width: 60px;
}

.support-panel .support-resource-icon svg {
  height: 29px;
  width: 29px;
}

.support-panel .support-resource-content {
  gap: 8px;
}

.support-panel .support-resource-content strong {
  font-size: clamp(19px, 2vw, 22px);
  letter-spacing: -.02em;
}

.support-panel .support-resource-content small {
  font-size: 13.5px;
  line-height: 1.58;
}

.support-panel .support-resource-content em,
.support-panel .ip-action-link {
  background: linear-gradient(105deg, #e9f5ff, #f2f9ff);
  border-color: #b8d8f2;
  box-shadow: 0 5px 12px rgba(42, 112, 171, .06);
  min-height: 39px;
  padding: 0 15px;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

.support-panel .support-resource-card:hover .support-resource-content em,
.support-panel .support-resource-card:focus-visible .support-resource-content em,
.support-panel .ip-action-link:hover,
.support-panel .ip-action-link:focus-visible {
  background: linear-gradient(105deg, #256ca5, #3d8dcc);
  border-color: #256ca5;
  color: #ffffff;
  transform: translateY(-1px);
}

@media (max-width: 1020px) {
  .support-panel .support-resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .platform-update-callout {
    padding: 14px;
  }

  .platform-update-window-head,
  .platform-update-window-body {
    width: min(100%, 780px);
  }

  .platform-update-window-body {
    padding: 21px 18px 20px;
  }

  .platform-update-window-head {
    min-height: 62px;
    padding: 12px 14px;
  }

  .platform-update-window-head strong {
    font-size: 15px;
  }

  .faq-panel,
  .support-panel {
    border-radius: 17px;
  }

  .faq-filters {
    margin: 0;
    padding: 16px;
  }

  .faq-question {
    min-height: 76px;
    padding: 16px 16px 16px 19px;
  }

  .faq-question strong {
    font-size: 16px;
  }

  .faq-answer {
    padding-left: 19px;
    padding-right: 17px;
  }

  .support-panel .support-resource-grid {
    grid-template-columns: 1fr !important;
    padding: 16px;
  }

  .support-panel .support-resource-card {
    min-height: 240px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq-card,
  .faq-question i,
  .support-panel .support-resource-card,
  .support-panel .support-resource-content em,
  .support-panel .ip-action-link,
  .faq-filters input,
  .platform-update-actions button {
    transition: none;
  }
}

@media (max-width: 1020px) {
  .support-panel .support-resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  .support-panel .support-resource-grid {
    gap: 14px;
    grid-template-columns: 1fr !important;
    padding: 16px;
  }

  .support-panel .support-resource-card {
    gap: 14px;
    min-height: auto;
    padding: 18px;
  }

  .support-panel .support-resource-icon {
    height: 58px;
    width: 58px;
  }
}

/* Pie de pagina compacto tipo franja institucional. */
.help-footer {
  align-items: center !important;
  background:
    linear-gradient(108deg, #043b70 0%, #07558f 52%, #0f6cb1 100%) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 42px rgba(11, 42, 74, 0.14);
  display: grid !important;
  gap: 28px !important;
  grid-template-columns: minmax(150px, 0.58fr) minmax(290px, 1.25fr) minmax(360px, 1.1fr) !important;
  margin-top: 20px !important;
  min-height: 92px;
  overflow: hidden;
  padding: 16px 34px !important;
  position: relative;
}

.help-footer::after {
  background: linear-gradient(135deg, rgba(73, 154, 216, 0), rgba(73, 154, 216, 0.36));
  bottom: 0;
  content: "";
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 26%;
}

.help-footer-brand,
.help-footer-column {
  position: relative;
  z-index: 1;
}

.help-footer-brand {
  color: #ffffff;
  display: grid;
  font-family: "Brush Script MT", "Segoe Script", cursive;
  font-size: 31px;
  font-style: italic;
  font-weight: 700;
  justify-items: start;
  line-height: 0.82;
  padding: 0 24px 8px 0;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.help-footer-brand::after {
  background: #ffc20a;
  border-radius: 999px;
  bottom: 0;
  content: "";
  height: 4px;
  left: 22px;
  position: absolute;
  transform: rotate(-12deg);
  width: 88px;
}

.help-footer-brand span:last-child {
  padding-left: 27px;
}

.help-footer-column {
  align-items: center;
  display: grid;
  gap: 9px;
}

.help-footer-column + .help-footer-column,
.help-footer-column:first-of-type {
  border-left: 1px solid rgba(255, 255, 255, 0.52);
  padding-left: 28px;
}

.help-footer h2 {
  color: #ffffff !important;
  font-size: 15px !important;
  line-height: 1.1;
}

.help-footer .social-links {
  gap: 11px !important;
}

.help-footer .social-link {
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
  color: #ffffff !important;
  height: 36px !important;
  width: 36px !important;
}

.help-footer .social-link svg {
  height: 21px !important;
  width: 21px !important;
}

.help-footer .social-link.whatsapp {
  background: #25d366 !important;
}

.help-footer .social-link.facebook {
  background: #2f8df2 !important;
}

.help-footer .social-link.youtube {
  background: #ff2a2a !important;
}

.help-footer .social-link.instagram {
  background: linear-gradient(135deg, #7046ff, #f23f93 55%, #ffc24a) !important;
}

.help-footer .social-link.twitter {
  background: #0e497a !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.75), 0 8px 18px rgba(0, 0, 0, 0.18);
}

.help-footer .support-hours {
  gap: 5px !important;
}

.help-footer .support-hours li {
  color: #ffffff !important;
  font-size: 13px !important;
  gap: 9px !important;
  line-height: 1.25 !important;
}

.help-footer .support-hours span {
  background: transparent !important;
  border: 0 !important;
  color: #ffffff;
  height: 21px !important;
  width: 21px !important;
}

.help-footer .support-hours svg {
  height: 18px !important;
  width: 18px !important;
}

.help-footer .support-hours li:last-child {
  display: flex !important;
}

.help-footer .support-hours a {
  color: #ffffff !important;
}

@media (max-width: 920px) {
  .help-footer {
    grid-template-columns: 1fr !important;
    justify-items: start;
  }

  .help-footer-column + .help-footer-column,
  .help-footer-column:first-of-type {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.35);
    padding-left: 0;
    padding-top: 16px;
    width: 100%;
  }
}

@media (max-width: 560px) {
  .help-footer {
    padding: 18px 20px !important;
  }

  .help-footer-brand {
    font-size: 28px;
  }
}

/* Overrides finales: mantener el inicio en la version visual nueva. */
.client-masthead.help-hero {
  margin-bottom: 16px !important;
}

.help-hero > div:first-child {
  background:
    radial-gradient(circle at 73% 18%, rgba(115, 194, 255, .42), transparent 23%),
    radial-gradient(circle at 50% 80%, rgba(0, 65, 130, .35), transparent 32%),
    linear-gradient(115deg, #064a8d 0%, #0f69ad 48%, #1e92df 100%) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 34px rgba(18, 74, 127, .22) !important;
  min-height: 156px !important;
  padding: 26px 34px !important;
}

.help-hero-shell {
  align-items: center !important;
  display: grid !important;
  gap: 28px !important;
  grid-template-columns: minmax(280px, 1.05fr) minmax(250px, .9fr) minmax(150px, .35fr) !important;
}

.help-hero h1 {
  font-size: clamp(34px, 4vw, 54px) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  margin: 0 0 10px !important;
}

.help-hero p {
  font-size: clamp(15px, 1.5vw, 18px) !important;
  line-height: 1.45 !important;
  max-width: 520px !important;
}

.quick-grid {
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.quick-card {
  align-content: start !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  border-color: #e1eaf3 !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 26px rgba(31, 41, 55, .055) !important;
  justify-items: start !important;
  min-height: 168px !important;
  padding: 18px 18px 16px !important;
  text-align: left !important;
}

.quick-card-icon {
  border: 0 !important;
  height: 52px !important;
  margin-bottom: 10px !important;
  width: 52px !important;
}

.home-updates {
  background: linear-gradient(180deg, #f6fbff 0%, #ffffff 100%) !important;
  border-color: #cfe3f8 !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 42px rgba(31, 74, 112, .08) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.home-updates .section-heading {
  align-items: center !important;
  border-bottom: 1px solid #dbe7f3 !important;
  display: flex !important;
  justify-content: space-between !important;
  padding: 18px 24px 14px !important;
}

.home-updates .updates-preview-grid {
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: minmax(260px, 1.08fr) repeat(3, minmax(210px, 1fr)) !important;
  padding: 14px 22px 20px !important;
}

.home-updates .updates-preview-list {
  display: contents !important;
}

.home-updates .public-update-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%) !important;
  border: 1px solid #cfe3f8 !important;
  border-radius: 14px !important;
  box-shadow: 0 14px 28px rgba(31, 74, 112, .07) !important;
  min-height: 190px !important;
  padding: 16px 16px 14px !important;
}

.home-updates .public-update-card:first-child {
  grid-column: auto !important;
}

.home-updates .public-update-card::before {
  display: none !important;
}

.home-whatsapp-callout {
  border-radius: 14px !important;
  display: grid !important;
  grid-column: auto !important;
  grid-template-columns: minmax(0, 1fr) 92px !important;
  min-height: 190px !important;
  padding: 16px !important;
}

@media (max-width: 1180px) {
  .help-hero-shell {
    grid-template-columns: minmax(260px, 1fr) minmax(220px, .8fr) !important;
  }

  .help-hero-tagline {
    display: none !important;
  }

  .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1020px) {
  .home-updates .updates-preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .help-hero-shell {
    grid-template-columns: 1fr !important;
  }

  .help-hero-visual {
    display: none !important;
  }
}

@media (max-width: 720px) {
  .quick-grid,
  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr !important;
  }

  .home-updates .section-heading {
    display: grid !important;
  }
}

/* Ajuste compacto del inicio para recuperar proporciones mas comodas. */
.help-home .quick-grid {
  gap: 12px !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  margin: 0 auto 16px !important;
  max-width: 1180px !important;
}

.help-home .quick-card {
  min-height: 154px !important;
  padding: 16px 16px 14px !important;
}

.help-home .quick-card-icon {
  height: 42px !important;
  margin-bottom: 8px !important;
  width: 42px !important;
}

.help-home .quick-card-icon svg {
  height: 22px !important;
  width: 22px !important;
}

.help-home .quick-card strong {
  font-size: 15.5px !important;
  line-height: 1.2 !important;
}

.help-home .quick-card small {
  font-size: 12px !important;
  line-height: 1.38 !important;
  min-height: 46px !important;
}

.help-home .quick-card em {
  font-size: 12px !important;
  margin-top: 8px !important;
}

.home-updates .section-heading {
  padding: 14px 22px 12px !important;
}

.home-updates-title {
  gap: 10px !important;
}

.home-updates-title-icon {
  border-radius: 11px !important;
  flex-basis: 34px !important;
  height: 34px !important;
  width: 34px !important;
}

.home-updates-title-icon svg {
  height: 21px !important;
  width: 21px !important;
}

.home-updates .section-heading h2 {
  font-size: 28px !important;
  line-height: 1.05 !important;
  margin-bottom: 3px !important;
}

.home-updates .section-heading p {
  font-size: 12px !important;
}

.home-updates-actions {
  gap: 8px !important;
}

.home-updates-count,
.home-updates .updates-notice-trigger {
  min-height: 30px !important;
  padding: 7px 11px !important;
}

.home-updates .updates-preview-grid {
  gap: 12px !important;
  grid-template-columns: minmax(245px, .95fr) repeat(3, minmax(195px, 1fr)) !important;
  padding: 12px 18px 16px !important;
}

.home-updates .public-update-card {
  gap: 8px !important;
  min-height: 168px !important;
  padding: 14px 14px 12px !important;
}

.home-update-card-head {
  margin-bottom: 0 !important;
}

.home-update-icon {
  flex-basis: 34px !important;
  height: 34px !important;
  width: 34px !important;
}

.home-update-icon svg {
  height: 18px !important;
  width: 18px !important;
}

.home-update-status {
  font-size: 10px !important;
  padding: 6px 8px !important;
}

.home-updates .public-update-card h3 {
  display: -webkit-box !important;
  font-size: 18px !important;
  line-height: 1.14 !important;
  margin-top: 0 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .public-update-card .route {
  font-size: 10px !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .public-update-card p:not(.route),
.home-updates .public-update-card .rich-update-description {
  display: -webkit-box !important;
  font-size: 12px !important;
  line-height: 1.38 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .update-card-actions button {
  font-size: 12px !important;
  min-height: 32px !important;
  padding: 8px 12px !important;
}

.home-whatsapp-callout {
  gap: 8px !important;
  grid-template-columns: minmax(0, 1fr) 72px !important;
  min-height: 168px !important;
  padding: 14px !important;
}

.home-whatsapp-callout .whatsapp-channel-icon {
  height: 34px !important;
  width: 34px !important;
}

.home-whatsapp-callout .whatsapp-channel-icon svg {
  height: 20px !important;
  width: 20px !important;
}

.home-whatsapp-callout strong {
  font-size: 14px !important;
  max-width: 210px !important;
}

.home-whatsapp-callout p {
  font-size: 11px !important;
  line-height: 1.35 !important;
  max-width: 220px !important;
}

.home-whatsapp-callout .whatsapp-channel-button {
  font-size: 12px !important;
  min-height: 33px !important;
  padding: 8px 13px !important;
}

.whatsapp-card-phone {
  border-radius: 14px !important;
  height: 104px !important;
  width: 58px !important;
}

.whatsapp-card-phone b {
  height: 34px !important;
  left: -13px !important;
  top: 36px !important;
  width: 34px !important;
}

.whatsapp-card-phone svg {
  height: 19px !important;
  width: 19px !important;
}

@media (max-width: 1180px) {
  .help-home .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1020px) {
  .home-updates .updates-preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .help-home .quick-grid,
  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Inicio: mas ancho util, novedades mas limpias y detalle mejor jerarquizado. */
.help-home .quick-grid {
  gap: 14px !important;
  margin: 0 0 18px !important;
  max-width: none !important;
  width: 100% !important;
}

.help-home .quick-card {
  min-height: 170px !important;
  padding: 18px 18px 16px !important;
}

.help-home .quick-card-icon {
  height: 46px !important;
  width: 46px !important;
}

.help-home .quick-card strong {
  font-size: 16px !important;
}

.help-home .quick-card small {
  font-size: 12.5px !important;
  line-height: 1.4 !important;
}

.home-updates .updates-preview-grid {
  gap: 14px !important;
  grid-template-columns: minmax(260px, .86fr) repeat(3, minmax(210px, 1fr)) !important;
  padding: 14px 18px 18px !important;
}

.home-updates .public-update-card {
  min-height: 166px !important;
  padding: 14px 16px !important;
}

.home-updates .public-update-card h3 {
  font-size: 19px !important;
  line-height: 1.13 !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .public-update-card .route {
  background: #eef7ff !important;
  border: 1px solid #d4e6f8 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  font-size: 10px !important;
  line-height: 1.25 !important;
  margin: 2px 0 4px !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 6px 9px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.home-updates .public-update-card .rich-update-description,
.home-updates .public-update-card p:not(.route) {
  display: none !important;
}

.home-updates .update-card-actions {
  margin-top: auto !important;
}

.home-whatsapp-callout {
  min-height: 166px !important;
  padding: 15px !important;
}

.home-whatsapp-callout strong {
  font-size: 15px !important;
}

.home-whatsapp-callout p {
  font-size: 11.5px !important;
}

.updates-modal.is-detail-mode {
  max-width: 940px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  align-items: flex-start !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-height: 0 !important;
  padding: 18px 72px 18px 24px !important;
  position: relative !important;
}

.updates-modal.is-detail-mode .updates-modal-heading > div {
  min-width: 0 !important;
}

.updates-modal.is-detail-mode .updates-modal-heading .eyebrow {
  display: inline-flex !important;
  margin: 0 0 10px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(24px, 2.7vw, 34px) !important;
  line-height: 1.08 !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding-right: 8px !important;
  white-space: normal !important;
}

.updates-modal.is-detail-mode .updates-modal-count {
  align-self: start !important;
  margin: 6px 0 0 !important;
  max-width: 250px !important;
  position: static !important;
  white-space: normal !important;
}

.updates-modal.is-detail-mode .updates-modal-heading p {
  display: none !important;
}

.updates-modal-list.is-detail-view {
  padding: 14px 16px 4px !important;
}

.updates-modal-detail {
  gap: 14px 16px !important;
  grid-template-columns: minmax(300px, .92fr) minmax(300px, 1.08fr) !important;
  padding: 14px !important;
}

.updates-modal-detail .update-detail-body .route {
  margin-bottom: 12px !important;
}

.updates-modal-detail .update-detail-body .rich-update-description {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

@media (max-width: 900px) {
  .updates-modal.is-detail-mode .updates-modal-heading {
    grid-template-columns: 1fr !important;
    padding-right: 64px !important;
  }

  .updates-modal.is-detail-mode .updates-modal-count {
    max-width: 100% !important;
  }

  .updates-modal-detail {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 720px) {
  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Accesos rapidos: banda continua con tarjetas amplias y poco espacio entre ellas. */
.help-home > .quick-grid {
  gap: 10px !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  margin: 0 0 18px !important;
  max-width: none !important;
  width: 100% !important;
}

.help-home > .quick-grid .quick-card {
  border-radius: 8px !important;
  min-height: 150px !important;
  padding: 14px 14px 12px !important;
}

.help-home > .quick-grid .quick-card-icon {
  height: 44px !important;
  margin-bottom: 8px !important;
  width: 44px !important;
}

.help-home > .quick-grid .quick-card strong {
  font-size: 15px !important;
  line-height: 1.16 !important;
}

.help-home > .quick-grid .quick-card small {
  font-size: 12px !important;
  line-height: 1.32 !important;
  min-height: 42px !important;
}

.help-home > .quick-grid .quick-card em {
  font-size: 12px !important;
  margin-top: 7px !important;
}

@media (max-width: 1180px) {
  .help-home > .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .help-home > .quick-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Correccion final real: inicio sin descripcion y ventana flotante con ruta. */
.home-updates .public-update-card .rich-update-description,
.home-updates .public-update-card .rich-update-description p,
.home-updates .public-update-card .rich-update-description ul,
.home-updates .public-update-card .rich-update-description ol {
  display: none !important;
}

.home-updates .public-update-card {
  min-height: 158px !important;
  padding: 16px 16px 15px !important;
}

.home-updates .public-update-card > div {
  align-content: start !important;
  gap: 9px !important;
}

.home-updates .home-update-card-head {
  margin-bottom: 3px !important;
}

.home-updates .public-update-card h3 {
  line-height: 1.18 !important;
}

.home-updates .public-update-card .route {
  line-height: 1.32 !important;
  margin: 0 0 4px !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .update-card-actions {
  margin-top: 8px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-route {
  color: #174d7e !important;
  display: -webkit-box !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: 5px 0 0 !important;
  overflow: hidden !important;
  text-transform: uppercase !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 1 !important;
}

/* Novedades inicio: mas aire entre titulo, ruta y accion. */
.home-updates .public-update-card {
  min-height: 158px !important;
  padding: 16px 16px 15px !important;
}

.home-updates .public-update-card > div {
  align-content: start !important;
  gap: 9px !important;
}

.home-updates .home-update-card-head {
  margin-bottom: 3px !important;
}

.home-updates .public-update-card h3 {
  line-height: 1.18 !important;
  margin-top: 0 !important;
}

.home-updates .public-update-card .route {
  line-height: 1.32 !important;
  margin: 0 0 4px !important;
}

.home-updates .update-card-actions {
  margin-top: 8px !important;
}

/* Correccion final: inicio sin descripcion y ventana flotante con ruta. */
.home-updates .public-update-card .rich-update-description,
.home-updates .public-update-card .rich-update-description p,
.home-updates .public-update-card .rich-update-description ul,
.home-updates .public-update-card .rich-update-description ol {
  display: none !important;
}

.home-updates .public-update-card {
  min-height: 142px !important;
}

.home-updates .public-update-card .route {
  -webkit-line-clamp: 2 !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-route {
  color: #174d7e !important;
  display: -webkit-box !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: 5px 0 0 !important;
  overflow: hidden !important;
  text-transform: uppercase !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 1 !important;
}

/* Novedades del inicio: solo titulo, ruta y accion; descripcion en el detalle. */
.home-updates .public-update-card {
  min-height: 140px !important;
}

.home-updates .public-update-card .rich-update-description,
.home-updates .public-update-card .rich-update-description p,
.home-updates .public-update-card .rich-update-description ul,
.home-updates .public-update-card .rich-update-description ol {
  display: none !important;
}

.home-updates .public-update-card .route {
  -webkit-line-clamp: 2 !important;
}

.home-updates .update-card-actions {
  margin-top: auto !important;
}

/* Actualizaciones recientes: preview compacto con descripcion y menos espacio vacio. */
.home-updates .section-heading {
  align-items: center !important;
  gap: 14px !important;
  min-height: 0 !important;
  padding: 12px 16px 10px !important;
}

.home-updates-title {
  align-items: center !important;
  gap: 10px !important;
}

.home-updates-title-icon {
  border-radius: 10px !important;
  flex: 0 0 36px !important;
  height: 36px !important;
  width: 36px !important;
}

.home-updates-title-icon svg {
  height: 20px !important;
  width: 20px !important;
}

.home-updates .section-heading .eyebrow {
  font-size: 11px !important;
  margin-bottom: 2px !important;
}

.home-updates .section-heading h2 {
  font-size: clamp(24px, 2.35vw, 30px) !important;
  line-height: 1.02 !important;
  margin: 0 !important;
}

.home-updates .section-heading p {
  font-size: 12px !important;
  line-height: 1.25 !important;
  margin-top: 4px !important;
}

.home-updates-actions {
  gap: 8px !important;
}

.home-updates-count,
.home-updates .updates-notice-trigger {
  min-height: 34px !important;
  padding: 8px 13px !important;
}

.home-updates .updates-notice-trigger {
  background: #0e68ad !important;
  border-color: #0e68ad !important;
  color: #ffffff !important;
}

.home-update-profile-filters {
  gap: 8px !important;
  min-height: 0 !important;
  padding: 9px 16px !important;
}

.home-update-profile-filters button {
  min-height: 34px !important;
  padding: 8px 12px !important;
}

.home-updates .updates-preview-grid {
  align-items: stretch !important;
  gap: 10px !important;
  grid-template-columns: minmax(250px, .94fr) repeat(3, minmax(205px, 1fr)) !important;
  padding: 12px 14px 14px !important;
}

.home-updates .updates-preview-list {
  gap: 10px !important;
}

.home-updates .public-update-card {
  border-radius: 10px !important;
  box-shadow: 0 10px 22px rgba(11, 50, 87, .07) !important;
  min-height: 154px !important;
  padding: 12px !important;
}

.home-updates .public-update-card > div {
  align-content: start !important;
  display: grid !important;
  gap: 6px !important;
  min-height: 100% !important;
}

.home-updates .home-update-card-head {
  margin-bottom: 0 !important;
}

.home-updates .home-update-icon {
  border-radius: 12px !important;
  flex: 0 0 34px !important;
  height: 34px !important;
  width: 34px !important;
}

.home-updates .home-update-icon svg {
  height: 18px !important;
  width: 18px !important;
}

.home-updates .updates-preview-list .public-update-card:nth-child(1) .home-update-icon {
  background: linear-gradient(135deg, #52a7ff, #1b7bd0) !important;
  color: #ffffff !important;
}

.home-updates .updates-preview-list .public-update-card:nth-child(2) .home-update-icon {
  background: linear-gradient(135deg, #b47cff, #7c39cf) !important;
  color: #ffffff !important;
}

.home-updates .updates-preview-list .public-update-card:nth-child(3) .home-update-icon {
  background: linear-gradient(135deg, #2bc7a0, #07846a) !important;
  color: #ffffff !important;
}

.home-updates .home-update-status {
  border-radius: 999px !important;
  font-size: 9px !important;
  min-height: 22px !important;
  padding: 5px 8px !important;
}

.home-updates .updates-preview-list .public-update-card:nth-child(2) .home-update-status {
  background: #f2eaff !important;
  color: #6633b4 !important;
}

.home-updates .updates-preview-list .public-update-card:nth-child(3) .home-update-status {
  background: #e4fbf4 !important;
  color: #08765f !important;
}

.home-updates .public-update-card h3 {
  font-size: 15.5px !important;
  line-height: 1.12 !important;
  margin: 0 !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .public-update-card .route {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #0f5795 !important;
  display: -webkit-box !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: -1px 0 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  white-space: normal !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 1 !important;
}

.home-updates .public-update-card .rich-update-description {
  color: #536b84 !important;
  display: -webkit-box !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  max-height: 43px !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

.home-updates .public-update-card .rich-update-description p {
  display: inline !important;
  margin: 0 !important;
}

.home-updates .public-update-card .rich-update-description ul,
.home-updates .public-update-card .rich-update-description ol {
  display: none !important;
}

.home-updates .update-card-actions {
  margin-top: 2px !important;
}

.home-updates .update-card-actions button {
  background: #e9f5ff !important;
  border-color: #badcf7 !important;
  border-radius: 999px !important;
  color: #1163a6 !important;
  font-size: 11px !important;
  min-height: 30px !important;
  padding: 7px 12px !important;
}

.home-whatsapp-callout {
  border-radius: 10px !important;
  grid-template-columns: minmax(0, 1fr) 72px !important;
  min-height: 154px !important;
  overflow: hidden !important;
  padding: 12px !important;
}

.home-whatsapp-callout .whatsapp-card-copy {
  gap: 6px !important;
}

.home-whatsapp-callout strong {
  font-size: 13px !important;
  line-height: 1.13 !important;
}

.home-whatsapp-callout p {
  display: -webkit-box !important;
  font-size: 10.5px !important;
  line-height: 1.28 !important;
  margin: 0 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
}

.home-whatsapp-callout .whatsapp-channel-icon {
  height: 34px !important;
  width: 34px !important;
}

.home-whatsapp-callout .whatsapp-channel-link {
  font-size: 11px !important;
  min-height: 30px !important;
  padding: 8px 12px !important;
}

.home-whatsapp-callout .whatsapp-card-visual {
  min-height: 116px !important;
}

.home-whatsapp-callout .whatsapp-card-phone {
  height: 92px !important;
  width: 55px !important;
}

@media (max-width: 1180px) {
  .home-updates .updates-preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .home-updates .section-heading {
    align-items: flex-start !important;
  }

  .home-updates-actions {
    justify-content: flex-start !important;
  }

  .home-updates .updates-preview-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Detalle de novedad: imagen primero, texto abajo y paleta azul institucional. */
.updates-modal.is-detail-mode {
  background: #ffffff !important;
  border-color: #b9d6f0 !important;
  border-radius: 16px !important;
  max-height: calc(100dvh - 20px) !important;
  max-width: 760px !important;
  overflow: hidden !important;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  background:
    radial-gradient(circle at 86% 18%, rgba(255, 255, 255, .18), transparent 25%),
    linear-gradient(118deg, #064a8d 0%, #0d67a8 56%, #1f8bd5 100%) !important;
  display: grid !important;
  gap: 5px !important;
  min-height: 0 !important;
  padding: 14px 70px 13px 18px !important;
  position: relative !important;
}

.updates-modal.is-detail-mode .updates-modal-heading .eyebrow {
  background: rgba(255, 255, 255, .16) !important;
  border: 1px solid rgba(255, 255, 255, .24) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  justify-self: start !important;
  margin: 0 !important;
  padding: 5px 8px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  color: #ffffff !important;
  font-size: clamp(22px, 3vw, 31px) !important;
  line-height: 1.03 !important;
  margin: 0 !important;
  max-width: 610px !important;
  overflow: visible !important;
  white-space: normal !important;
}

.updates-modal.is-detail-mode .updates-modal-heading p {
  color: rgba(255, 255, 255, .95) !important;
  display: block !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  text-transform: none !important;
}

.updates-modal.is-detail-mode .updates-modal-count {
  background: rgba(255, 255, 255, .14) !important;
  border-color: rgba(255, 255, 255, .34) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  justify-self: start !important;
  margin: 2px 0 0 !important;
  max-width: 100% !important;
  min-height: 26px !important;
  padding: 6px 9px !important;
  position: static !important;
  white-space: normal !important;
}

.updates-modal.is-detail-mode .updates-modal-close {
  background: rgba(255, 255, 255, .18) !important;
  border-color: rgba(255, 255, 255, .34) !important;
  color: #ffffff !important;
  right: 16px !important;
  top: 16px !important;
}

.updates-modal-list.is-detail-view {
  max-height: none !important;
  overflow: visible !important;
  padding: 10px 14px 0 !important;
}

.updates-modal-detail {
  display: grid !important;
  gap: 9px !important;
  grid-template-columns: 1fr !important;
  padding: 0 !important;
}

.updates-modal-detail-meta {
  display: none !important;
}

.updates-modal-detail .update-detail-image {
  align-items: center !important;
  background: #f4f9ff !important;
  border: 1px solid #c6ddf3 !important;
  border-radius: 10px !important;
  display: flex !important;
  justify-content: center !important;
  max-height: 280px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 7px !important;
  width: 100% !important;
}

.updates-modal-detail .update-detail-image img {
  border-radius: 7px !important;
  display: block !important;
  height: auto !important;
  max-height: 264px !important;
  object-fit: contain !important;
  padding: 0 !important;
  width: 100% !important;
}

.updates-modal-detail .update-detail-image strong {
  display: none !important;
}

.updates-modal-detail .updates-modal-detail-empty {
  min-height: 120px !important;
}

.updates-modal-detail .update-detail-body {
  color: #334b66 !important;
  display: grid !important;
  gap: 7px !important;
  padding: 0 3px !important;
}

.updates-modal-detail .update-detail-route-text {
  align-items: center !important;
  background: #f4f9ff !important;
  border: 1px solid #c7def4 !important;
  border-radius: 10px !important;
  color: #174d7e !important;
  display: flex !important;
  flex-wrap: wrap !important;
  font-size: 13px !important;
  gap: 8px !important;
  line-height: 1.35 !important;
  margin: 2px 0 3px !important;
  padding: 8px 10px !important;
  text-transform: none !important;
}

.updates-modal-detail .update-detail-route-label {
  background: #1f5d92 !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;
  padding: 6px 9px !important;
  text-transform: uppercase !important;
}

.updates-modal-detail .update-detail-route-value {
  color: #0b3459 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  overflow-wrap: anywhere !important;
}

.updates-modal-detail .update-detail-body .route {
  display: none !important;
}

.updates-modal-detail .update-detail-body .rich-update-description {
  color: #334b66 !important;
  display: block !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  max-height: 168px !important;
  overflow: hidden !important;
}

.updates-modal-detail .update-detail-body .rich-update-description p {
  margin: 0 0 6px !important;
}

.updates-modal-detail .update-detail-body .rich-update-description ul,
.updates-modal-detail .update-detail-body .rich-update-description ol {
  margin: 5px 0 6px !important;
  padding-left: 0 !important;
}

.updates-modal-detail .update-detail-body .rich-update-description li {
  list-style: none !important;
  margin: 0 0 3px !important;
}

.updates-modal-detail .update-detail-body .rich-update-description li::before {
  color: #1f76bd !important;
  content: "✓ ";
  font-weight: 900;
}

.updates-modal-detail .update-detail-actions {
  border-top: 1px solid #d9e6f2 !important;
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 2px !important;
  padding: 10px 0 0 !important;
}

.updates-modal-detail .update-detail-actions button,
.updates-modal-detail .update-detail-actions a {
  background: #e8f4ff !important;
  border-color: #b9d9f5 !important;
  color: #135c98 !important;
  font-size: 12px !important;
  min-height: 34px !important;
  padding: 8px 14px !important;
}

.updates-modal-actions {
  gap: 10px !important;
}

.updates-modal.is-detail-mode .updates-modal-actions {
  border-top: 0 !important;
  margin-top: 0 !important;
  padding: 12px 24px 14px !important;
}

.updates-modal.is-detail-mode .updates-modal-back {
  background: #e8f4ff !important;
  border-color: #b9d9f5 !important;
  color: #174d7e !important;
}

@media (max-width: 720px) {
  .updates-modal.is-detail-mode {
    max-height: calc(100dvh - 10px) !important;
    max-width: calc(100vw - 10px) !important;
  }

  .updates-modal.is-detail-mode .updates-modal-heading {
    padding: 13px 58px 12px 14px !important;
  }

  .updates-modal.is-detail-mode .updates-modal-heading h2 {
    font-size: 24px !important;
  }

  .updates-modal-detail .update-detail-image {
    max-height: 220px !important;
  }

  .updates-modal-detail .update-detail-image img {
    max-height: 205px !important;
  }

  .updates-modal-detail .update-detail-body .rich-update-description {
    max-height: 190px !important;
  }
}

/* Detalle de novedad: titulo en una linea, sin ruta en encabezado y sin boton interno. */
.updates-modal.is-detail-mode {
  overflow-y: auto !important;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  gap: 4px !important;
  padding: 14px 70px 12px 18px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(21px, 2.45vw, 28px) !important;
  line-height: 1 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.updates-modal.is-detail-mode .updates-modal-heading p {
  display: none !important;
}

.updates-modal.is-detail-mode .updates-modal-count {
  margin: 0 !important;
  max-width: calc(100% - 260px) !important;
  position: absolute !important;
  right: 70px !important;
  top: 16px !important;
  white-space: nowrap !important;
}

.updates-modal-list.is-detail-view {
  padding-bottom: 0 !important;
}

.updates-modal-detail {
  gap: 8px !important;
}

.updates-modal-detail .update-detail-image {
  max-height: 270px !important;
}

.updates-modal-detail .update-detail-image img {
  max-height: 254px !important;
}

.updates-modal-detail .update-detail-body .rich-update-description {
  max-height: none !important;
  overflow: visible !important;
}

.updates-modal-detail .update-detail-actions {
  display: none !important;
}

.updates-modal.is-detail-mode .updates-modal-actions {
  padding-top: 10px !important;
}

@media (max-width: 720px) {
  .updates-modal.is-detail-mode .updates-modal-heading {
    padding: 13px 58px 12px 14px !important;
  }

  .updates-modal.is-detail-mode .updates-modal-heading h2 {
    font-size: clamp(18px, 6vw, 23px) !important;
  }

  .updates-modal.is-detail-mode .updates-modal-count {
    display: inline-flex !important;
    margin-top: 2px !important;
    max-width: 100% !important;
    position: static !important;
  }

  .updates-modal-detail .update-detail-image {
    max-height: 210px !important;
  }

  .updates-modal-detail .update-detail-image img {
    max-height: 196px !important;
  }
}

/* Detalle de novedad: titulo completo sin puntos suspensivos. */
.updates-modal.is-detail-mode {
  max-width: 900px !important;
  width: min(900px, calc(100vw - 18px)) !important;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  padding: 14px 76px 12px 20px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading > div {
  min-width: 0 !important;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(20px, 2.05vw, 25px) !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

.updates-modal.is-detail-mode .updates-modal-count {
  right: 72px !important;
  top: 16px !important;
}

@media (max-width: 760px) {
  .updates-modal.is-detail-mode .updates-modal-heading h2 {
    font-size: clamp(18px, 5vw, 22px) !important;
    white-space: normal !important;
  }
}

/* Mantiene el encabezado y el formulario visibles cuando el historial crece. */
.floating-chat {
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  min-height: 0;
  overflow: hidden;
}

.floating-chat.open {
  display: grid !important;
}

.floating-chat:not(.open) {
  display: none !important;
}

.floating-chat-header {
  flex: 0 0 auto;
  min-height: 58px;
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.floating-chat .chat-panels {
  display: grid;
  min-height: 0;
  overflow: hidden;
}

.floating-chat .chat-panel-support.active {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

.floating-chat .chat-messages {
  height: auto;
  max-height: none;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

.floating-chat .chat-form {
  flex: 0 0 auto;
  min-height: 0;
  position: relative;
  z-index: 2;
}

@media (max-width: 380px) {
  .floating-chat {
    width: calc(100vw - 16px);
  }

  .chat-contact-card {
    grid-template-columns: 1fr;
  }

  .chat-contact-heading,
  .chat-contact-school-field,
  .chat-contact-submit,
  .chat-contact-note {
    grid-column: auto;
  }
}

/* Detalle de novedad: ventana mas amplia y con mejor aire visual. */
.updates-modal.is-detail-mode {
  max-height: calc(100dvh - 44px) !important;
  max-width: 1040px !important;
  min-height: min(690px, calc(100dvh - 44px)) !important;
  width: min(1040px, calc(100vw - 48px)) !important;
}

.updates-modal.is-detail-mode .updates-modal-heading {
  min-height: 86px !important;
  padding: 18px 84px 16px 24px !important;
}

.updates-modal.is-detail-mode .updates-modal-heading h2 {
  font-size: clamp(22px, 2.15vw, 28px) !important;
}

.updates-modal.is-detail-mode .updates-modal-count {
  right: 84px !important;
  top: 18px !important;
}

.updates-modal-list.is-detail-view {
  padding: 16px 20px 0 !important;
}

.updates-modal-detail {
  gap: 12px !important;
}

.updates-modal-detail .update-detail-image {
  max-height: 330px !important;
  padding: 10px !important;
}

.updates-modal-detail .update-detail-image img {
  max-height: 308px !important;
}

.updates-modal-detail .update-detail-body {
  gap: 9px !important;
  padding: 0 4px !important;
}

.updates-modal-detail .update-detail-route-text {
  font-size: 12px !important;
}

.updates-modal-detail .update-detail-body .rich-update-description {
  font-size: 13.5px !important;
  line-height: 1.48 !important;
}

.updates-modal.is-detail-mode .updates-modal-actions {
  padding: 16px 28px 18px !important;
}

.updates-modal.is-detail-mode .updates-modal-back,
.updates-modal.is-detail-mode .secondary {
  min-height: 42px !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
}

@media (max-width: 760px) {
  .updates-modal.is-detail-mode {
    max-height: calc(100dvh - 12px) !important;
    min-height: 0 !important;
    width: calc(100vw - 10px) !important;
  }

  .updates-modal.is-detail-mode .updates-modal-heading {
    min-height: 0 !important;
    padding: 14px 58px 13px 14px !important;
  }

  .updates-modal-list.is-detail-view {
    padding: 12px 12px 0 !important;
  }

  .updates-modal-detail .update-detail-image {
    max-height: 220px !important;
  }

  .updates-modal-detail .update-detail-image img {
    max-height: 200px !important;
  }
}

/* Accesos rapidos: tarjetas mas anchas y juntas. */
.help-home > .quick-grid {
  align-items: stretch !important;
  display: grid !important;
  gap: 8px !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  justify-content: stretch !important;
  margin: 0 0 18px !important;
  max-width: none !important;
  padding: 0 !important;
  width: 100% !important;
}

.help-home > .quick-grid .quick-card {
  max-width: none !important;
  min-height: 162px !important;
  padding: 17px 16px 14px !important;
  width: 100% !important;
}

.help-home > .quick-grid .quick-card-icon {
  height: 54px !important;
  margin-bottom: 12px !important;
  width: 54px !important;
}

.help-home > .quick-grid .quick-card-icon svg {
  height: 25px !important;
  width: 25px !important;
}

.help-home > .quick-grid .quick-card small {
  max-width: 100% !important;
}

@media (max-width: 1180px) {
  .help-home > .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .help-home > .quick-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Correccion final real: inicio sin descripcion y ventana flotante con ruta. */
.home-updates .public-update-card .rich-update-description,
.home-updates .public-update-card .rich-update-description p,
.home-updates .public-update-card .rich-update-description ul,
.home-updates .public-update-card .rich-update-description ol {
  display: none !important;
}

.home-updates .public-update-card {
  min-height: 158px !important;
  padding: 16px 16px 15px !important;
}

.home-updates .public-update-card > div {
  align-content: start !important;
  gap: 9px !important;
}

.home-updates .home-update-card-head {
  margin-bottom: 3px !important;
}

.home-updates .public-update-card h3 {
  line-height: 1.18 !important;
}

.home-updates .public-update-card .route {
  line-height: 1.32 !important;
  margin: 0 0 4px !important;
  -webkit-line-clamp: 2 !important;
}

.home-updates .update-card-actions {
  margin-top: 8px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-route {
  color: #174d7e !important;
  display: -webkit-box !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: 5px 0 0 !important;
  overflow: hidden !important;
  text-transform: uppercase !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 1 !important;
}

/* Ajuste final: modal de novedades con scroll real y paleta azul. */
.updates-modal:not(.is-detail-mode) {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  max-height: calc(100dvh - 24px) !important;
  max-width: 860px !important;
  overflow: hidden !important;
  width: min(860px, calc(100vw - 18px)) !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading {
  min-height: 0 !important;
  padding: 24px 86px 22px 30px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters {
  background: #f6fbff !important;
  border-bottom: 1px solid #dce9f6 !important;
  padding: 10px 26px !important;
}

.updates-modal-profile-filters button:hover,
.updates-modal-profile-filters button:focus-visible,
.updates-modal-profile-filters button.active,
.home-update-profile-filters button:hover,
.home-update-profile-filters button:focus-visible,
.home-update-profile-filters button.active {
  background: #1f5f9b !important;
  border-color: #1f5f9b !important;
  box-shadow: 0 12px 22px rgba(31, 95, 155, .18) !important;
  color: #ffffff !important;
}

.updates-modal-profile-filters button:hover span,
.updates-modal-profile-filters button:focus-visible span,
.updates-modal-profile-filters button.active span,
.home-update-profile-filters button:hover span,
.home-update-profile-filters button:focus-visible span,
.home-update-profile-filters button.active span {
  background: rgba(255, 255, 255, .18) !important;
  border-color: rgba(255, 255, 255, .42) !important;
  color: #ffffff !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-list {
  align-content: start !important;
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: 1fr !important;
  max-height: min(430px, calc(100dvh - 268px)) !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  padding: 14px 26px !important;
  scrollbar-color: #9bb8d6 transparent !important;
  scrollbar-width: thin !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item {
  align-items: center !important;
  gap: 14px !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  min-height: 98px !important;
  padding: 10px 12px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image,
.updates-modal:not(.is-detail-mode) .updates-modal-icon {
  min-height: 84px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item strong {
  font-size: 18px !important;
  line-height: 1.18 !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions {
  border-top: 1px solid #dce9f6 !important;
  margin-top: 0 !important;
  padding: 12px 26px 16px !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button:first-child {
  background: #eef6ff !important;
  border-color: #b8d5ef !important;
  color: #17446e !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button:first-child:hover,
.updates-modal:not(.is-detail-mode) .update-inline-actions button:first-child:focus-visible {
  background: #1f5f9b !important;
  border-color: #1f5f9b !important;
  color: #ffffff !important;
}

@media (max-width: 760px) {
  .updates-modal:not(.is-detail-mode) {
    max-height: calc(100dvh - 12px) !important;
    width: calc(100vw - 10px) !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-heading {
    padding: 18px 58px 17px 18px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-profile-filters,
  .updates-modal:not(.is-detail-mode) .updates-modal-list,
  .updates-modal:not(.is-detail-mode) .updates-modal-actions {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-list {
    max-height: calc(100dvh - 250px) !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    grid-template-columns: 86px minmax(0, 1fr) !important;
  }
}

/* Novedades: primero se selecciona perfil; el encabezado informativo queda al final. */
#view-novedades .updates-selection-step {
  margin-top: 0 !important;
}

#view-novedades > .public-module-hero {
  margin-top: 18px !important;
  order: 5;
}

#updatesFilters[hidden],
#updatesWhatsappCallout[hidden] {
  display: none !important;
}

/* Novedades: se muestran por perfil, sin filtros adicionales. */
#view-novedades #updatesFilters {
  display: none !important;
}

/* Modal de novedades: evita solapamientos al pasar el mouse sobre las filas. */
.updates-modal:not(.is-detail-mode) .updates-modal-list {
  gap: 12px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item {
  align-items: start !important;
  grid-template-columns: 104px minmax(0, 1fr) !important;
  min-height: 128px !important;
  overflow: visible !important;
  padding: 12px 14px !important;
  transform: none !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item:hover,
.updates-modal:not(.is-detail-mode) .updates-modal-item:focus-within {
  box-shadow: 0 12px 24px rgba(31, 95, 155, .1) !important;
  transform: none !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item > div {
  align-content: start !important;
  display: grid !important;
  gap: 6px !important;
  min-height: 104px !important;
  min-width: 0 !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image,
.updates-modal:not(.is-detail-mode) .updates-modal-icon {
  align-self: start !important;
  height: 104px !important;
  max-height: 104px !important;
  min-height: 104px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image img {
  height: 100% !important;
  max-height: 100% !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions {
  align-self: start !important;
  margin-top: 4px !important;
  position: static !important;
  z-index: 1 !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button,
.updates-modal:not(.is-detail-mode) .update-inline-actions a {
  min-height: 32px !important;
}

@media (max-width: 760px) {
  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    grid-template-columns: 82px minmax(0, 1fr) !important;
    min-height: 116px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-image,
  .updates-modal:not(.is-detail-mode) .updates-modal-icon {
    height: 92px !important;
    max-height: 92px !important;
    min-height: 92px !important;
  }
}

/* Modal de novedades movil: sin contador duplicado y filtros completos. */
.updates-modal:not(.is-detail-mode) .updates-modal-count {
  display: none !important;
}

@media (max-width: 760px) {
  .updates-modal:not(.is-detail-mode) .updates-modal-heading {
    padding: 18px 58px 14px 18px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-profile-filters {
    display: grid !important;
    gap: 8px !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding: 10px 14px 12px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button {
    justify-content: space-between !important;
    min-width: 0 !important;
    padding: 0 10px 0 14px !important;
    white-space: normal !important;
    width: 100% !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button span {
    flex: 0 0 auto !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-list {
    max-height: calc(100dvh - 330px) !important;
    padding-top: 12px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    gap: 10px !important;
    grid-template-columns: 76px minmax(0, 1fr) !important;
    min-height: auto !important;
    overflow: hidden !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-image,
  .updates-modal:not(.is-detail-mode) .updates-modal-icon {
    height: 82px !important;
    max-height: 82px !important;
    min-height: 82px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item > div {
    gap: 5px !important;
    min-height: auto !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item strong {
    display: -webkit-box !important;
    font-size: 16px !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-route {
    font-size: 10px !important;
    -webkit-line-clamp: 1 !important;
  }
}

/* Inicio movil: filtros de ultimas actualizaciones completos, sin corte lateral. */
@media (max-width: 720px) {
  .home-updates {
    overflow: hidden !important;
  }

  .home-update-profile-filters {
    display: grid !important;
    gap: 8px !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding: 10px 14px 12px !important;
  }

  .home-update-profile-filters button {
    justify-content: space-between !important;
    min-width: 0 !important;
    padding: 8px 10px 8px 14px !important;
    white-space: normal !important;
    width: 100% !important;
  }

  .home-update-profile-filters button span {
    flex: 0 0 auto !important;
  }
}

/* Encabezado: logo restaurado al estilo inicial. */
.help-hero .hero-device-screen {
  background: linear-gradient(180deg, #ffffff, #dfeeff) !important;
  border-color: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 18px 34px rgba(0, 37, 82, .28) !important;
  padding: 16px !important;
}

.help-hero .hero-device-screen img {
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18) !important;
  max-width: 170px !important;
  width: 78% !important;
}

/* Listados por seccion: encabezados con mas jerarquia visual. */
.manual-route-group {
  border-color: #c9ddf1 !important;
  box-shadow: 0 14px 28px rgba(31, 95, 155, .09) !important;
  overflow: hidden !important;
}

.manual-route-group-heading {
  align-items: center !important;
  background: linear-gradient(90deg, #eaf5ff 0%, #f8fbff 58%, #ffffff 100%) !important;
  border-bottom: 1px solid #cfe2f5 !important;
  box-shadow: inset 4px 0 0 #1f5f9b, 0 10px 20px rgba(31, 95, 155, .08) !important;
  display: flex !important;
  gap: 10px !important;
  justify-content: space-between !important;
  padding: 13px 13px 13px 15px !important;
}

.manual-route-group-heading span {
  color: #082341 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
  text-shadow: 0 1px 0 #ffffff, 0 8px 18px rgba(31, 95, 155, .16) !important;
}

.manual-route-group-heading strong {
  align-items: center !important;
  background: #e5f3ff !important;
  border: 1px solid #b9d8f2 !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px rgba(31, 95, 155, .12) !important;
  color: #1f5f9b !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  justify-content: center !important;
  min-height: 26px !important;
  min-width: 34px !important;
  padding: 0 9px !important;
}

/* Modal de novedades: accion a la derecha para despejar el texto. */
.updates-modal:not(.is-detail-mode) .updates-modal-item {
  grid-template-columns: 104px minmax(0, 1fr) !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item > div {
  align-items: center !important;
  column-gap: 18px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-height: 104px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-meta,
.updates-modal:not(.is-detail-mode) .updates-modal-item strong,
.updates-modal:not(.is-detail-mode) .updates-modal-route {
  grid-column: 1 !important;
  min-width: 0 !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions {
  align-self: end !important;
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
  justify-self: end !important;
  margin: 0 !important;
  max-width: 160px !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button,
.updates-modal:not(.is-detail-mode) .update-inline-actions a {
  justify-content: center !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .updates-modal:not(.is-detail-mode) .updates-modal-item > div {
    grid-template-columns: 1fr !important;
  }

  .updates-modal:not(.is-detail-mode) .update-inline-actions {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start !important;
    margin-top: 4px !important;
    max-width: 100% !important;
  }
}

/* Modal de novedades: acciones alineadas con el contenido. */
.updates-modal:not(.is-detail-mode) .updates-modal-item > div {
  align-items: start !important;
  column-gap: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 104px !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions {
  align-items: center !important;
  align-self: start !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  grid-column: 1 !important;
  grid-row: auto !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  margin: 4px 0 0 !important;
  max-width: none !important;
  width: 100% !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button,
.updates-modal:not(.is-detail-mode) .update-inline-actions a {
  flex: 0 0 auto !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

/* El chat puede ajustarse desde sus bordes y esquinas sin salirse de la pantalla. */
.floating-chat {
  min-width: min(320px, calc(100vw - 16px));
  min-height: min(360px, calc(100vh - 16px));
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px);
  position: fixed;
  resize: none;
}

.floating-chat.chat-resizing,
.floating-chat.chat-resizing * {
  user-select: none !important;
}

.floating-chat-header button {
  pointer-events: auto !important;
  position: relative;
  touch-action: manipulation;
  z-index: 5;
}

.chat-resize-handle {
  position: absolute;
  touch-action: none;
  z-index: 4;
}

.chat-resize-nw,
.chat-resize-ne,
.chat-resize-se,
.chat-resize-sw {
  height: 16px;
  width: 16px;
}

.chat-resize-nw {
  cursor: nwse-resize;
  left: 0;
  top: 0;
}

.chat-resize-ne {
  cursor: nesw-resize;
  right: 0;
  top: 0;
}

.chat-resize-se {
  bottom: 0;
  cursor: nwse-resize;
  right: 0;
}

.chat-resize-sw {
  bottom: 0;
  cursor: nesw-resize;
  left: 0;
}

.chat-resize-n,
.chat-resize-s {
  cursor: ns-resize;
  height: 9px;
  left: 16px;
  right: 16px;
}

.chat-resize-n {
  top: 0;
}

.chat-resize-s {
  bottom: 0;
}

.chat-resize-e,
.chat-resize-w {
  bottom: 16px;
  cursor: ew-resize;
  top: 16px;
  width: 9px;
}

.chat-resize-e {
  right: 0;
}

.chat-resize-w {
  left: 0;
}

.chat-resize-nw::after,
.chat-resize-ne::after,
.chat-resize-se::after,
.chat-resize-sw::after {
  border: 2px solid rgba(18, 140, 126, .35);
  border-radius: 50%;
  content: "";
  height: 5px;
  position: absolute;
  width: 5px;
}

.chat-resize-nw::after {
  left: 3px;
  top: 3px;
}

.chat-resize-ne::after {
  right: 3px;
  top: 3px;
}

.chat-resize-se::after {
  bottom: 3px;
  right: 3px;
}

.chat-resize-sw::after {
  bottom: 3px;
  left: 3px;
}

@media (max-width: 600px) {
  .floating-chat {
    min-width: min(300px, calc(100vw - 16px));
    min-height: min(340px, calc(100vh - 16px));
  }
}

/* Novedades: presentación moderna para la ventana inicial. */
.updates-modal-backdrop {
  animation: updatesBackdropIn .34s cubic-bezier(.22, 1, .36, 1) both !important;
  backdrop-filter: blur(8px) saturate(1.12) !important;
  background: rgba(8, 29, 50, .48) !important;
}

.updates-modal:not(.is-detail-mode) {
  background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%) !important;
  border: 1px solid rgba(190, 216, 238, .96) !important;
  border-radius: 24px !important;
  box-shadow: 0 32px 90px rgba(7, 39, 69, .3), 0 6px 18px rgba(29, 93, 140, .13) !important;
  isolation: isolate;
  max-width: 880px !important;
  transform-origin: 50% 18%;
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading {
  background: linear-gradient(128deg, #164e7f 0%, #2c76b5 53%, #69b7db 100%) !important;
  background-size: 180% 180% !important;
  border-bottom: 1px solid rgba(255, 255, 255, .18) !important;
  min-height: 146px;
  overflow: hidden;
  padding: 30px 82px 27px 30px !important;
  position: relative;
  animation: updatesHeaderShift 11s ease-in-out infinite alternate;
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading::before {
  background: linear-gradient(118deg, transparent 35%, rgba(255,255,255,.13) 35%, rgba(255,255,255,.13) 41%, transparent 41% 100%);
  content: "";
  inset: 0;
  opacity: .8;
  pointer-events: none;
  position: absolute;
  transform: translateX(-18%);
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading::after {
  background: radial-gradient(circle at 76% 26%, rgba(255,255,255,.22), transparent 12%), radial-gradient(circle at 92% 102%, rgba(255,255,255,.16), transparent 34%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading > * {
  position: relative;
  z-index: 1;
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading .eyebrow {
  color: #ffe06a !important;
  font-size: 11px !important;
  letter-spacing: .08em;
  text-shadow: 0 1px 2px rgba(7, 39, 69, .2);
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading h2 {
  letter-spacing: -.025em !important;
  margin-top: 9px !important;
  text-shadow: 0 3px 14px rgba(6, 40, 72, .22);
}

.updates-modal:not(.is-detail-mode) .updates-modal-heading p {
  color: rgba(255, 255, 255, .94) !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-count {
  backdrop-filter: blur(8px);
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.42) !important;
  box-shadow: 0 6px 18px rgba(6, 39, 70, .16);
}

.updates-modal:not(.is-detail-mode) .updates-modal-close {
  backdrop-filter: blur(8px);
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.58) !important;
  box-shadow: 0 6px 16px rgba(7, 39, 69, .16);
  transition: background .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-close:hover,
.updates-modal:not(.is-detail-mode) .updates-modal-close:focus-visible {
  background: rgba(255,255,255,.3) !important;
  box-shadow: 0 9px 20px rgba(7, 39, 69, .22);
  outline: none;
  transform: rotate(5deg) scale(1.05);
}

.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters {
  background: rgba(248, 252, 255, .95) !important;
  border-bottom: 1px solid #dceaf6 !important;
  gap: 9px !important;
  padding: 14px 26px 13px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button {
  background: #ffffff !important;
  border-color: #c8ddef !important;
  box-shadow: 0 2px 8px rgba(25, 88, 135, .06);
  min-height: 36px !important;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button:hover,
.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button:focus-visible,
.updates-modal:not(.is-detail-mode) .updates-modal-profile-filters button.active {
  background: linear-gradient(135deg, #116f9f, #128c7e) !important;
  border-color: #128c7e !important;
  box-shadow: 0 9px 18px rgba(18, 140, 126, .2) !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-list {
  background: linear-gradient(180deg, #f7fbff 0%, #f2f8fd 100%);
  gap: 13px !important;
  padding: 18px 26px 8px !important;
  scrollbar-color: #77a7cc transparent;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item {
  animation: updatesItemIn .42s cubic-bezier(.22, 1, .36, 1) both;
  background: linear-gradient(135deg, #ffffff 0%, #fbfdff 72%, #f1f8fd 100%) !important;
  border: 1px solid #d2e3f1 !important;
  border-radius: 16px !important;
  box-shadow: 0 5px 14px rgba(24, 74, 112, .06) !important;
  overflow: hidden;
  padding: 13px 15px 13px 13px !important;
  position: relative;
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item::before {
  background: linear-gradient(180deg, #ffc20a, #128c7e);
  border-radius: 0 4px 4px 0;
  content: "";
  inset: 13px auto 13px 0;
  opacity: .26;
  position: absolute;
  transform: scaleY(.55);
  transform-origin: center;
  transition: opacity .22s ease, transform .22s ease;
  width: 3px;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item:hover {
  border-color: #a9cce5 !important;
  box-shadow: 0 13px 28px rgba(24, 86, 130, .13) !important;
  transform: translateY(-3px) !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item:hover::before,
.updates-modal:not(.is-detail-mode) .updates-modal-item:focus-within::before {
  opacity: 1;
  transform: scaleY(1);
}

.updates-modal:not(.is-detail-mode) .updates-modal-item img,
.updates-modal:not(.is-detail-mode) .updates-modal-icon,
.updates-modal:not(.is-detail-mode) .updates-modal-image {
  border-radius: 13px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image {
  background: linear-gradient(145deg, #f0f7fd, #dfeefa) !important;
  border-color: #c8deef !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.45), 0 5px 12px rgba(41, 102, 146, .09);
  transition: box-shadow .22s ease, transform .22s ease !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image:hover,
.updates-modal:not(.is-detail-mode) .updates-modal-image:focus-visible {
  box-shadow: 0 9px 20px rgba(35, 99, 145, .18) !important;
  outline: none;
  transform: translateY(-2px);
}

.updates-modal:not(.is-detail-mode) .updates-modal-image img {
  transition: transform .3s ease;
}

.updates-modal:not(.is-detail-mode) .updates-modal-image:hover img,
.updates-modal:not(.is-detail-mode) .updates-modal-image:focus-visible img {
  transform: scale(1.05);
}

.updates-modal:not(.is-detail-mode) .updates-modal-icon {
  background: linear-gradient(145deg, #e9f5ff 0%, #d5edee 100%) !important;
  border-color: #bddbe9 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.62), 0 6px 14px rgba(32, 109, 145, .1);
  color: #0b6f78 !important;
  letter-spacing: .08em;
}

.updates-modal:not(.is-detail-mode) .updates-modal-meta span {
  background: #eff7ff !important;
  border-color: #c9e0f2 !important;
  color: #22577e !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-meta span:last-child {
  background: #eefaf5 !important;
  border-color: #c8e9d9 !important;
  color: #08745e !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-item strong {
  color: #102f50 !important;
  letter-spacing: -.01em;
}

.updates-modal:not(.is-detail-mode) .updates-modal-route {
  color: #306187 !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button,
.updates-modal:not(.is-detail-mode) .update-inline-actions a {
  background: linear-gradient(135deg, #eaf5ff, #f5fbff) !important;
  border-color: #bcd8ed !important;
  box-shadow: 0 3px 8px rgba(29, 91, 136, .06);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button:first-child {
  background: linear-gradient(135deg, #e6f8ef, #f4fcf8) !important;
  border-color: #b4e1ce !important;
  color: #08715d !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button:hover,
.updates-modal:not(.is-detail-mode) .update-inline-actions button:focus-visible,
.updates-modal:not(.is-detail-mode) .update-inline-actions a:hover,
.updates-modal:not(.is-detail-mode) .update-inline-actions a:focus-visible {
  background: linear-gradient(135deg, #116f9f, #128c7e) !important;
  border-color: #128c7e !important;
  box-shadow: 0 8px 16px rgba(18, 140, 126, .2) !important;
  color: #ffffff !important;
  outline: none;
  transform: translateY(-2px);
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions {
  background: rgba(255,255,255,.9) !important;
  border-top-color: #dceaf6 !important;
  gap: 10px !important;
  margin-top: 0 !important;
  padding: 16px 26px 20px !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions button {
  border-radius: 12px !important;
  box-shadow: 0 7px 16px rgba(27, 86, 128, .12);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions button:first-of-type,
.updates-modal:not(.is-detail-mode) .updates-modal-actions #showAllUpdates {
  background: linear-gradient(135deg, #1a5f95, #3d8dcc) !important;
  border-color: #1a5f95 !important;
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions button:hover,
.updates-modal:not(.is-detail-mode) .updates-modal-actions button:focus-visible {
  box-shadow: 0 11px 22px rgba(27, 86, 128, .2) !important;
  outline: none;
  transform: translateY(-2px);
}

.updates-modal:not(.is-detail-mode) .updates-modal-actions button.secondary {
  background: #fff9f9 !important;
  border-color: #f0b6b6 !important;
  box-shadow: none;
}

@keyframes updatesBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes updatesHeaderShift {
  from { background-position: 0% 50%; }
  to { background-position: 100% 50%; }
}

@keyframes updatesItemIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.updates-modal:not(.is-detail-mode) .updates-modal-item:nth-child(2) { animation-delay: .05s; }
.updates-modal:not(.is-detail-mode) .updates-modal-item:nth-child(3) { animation-delay: .1s; }
.updates-modal:not(.is-detail-mode) .updates-modal-item:nth-child(4) { animation-delay: .15s; }

@media (max-width: 760px) {
  .updates-modal:not(.is-detail-mode) {
    border-radius: 18px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-heading {
    min-height: 132px;
    padding: 23px 62px 22px 20px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-heading h2 {
    font-size: clamp(22px, 7vw, 29px) !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-list {
    padding: 14px 14px 6px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    padding: 11px !important;
  }

  .updates-modal:not(.is-detail-mode) .updates-modal-actions {
    padding: 14px 14px 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .updates-modal-backdrop,
  .updates-modal:not(.is-detail-mode) .updates-modal-heading,
  .updates-modal:not(.is-detail-mode) .updates-modal-item {
    animation: none !important;
  }

  .updates-modal:not(.is-detail-mode) *,
  .updates-modal:not(.is-detail-mode) *::before,
  .updates-modal:not(.is-detail-mode) *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Novedades en inicio: acciones en una sola fila. */
.home-updates .updates-preview-list .public-update-card .update-card-actions {
  align-items: center !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  justify-content: flex-start !important;
  margin-top: 2px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto;
  padding-bottom: 1px;
  scrollbar-width: none;
  white-space: nowrap;
}

.home-updates .updates-preview-list .public-update-card .update-card-actions::-webkit-scrollbar {
  display: none;
}

.home-updates .updates-preview-list .public-update-card .update-card-actions button,
.home-updates .updates-preview-list .public-update-card .update-card-actions a {
  align-items: center !important;
  align-self: center !important;
  flex: 0 0 auto !important;
  font-size: 10.5px !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: 30px !important;
  margin-top: 0 !important;
  padding: 6px 10px !important;
  white-space: nowrap !important;
}

.home-updates .updates-preview-list .public-update-card .update-card-actions a {
  background: linear-gradient(135deg, #f0eaff, #faf7ff) !important;
  border-color: #d8c9f6 !important;
  color: #6534b1 !important;
}

.home-updates .updates-preview-list .public-update-card .update-card-actions a:hover,
.home-updates .updates-preview-list .public-update-card .update-card-actions a:focus-visible {
  background: linear-gradient(135deg, #7542cb, #9a68e8) !important;
  border-color: #7542cb !important;
  color: #ffffff !important;
  outline: none;
}

@media (max-width: 420px) {
  .home-updates .updates-preview-list .public-update-card .update-card-actions button,
  .home-updates .updates-preview-list .public-update-card .update-card-actions a {
    font-size: 10px !important;
    padding-left: 9px !important;
    padding-right: 9px !important;
  }
}

/* Ventana de novedades: acciones alineadas hacia el lado derecho. */
.updates-modal:not(.is-detail-mode) .update-inline-actions {
  justify-content: flex-end !important;
  justify-self: end !important;
  margin-left: auto !important;
  width: auto !important;
}

/* Novedades en inicio: todos los botones quedan en la misma altura. */
.home-updates .updates-preview-list .public-update-card > div {
  align-content: stretch !important;
  flex: 1 1 auto !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  min-height: 0 !important;
}

.home-updates .updates-preview-list .public-update-card .update-card-actions {
  align-self: end !important;
  margin-top: 0 !important;
}

/* Accesos rápidos: acabado visual moderno y más atractivo. */
.help-home > .quick-grid {
  gap: 16px !important;
  perspective: 900px;
}

.help-home > .quick-grid .quick-card {
  align-content: stretch !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(228, 243, 255, .9), transparent 38%),
    linear-gradient(145deg, #ffffff 0%, #f7fbff 100%) !important;
  border: 1px solid rgba(199, 220, 239, .92) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(29, 78, 116, .08), inset 0 1px 0 rgba(255,255,255,.94) !important;
  display: grid !important;
  gap: 10px !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  min-height: 192px !important;
  overflow: hidden;
  padding: 18px 17px 16px !important;
  transform: translateZ(0);
  transition: border-color .24s ease, box-shadow .24s ease, transform .24s ease, background .24s ease !important;
}

.help-home > .quick-grid .quick-card::before {
  background: linear-gradient(90deg, #2d86ca, #76c3e8);
  border-radius: 999px;
  content: "";
  height: 4px;
  left: 16px;
  opacity: .88;
  position: absolute;
  right: 16px;
  top: 0;
  transform: scaleX(.35);
  transform-origin: left;
  transition: opacity .24s ease, transform .3s ease;
}

.help-home > .quick-grid .quick-card::after {
  background: linear-gradient(115deg, transparent 18%, rgba(255,255,255,.78) 48%, transparent 72%);
  opacity: 0;
  transform: translateX(-125%);
  transition: opacity .24s ease, transform .55s ease;
}

.help-home > .quick-grid .quick-card > * {
  position: relative;
  z-index: 1;
}

.help-home > .quick-grid .quick-card-icon {
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 8px 16px rgba(33, 101, 151, .12);
  height: 54px !important;
  margin: 0 0 3px !important;
  transition: box-shadow .24s ease, transform .24s ease, filter .24s ease !important;
  width: 54px !important;
}

.help-home > .quick-grid .quick-card-icon svg {
  filter: drop-shadow(0 2px 2px rgba(0,0,0,.08));
  height: 28px !important;
  width: 28px !important;
}

.help-home > .quick-grid .quick-card strong {
  color: #142f4e !important;
  font-size: clamp(15px, 1.18vw, 17px) !important;
  letter-spacing: -.01em;
  line-height: 1.18 !important;
  margin: 0 !important;
}

.help-home > .quick-grid .quick-card small {
  color: #5a718a !important;
  font-size: 12px !important;
  line-height: 1.42 !important;
  margin: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
}

.help-home > .quick-grid .quick-card em {
  align-items: center;
  background: rgba(235, 246, 255, .9);
  border: 1px solid #c5def1;
  border-radius: 999px;
  color: #126aaa !important;
  font-size: 11.5px !important;
  justify-self: start;
  margin: 2px 0 0 !important;
  min-height: 30px;
  padding: 0 11px;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease, color .22s ease, transform .22s ease;
}

.help-home > .quick-grid .quick-card[data-view="manual"]::before {
  background: linear-gradient(90deg, #1588d0, #65b9ec);
}

.help-home > .quick-grid .quick-card[data-view="videos"]::before {
  background: linear-gradient(90deg, #7040ca, #b083fa);
}

.help-home > .quick-grid .quick-card[data-view="novedades"]::before {
  background: linear-gradient(90deg, #e6a900, #ffd766);
}

.help-home > .quick-grid .quick-card[data-view="preguntas"]::before {
  background: linear-gradient(90deg, #0d9a68, #71dfad);
}

.help-home > .quick-grid .quick-card[data-view="herramientas"]::before {
  background: linear-gradient(90deg, #da4b59, #ff9a9f);
}

.help-home > .quick-grid .quick-card:hover,
.help-home > .quick-grid .quick-card:focus-visible {
  background:
    radial-gradient(circle at 100% 0%, rgba(211, 239, 255, .95), transparent 42%),
    linear-gradient(145deg, #ffffff 0%, #f1f8ff 100%) !important;
  border-color: #9bc4e3 !important;
  box-shadow: 0 18px 34px rgba(25, 86, 130, .16), inset 0 1px 0 rgba(255,255,255,.98) !important;
  outline: none;
  transform: translateY(-5px) rotateX(.6deg) !important;
}

.help-home > .quick-grid .quick-card:hover::before,
.help-home > .quick-grid .quick-card:focus-visible::before {
  opacity: 1;
  transform: scaleX(1);
}

.help-home > .quick-grid .quick-card:hover::after,
.help-home > .quick-grid .quick-card:focus-visible::after {
  opacity: 1;
  transform: translateX(125%);
}

.help-home > .quick-grid .quick-card:hover .quick-card-icon,
.help-home > .quick-grid .quick-card:focus-visible .quick-card-icon {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 12px 22px rgba(33, 101, 151, .2);
  filter: saturate(1.08);
  transform: translateY(-3px) rotate(-3deg) scale(1.06);
}

.help-home > .quick-grid .quick-card:hover em,
.help-home > .quick-grid .quick-card:focus-visible em {
  background: linear-gradient(135deg, #126fae, #268ac9);
  border-color: #126fae;
  box-shadow: 0 7px 14px rgba(18, 111, 174, .2);
  color: #ffffff !important;
  transform: translateX(3px);
}

@media (max-width: 700px) {
  .help-home > .quick-grid .quick-card {
    border-radius: 15px !important;
    min-height: 174px !important;
    padding: 16px 15px 14px !important;
  }

  .help-home > .quick-grid .quick-card-icon {
    height: 48px !important;
    width: 48px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .help-home > .quick-grid .quick-card,
  .help-home > .quick-grid .quick-card::before,
  .help-home > .quick-grid .quick-card::after,
  .help-home > .quick-grid .quick-card-icon,
  .help-home > .quick-grid .quick-card em {
    transition-duration: .01ms !important;
  }
}

/* Ventana de novedades: botones perfectamente nivelados en una sola fila. */
.updates-modal:not(.is-detail-mode) .update-inline-actions {
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.updates-modal:not(.is-detail-mode) .update-inline-actions button,
.updates-modal:not(.is-detail-mode) .update-inline-actions a {
  align-self: center !important;
  line-height: 1 !important;
  margin-top: 0 !important;
}

/* Consulta de IP: la información y la acción principal permanecen visibles en una ventana dedicada. */
body.ip-support-modal-open {
  overflow: hidden;
}

.support-panel .ip-support-card {
  min-height: 0;
}

.ip-support-modal-backdrop {
  align-items: center;
  animation: ipSupportBackdropIn .22s ease both;
  background: rgba(9, 34, 58, .48);
  backdrop-filter: blur(6px);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 22px;
  position: fixed;
  z-index: 90;
}

.ip-support-modal-backdrop[hidden] {
  display: none;
}

.ip-support-modal {
  animation: ipSupportModalIn .24s cubic-bezier(.2, .85, .3, 1) both;
  background: #ffffff;
  border: 1px solid rgba(196, 220, 240, .96);
  border-radius: 22px;
  box-shadow: 0 28px 84px rgba(5, 30, 54, .32);
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 18px);
  max-width: 570px;
  overflow: visible;
  position: relative;
  width: min(100%, 570px);
}

.ip-support-modal-heading {
  background:
    radial-gradient(circle at 94% 16%, rgba(155, 220, 255, .35) 0 9%, transparent 9.5%),
    radial-gradient(circle at 90% 112%, rgba(109, 190, 255, .25) 0 24%, transparent 24.5%),
    linear-gradient(120deg, #104d82, #287bb6 60%, #4b9bd3);
  color: #ffffff;
  display: grid;
  gap: 11px;
  grid-template-columns: 44px minmax(0, 1fr);
  padding: 19px 66px 17px 20px;
  border-radius: 21px 21px 0 0;
}

.ip-support-modal-icon {
  align-items: center;
  align-self: start;
  background: rgba(255, 255, 255, .17);
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 13px;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.ip-support-modal-icon svg {
  fill: none;
  height: 25px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
  width: 25px;
}

.ip-support-modal-heading .eyebrow {
  background: transparent;
  color: #ffe46b;
  font-size: 11px;
  min-height: auto;
  padding: 0;
}

.ip-support-modal-heading h2 {
  color: #ffffff;
  font-family: "Arial Black", "Segoe UI", Arial, sans-serif;
  font-size: clamp(22px, 3.8vw, 26px);
  letter-spacing: -.025em;
  line-height: 1.1;
  margin: 5px 0 6px;
}

.ip-support-modal-heading p {
  color: rgba(255, 255, 255, .92);
  font-size: 13px;
  line-height: 1.42;
  margin: 0;
}

.ip-support-modal-close {
  align-items: center;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .4);
  border-radius: 50%;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 27px;
  height: 38px;
  justify-content: center;
  line-height: 1;
  position: absolute;
  right: 16px;
  top: 16px;
  transition: background .18s ease, transform .18s ease;
  width: 38px;
  z-index: 2;
}

.ip-support-modal-close:hover,
.ip-support-modal-close:focus-visible {
  background: rgba(255, 255, 255, .26);
  outline: none;
  transform: rotate(6deg) scale(1.04);
}

.ip-support-modal-body {
  overflow: visible;
  padding: 15px 20px 12px;
  position: relative;
  z-index: 2;
}

.ip-support-modal .ip-support-box {
  background: linear-gradient(145deg, #f3fbff, #ffffff 65%);
  border: 1px solid #c9e0f2;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92);
  gap: 12px;
  padding: 13px;
}

.ip-support-modal .ip-result {
  background: linear-gradient(125deg, #edfff5, #ffffff);
  border: 1px solid #bae8d1;
  border-left: 5px solid #1b9c67;
  border-radius: 12px;
  color: #0d5c42;
  font-size: 15px;
  line-height: 1.35;
  padding: 12px 13px;
}

.ip-support-modal .ip-result.loading {
  border-color: #f1d77f;
  border-left-color: #e9ad12;
  color: #795508;
}

.ip-support-modal .ip-result.error {
  border-color: #f4c9c5;
  border-left-color: #d93025;
  color: #941f18;
}

.ip-support-modal .ip-support-box label {
  color: #173655;
  font-size: 13px;
  gap: 8px;
}

.ip-support-modal .ip-support-box input {
  border-radius: 10px;
  min-height: 44px;
}

.ip-support-modal .ip-support-box input:focus {
  border-color: #2a78b5;
  box-shadow: 0 0 0 3px rgba(42, 120, 181, .14);
  outline: none;
}

.ip-support-modal .school-suggestions {
  max-height: min(185px, 28dvh);
  z-index: 40;
}

.ip-support-modal-actions {
  align-items: center;
  background: linear-gradient(180deg, #ffffff, #f5faff);
  border-top: 1px solid #d9e8f5;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px 20px 14px;
  border-radius: 0 0 21px 21px;
  position: relative;
  z-index: 1;
}

.ip-support-modal-actions > small {
  color: #53708b;
  font-size: 11.5px;
  line-height: 1.34;
  max-width: 230px;
}

.ip-support-modal-actions > div {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 9px;
}

.ip-support-modal-actions .ip-support-cancel {
  background: #ffffff;
  border: 1px solid #c8dced;
  border-radius: 999px;
  color: #25537b;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  min-height: 40px;
  padding: 0 15px;
}

.ip-support-modal-actions .advisor-whatsapp-button {
  box-shadow: 0 9px 18px rgba(21, 137, 89, .19);
  min-height: 40px;
  padding: 0 17px;
}

.ip-support-modal-actions .advisor-whatsapp-button:not(:disabled):hover,
.ip-support-modal-actions .advisor-whatsapp-button:not(:disabled):focus-visible {
  background: #138558;
  border-color: #0e7349;
  outline: none;
  transform: translateY(-1px);
}

@keyframes ipSupportBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes ipSupportModalIn {
  from { opacity: 0; transform: translateY(12px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 580px) {
  .ip-support-modal-backdrop {
    align-items: end;
    padding: 10px;
  }

  .ip-support-modal {
    border-radius: 20px;
    max-height: calc(100dvh - 20px);
  }

  .ip-support-modal-heading {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 20px 62px 18px 20px;
  }

  .ip-support-modal-icon {
    border-radius: 13px;
    height: 42px;
    width: 42px;
  }

  .ip-support-modal-heading h2 {
    font-size: 23px;
  }

  .ip-support-modal-heading p {
    font-size: 13px;
  }

  .ip-support-modal-close {
    height: 38px;
    right: 15px;
    top: 15px;
    width: 38px;
  }

  .ip-support-modal-body {
    padding: 15px;
  }

  .ip-support-modal-actions {
    align-items: stretch;
    flex-direction: column;
    padding: 13px 15px 15px;
  }

  .ip-support-modal-actions > small {
    max-width: none;
  }

  .ip-support-modal-actions > div {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr);
  }

  .ip-support-modal-actions .advisor-whatsapp-button,
  .ip-support-modal-actions .ip-support-cancel {
    min-width: 0;
    padding: 0 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ip-support-modal-backdrop,
  .ip-support-modal,
  .ip-support-modal-close,
  .ip-support-modal-actions .advisor-whatsapp-button {
    animation: none;
    transition: none;
  }
}