.landing-discover {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid #aac5b5;
  border-radius: 7px;
  background: #ffffff;
  color: #205b46;
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.landing-discover:hover {
  border-color: #6d9c81;
  background: #edf5ef;
  transform: translateY(-1px);
}
.landing-discover span { font-size: 16px; }
.copilot-lockup {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  color: #243b34;
  font-size: 14px;
  font-weight: 700;
}
.copilot-lockup img {
  width: 38px;
  height: 38px;
  object-fit: contain;
}
.copilot-lockup small {
  align-self: center;
  margin-left: 3px;
  padding-left: 12px;
  border-left: 1px solid #cddbd0;
  color: #648073;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
}
.preview-brand img { width: 25px; height: 25px; object-fit: contain; }
.preview-brand b { font-size: 10px; }
.demo-service-request {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding: 11px 12px;
  border: 1px solid #dce8de;
  border-left: 3px solid #378060;
  border-radius: 6px;
  background: #f6faf6;
}
.demo-service-request b, .demo-service-request small { display: block; }
.demo-service-request b { margin-top: 5px; color: #354940; font-size: 10px; }
.demo-service-request small { margin-top: 3px; color: #78867f; font-size: 9px; }
.request-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border: 1px solid #dce8de;
  border-radius: 99px;
  background: #fff;
  color: #327552;
  font-size: 8px;
  white-space: nowrap;
}
.request-status i { width: 5px; height: 5px; border-radius: 50%; background: #31a36c; }
.preview-side [data-demo-tab] {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.preview-side [data-demo-tab]:focus-visible {
  outline: 2px solid #438a67;
  outline-offset: 2px;
}
.demo-panel[hidden] { display: none; }
.demo-panel:not([hidden]) { animation: demo-panel-in .28s ease both; }
@keyframes demo-panel-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.demo-tool-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 23px;
}
.demo-tool-list > span {
  display: flex;
  min-height: 50px;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 8px 10px;
  border: 1px solid #e3eae4;
  border-radius: 6px;
  color: #354940;
  font-size: 10px;
  font-weight: 600;
}
.demo-tool-list small { color: #78867f; font-size: 9px; font-weight: 400; }
.demo-task-list {
  display: grid;
  gap: 11px;
  margin-top: 23px;
}
.demo-task-list > div { display: flex; align-items: center; gap: 9px; }
.demo-task-list b, .demo-task-list small { display: block; }
.demo-task-list b { color: #354940; font-size: 10px; }
.demo-task-list small { margin-top: 3px; color: #78867f; font-size: 9px; }
.task-check {
  width: 15px;
  height: 15px;
  flex: none;
  border: 1px solid #9eb7a5;
  border-radius: 4px;
}
.task-check.due { border-color: #c77778; background: #f7e9e7; }
.how-section {
  padding: 82px max(9vw, 36px) 76px;
  background: #f7f9f6;
}
.how-section .section-intro { margin-bottom: 34px; }
.how-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  max-width: 1120px;
  margin: 0 auto;
}
.how-steps article {
  padding: 18px 4px 0;
  border-top: 1px solid #cfddd2;
}
.how-steps article > span {
  color: #378060;
  font-size: 11px;
  font-weight: 700;
}
.how-steps h3 { margin: 14px 0 8px; color: #243b34; font-size: 16px; }
.how-steps p, .how-note {
  color: #68766f;
  font-size: 13px;
  line-height: 1.65;
}
.how-steps p { max-width: 320px; margin: 0; }
.how-note {
  max-width: 1120px;
  margin: 28px auto 0;
  padding-top: 14px;
  border-top: 1px solid #e2e9e3;
  font-size: 11px;
}
.institution-section {
  padding: 82px max(9vw, 36px) 76px;
  background: #eaf2eb;
}
.institution-section .section-intro { margin-bottom: 38px; }
.institution-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 18px;
  max-width: 1120px;
  margin: 0 auto;
}
.institution-grid article {
  display: flex;
  min-height: 252px;
  flex-direction: column;
  align-items: flex-start;
  padding: 23px 22px 21px;
  border: 1px solid #d8e3da;
  border-top: 3px solid #378060;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(33, 63, 45, .06);
}
.institution-grid article:nth-child(2) { border-top-color: #5675b3; }
.institution-grid article:nth-child(3) { border-top-color: #c47369; }
.institution-number {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border: 1px solid #dce9df;
  border-radius: 6px;
  background: #eef5ef;
  color: #378060;
  font-size: 10px;
  font-weight: 700;
}
.institution-grid article:nth-child(2) .institution-number { border-color: #e0e6f1; background: #f0f3fa; color: #5675b3; }
.institution-grid article:nth-child(3) .institution-number { border-color: #efe0dc; background: #fbf1ee; color: #b9685f; }
.institution-grid h3 {
  margin: 18px 0 9px;
  color: #243b34;
  font-size: 16px;
  line-height: 1.35;
}
.institution-grid p {
  max-width: 360px;
  margin: 0;
  color: #68766f;
  font-size: 13px;
  line-height: 1.7;
}
.institution-actions {
  display: flex;
  align-items: center;
  gap: 22px;
  max-width: 1120px;
  margin: 34px auto 0;
}
@media (max-width: 950px) {
  .how-section { padding: 68px 8vw; }
  .institution-section { padding: 68px 8vw; }
}
@media (max-width: 620px) {
  .landing-discover { min-height: 40px; padding: 9px 13px; font-size: 12px; }
  .copilot-lockup { gap: 8px; margin-bottom: 20px; font-size: 12px; }
  .copilot-lockup img { width: 34px; height: 34px; }
  .copilot-lockup small { padding-left: 8px; font-size: 8px; }
  .demo-tool-list { gap: 6px; }
  .demo-tool-list > span { padding: 7px; font-size: 9px; }
  .how-section { padding: 58px 24px; }
  .institution-section { padding: 58px 24px; }
  .institution-grid { grid-template-columns: 1fr; gap: 13px; }
  .institution-grid article { min-height: 0; padding: 19px 18px; }
  .institution-grid h3 { margin-top: 13px; }
  .institution-actions { align-items: flex-start; flex-direction: column; gap: 16px; margin-top: 27px; }
  .how-steps { grid-template-columns: 1fr; gap: 20px; }
  .how-steps article { padding-top: 14px; }
  .how-steps h3 { margin-top: 8px; }
  .landing-footer > div { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .demo-panel:not([hidden]) { animation: none; }
  .landing-discover { transition: none; }
}
