/* Visual revision: denser navigation, clearer type hierarchy, undistorted 16:9 media. */
:root {
  --ink: #182b29;
  --muted: #596c66;
  --line: #d6e0da;
  --green: #12624f;
  --deep: #123f37;
  --mint: #e5f1eb;
  --coral: #b64e3b;
  --blue: #3e6e8a;
  background: #f4f7f5;
}
body {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.65;
}
.site-header {
  height: 72px;
  box-shadow: 0 1px 0 #244d3810;
}
.header-inner {
  max-width: 1280px;
  gap: 36px;
}
.brand-symbol {
  width: 40px;
  height: 40px;
  border-radius: 5px;
  font-size: 20px;
}
.brand strong { font-size: 17px; }
.brand small { font-size: 11px; }
.main-nav { gap: 25px; }
.main-nav a { font-size: 14px; }
.header-actions { font-size: 13px; }
.header-search { color: var(--green); font-weight: 700; }
.container { width: min(100% - 56px, 1160px); }
.section { padding: 50px 0; }
.section-alt { background: #edf3ef; }
.section-head { margin-bottom: 22px; }
.section-head h2 {
  font-size: 23px;
  line-height: 1.35;
}
.section-head p {
  font-size: 13px;
  margin-top: 6px;
}
.section-head a {
  font-size: 13px;
  padding-bottom: 2px;
}
.eyebrow {
  font-size: 12px;
  margin-bottom: 10px;
}
.page-intro { padding: 42px 0 27px; }
.page-intro h1 { font-size: 31px; margin-bottom: 10px; }
.page-intro p { font-size: 14px; line-height: 1.7; }
.breadcrumb { font-size: 13px; }
.status {
  font-size: 12px;
  padding: 3px 8px;
  background: #e5f1eb;
  border-radius: 3px;
}
.btn {
  min-height: 42px;
  padding: 10px 17px;
  font-size: 14px;
}
.btn.small {
  min-height: 34px;
  font-size: 12px;
}
.hero {
  min-height: 410px;
  background-position: center 47%;
}
.hero:before {
  background: linear-gradient(90deg,#0b302bdc 0%,#0b302bb3 48%,#0b302b24 88%);
}
.hero h1 {
  font-size: 39px;
  max-width: 620px;
  line-height: 1.32;
  margin-bottom: 14px;
}
.hero p { font-size: 16px; line-height: 1.65; }
.hero-stats { margin-top: 33px; font-size: 12px; }
.hero-stats strong { font-size: 18px; }
.quick-grid { gap: 12px; }
.quick-link {
  min-height: 89px;
  padding: 18px;
  border-color: #d5e0d8;
}
.quick-link strong { font-size: 16px; }
.quick-link small { font-size: 13px; margin-top: 4px; }
.quick-link .arrow { font-size: 19px; }
.level-row { gap: 20px; }
.level-item { padding-top: 16px; }
.level-item b { font-size: 16px; }
.level-item p {
  font-size: 13px;
  line-height: 1.6;
  margin-top: 7px;
}
.grid { gap: 17px; }
.card {
  display: flex;
  flex-direction: column;
  border-radius: 6px;
  border-color: #d7e1da;
  background: #fff;
  transition: border-color .18s, box-shadow .18s;
}
.card:hover {
  border-color: #9cbeac;
  box-shadow: 0 7px 22px #173d3010;
}
.card-image,
.detail-visual {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  object-fit: cover;
  object-position: center;
  background-color: #dce8df;
}
.card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 17px 18px 15px;
}
.card-meta {
  gap: 7px;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 8px;
}
.card h3 {
  font-size: 17px;
  line-height: 1.42;
  margin-bottom: 8px;
}
.card p {
  font-size: 13px;
  line-height: 1.65;
  margin-bottom: 16px;
}
.card-footer {
  margin-top: auto;
  padding-top: 12px;
  font-size: 12px;
}
.card-footer a { white-space: nowrap; }
.event-card {
  min-height: 172px;
  border-radius: 6px;
  border-color: #d7e1da;
}
.event-card .event-image {
  display: block;
  width: 37%;
  min-height: 172px;
  height: auto;
  object-fit: cover;
}
.event-card .event-info { padding: 17px; }
.event-card h3 { font-size: 16px; margin: 7px 0; }
.event-card p { font-size: 13px; }
.event-card .card-footer { margin-top: 14px; }
.filter-bar {
  background: #fff;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  margin-bottom: 16px;
}
.filter-bar input,
.filter-bar select,
.search-large {
  min-height: 42px;
  font-size: 14px;
}
.result-line {
  font-size: 13px;
  margin-bottom: 14px;
}
.detail-layout {
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 32px;
}
.detail-main h1 {
  font-size: 30px;
  line-height: 1.35;
}
.detail-lead {
  font-size: 15px;
  line-height: 1.75;
}
.detail-visual {
  max-height: none;
  margin: 23px 0 20px;
}
.detail-section { padding: 28px 0; }
.detail-section h2 {
  font-size: 20px;
  margin-bottom: 16px;
}
.detail-section p,
.detail-section li { font-size: 14px; }
.aside-panel {
  padding: 20px;
  border-color: #d7e1da;
}
.aside-panel h3 { font-size: 17px; }
.aside-panel p,
.aside-facts li { font-size: 13px; }
.aside-panel .price { font-size: 27px; }
.outline-item { font-size: 14px; padding: 14px 2px; }
.outline-item b,
.outline-item small { font-size: 12px; }
.tabs a,
.tabs button {
  font-size: 14px;
  padding: 12px 2px;
}
.notice {
  padding: 13px 15px;
  font-size: 13px;
  line-height: 1.65;
}
.feed-post { padding: 20px; }
.feed-post h3 { font-size: 18px; }
.feed-post p { font-size: 14px; }
.feed-post .post-tools { font-size: 12px; }
.side-menu button,
.side-menu a { font-size: 14px; }
.dash-main h1 { font-size: 26px; }
.dash-side { padding: 18px; }
.dash-side h3 { font-size: 15px; }
.dash-side nav a { font-size: 13px; }
.role-switch a { font-size: 13px; }
.stat {
  padding: 16px;
  border-top-width: 3px;
}
.stat small { font-size: 12px; }
.stat strong { font-size: 25px; }
.data-table { font-size: 13px; }
.data-table th,
.data-table td { padding: 14px 12px; }
.task-row { padding: 16px 18px; }
.task-row h3 { font-size: 15px; }
.task-row p { font-size: 13px; }
.footer-inner { max-width: 1160px; }
@media (max-width: 1100px) {
  .header-inner { gap: 18px; }
  .main-nav { gap: 14px; }
  .main-nav a { font-size: 13px; }
}
@media (max-width: 850px) {
  .site-header { height: 62px; }
  .container { width: calc(100% - 40px); }
  .grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-grid,
  .level-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body { font-size: 14px; }
  .site-header { height: 57px; }
  .brand strong { font-size: 15px; }
  .brand small { font-size: 11px; }
  .container { width: calc(100% - 32px); }
  .section { padding: 35px 0; }
  .section-head h2 { font-size: 20px; }
  .section-head p { font-size: 13px; }
  .hero { min-height: 340px; }
  .hero h1 { font-size: 28px; }
  .hero p { font-size: 14px; }
  .hero-stats { font-size: 11px; }
  .hero-stats strong { font-size: 14px; }
  .quick-grid,
  .grid.three,
  .grid.four,
  .image-list { grid-template-columns: 1fr; }
  .quick-link { min-height: 73px; padding: 14px 16px; }
  .quick-link strong { font-size: 15px; }
  .quick-link small { font-size: 12px; }
  .level-row { gap: 12px; }
  .level-item b { font-size: 14px; }
  .level-item p { font-size: 12px; }
  .card-image { aspect-ratio: 16 / 9; height: auto; }
  .card h3 { font-size: 17px; }
  .card p { font-size: 13px; }
  .card-meta,
  .card-footer { font-size: 12px; }
  .page-intro { padding: 29px 0 21px; }
  .page-intro h1 { font-size: 25px; }
  .page-intro p { font-size: 14px; }
  .filter-bar { padding: 12px; }
  .detail-layout { padding-top: 19px; }
  .detail-main h1 { font-size: 25px; }
  .detail-lead { font-size: 14px; }
  .detail-visual { aspect-ratio: 16 / 9; height: auto; }
  .detail-section h2 { font-size: 18px; }
  .aside-panel { padding: 18px; }
  .event-card .event-image { min-height: 164px; }
  .dash-main h1 { font-size: 23px; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-nav { height: 58px; }
  .mobile-nav a { font-size: 12px; }
  .toast { bottom: 72px; }
}