@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Newsreader:opsz,wght@6..72,500;6..72,600;6..72,700&display=swap");

:root {
  --font-body: "Plus Jakarta Sans", sans-serif;
  --font-heading: "Newsreader", ui-serif, Georgia, serif;
  --bg: #f7f8fa;
  --bg-soft: #f1f3f6;
  --surface: #ffffff;
  --surface-subtle: #f7faff;
  --ink: #111d31;
  --ink-subtle: #566982;
  --line: #d6e2f0;
  --brand: #2a5bd7;
  --brand-strong: #1d47b7;
  --accent: #0f7771;
  --radius-xl: 22px;
  --radius-lg: 16px;
  --radius-md: 12px;
  --shadow-sm: 0 10px 28px rgba(14, 33, 61, 0.07);
  --shadow-md: 0 24px 54px rgba(14, 33, 61, 0.14);
  --btn-border: #2f66dc;
  --btn-text: #2556c1;
  --btn-hover-bg: #2556c1;
  --btn-hover-text: #ffffff;
  --page-max: 1120px;
  --page-gutter: 32px;
  --page-gutter-mobile: 12px;
  --top-gap: 30px;
  --top-gap-mobile: 26px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--ink);
  font-size: 16px;
  line-height: 1.75;
  letter-spacing: 0.002em;
  text-rendering: optimizeLegibility;
  background: #f8fafc;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  color: var(--ink);
  letter-spacing: -0.015em;
  line-height: 1.22;
}

h1 {
  font-size: clamp(2.1rem, 4vw, 3.2rem);
}

h2 {
  font-size: clamp(1.7rem, 2.6vw, 2.4rem);
}

h3 {
  font-size: clamp(1.3rem, 2vw, 1.7rem);
}

p {
  color: var(--ink);
}

a {
  color: var(--brand);
  text-decoration-color: rgba(42, 91, 215, 0.4);
  text-underline-offset: 0.14em;
}

a:hover {
  color: var(--brand-strong);
  text-decoration-color: rgba(29, 71, 183, 0.72);
}

.container,
.box_1620 {
  max-width: 1160px;
}

.side-main {
  min-height: calc(100vh - 150px);
  padding-top: var(--top-gap);
}

.section-margin {
  margin-top: var(--top-gap);
  margin-bottom: 68px;
}

.section-padding {
  padding-top: 68px;
  padding-bottom: 68px;
}

.section-intro {
  max-width: 760px;
  margin: 0 auto 1.5rem;
}

.section-intro__title {
  margin-bottom: 0.65rem;
  color: var(--ink);
}

.section-intro__subtitle {
  color: var(--ink-subtle);
}

.layout-home .side-main > section {
  width: min(var(--page-max), calc(100% - (var(--page-gutter) * 2)));
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
}

.layout-home .side-main > section > .container {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}

/* Home hero does not use .section-margin; match top spacing with other pages. */
.layout-home .side-main > section:first-child {
  margin-top: var(--top-gap);
}

/* Header */
.header_area {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: transparent;
}

.header_area .main_menu {
  transition: all 0.25s ease;
}

.header_area .navbar {
  margin-top: 0;
  margin-bottom: 0;
  padding: 9px 14px;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #e6ebf1;
  background: #ffffff;
  backdrop-filter: none;
  box-shadow: none;
}

.header_area .navbar-brand {
  margin-right: 14px;
  border-radius: 10px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.header_area .navbar-brand img {
  max-height: 42px;
  width: auto;
  display: block;
  filter: none;
  transition: filter 0.2s ease, opacity 0.2s ease;
}

.header_area .navbar .nav .nav-item {
  margin-right: 0;
}

.header_area .navbar .nav .nav-item .nav-link {
  font-family: var(--font-body);
  font-size: 0.79rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 999px;
  color: #3b4f66;
  padding: 7px 10px;
  line-height: 1.2;
  transition: all 0.2s ease;
}

.header_area .navbar .nav .nav-item:hover .nav-link,
.header_area .navbar .nav .nav-item.active .nav-link {
  color: #1f3f67;
  background: rgba(15, 23, 42, 0.05);
}

.header_area.navbar_fixed .main_menu {
  position: static;
  transform: none;
  background: transparent;
  box-shadow: none;
}

.navbar-toggler {
  margin: 0;
}

.navbar-toggler span {
  background: var(--ink) !important;
}

/* Home hero */
.hero-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--radius-xl);
  width: 100%;
  max-width: none;
  margin: 0 auto 28px;
  padding: 3.6rem 0 2.8rem;
  border: 1px solid rgba(131, 163, 205, 0.28);
  background: linear-gradient(130deg, #112842 0%, #184373 56%, #165e6f 100%);
  box-shadow: 0 20px 48px rgba(13, 32, 61, 0.22);
}

.hero-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(95deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
  opacity: 0.3;
  pointer-events: none;
  z-index: 0;
}

.hero-banner--sm {
  border-radius: var(--radius-xl);
  width: 100%;
  padding: 2.4rem 0 1.8rem;
}

.hero-banner > .container {
  padding-left: 52px;
  padding-right: 52px;
  position: relative;
  z-index: 1;
}

/* Keep hero inner padding even when home section containers are reset. */
.layout-home .side-main > section.hero-banner > .container {
  padding-left: 52px;
  padding-right: 52px;
}

.hero-banner--sm__content {
  text-align: center;
}

.hero-banner--sm__content h1,
.hero-banner--sm__content h4 {
  color: #f4f8ff;
}

.home-hero {
  min-height: 390px;
  display: flex;
  align-items: center;
}

.home-hero__grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 34px;
  align-items: center;
}

.home-hero__copy {
  max-width: 35rem;
}

.home-kicker {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 999px;
  padding: 0.4rem 0.74rem;
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #eff5ff;
  margin-bottom: 1rem;
}

.home-hero__copy h1 {
  color: #f5f9ff;
  margin-bottom: 0.8rem;
  line-height: 1.05;
  letter-spacing: -0.02em;
  text-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
}

.home-hero__copy p {
  color: rgba(230, 239, 252, 0.94);
  max-width: 33rem;
  font-size: 1.03rem;
  line-height: 1.68;
}

.home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.2rem;
}

.home-hero__actions .button.bg {
  border-color: #ffffff;
  background: #ffffff;
  color: #173c75;
}

.home-hero__actions .button.bg:hover {
  background: #e8f0fc;
  border-color: #e8f0fc;
  color: #173c75;
}

.home-hero__actions .button-light {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.52);
  background: rgba(255, 255, 255, 0.03);
}

.home-hero__actions .button-light:hover {
  color: var(--brand-strong);
  background: #ffffff;
}

.home-hero__kpis {
  margin-top: 1.2rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.62rem;
}

.home-kpi {
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.11);
  padding: 0.72rem 0.74rem;
}

.home-kpi strong {
  display: block;
  color: #ffffff;
  font-size: 1.1rem;
  line-height: 1.1;
}

.home-kpi span {
  color: rgba(240, 247, 255, 0.95);
  font-size: 0.8rem;
}

.hero-visual-card {
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(4px);
  box-shadow: 0 22px 40px rgba(5, 16, 34, 0.3);
  padding: 0.6rem;
}

.hero-visual-card img {
  border-radius: 14px;
  width: 100%;
  max-height: 370px;
  object-fit: contain;
  display: block;
}

/* Panels/cards */
.section-shell .container {
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow-sm);
  padding: 2rem;
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.card-feature,
.single-team-member .meta-text,
.single_recent_project,
.blog-card,
.newslist li,
.post-shell,
.single-post-content {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.card-feature {
  height: 100%;
  padding: 1.3rem 1.2rem;
}

.card-feature__icon i,
.card-feature__icon span {
  color: var(--brand);
}

.card-feature__title {
  margin-bottom: 0.55rem;
}

.scope-panel {
  display: grid;
  grid-template-columns: 1.35fr 0.65fr;
  gap: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.99));
  box-shadow: var(--shadow-sm);
  padding: 2rem;
}

.scope-panel--single {
  grid-template-columns: 1fr;
}

.scope-panel__left p {
  margin-bottom: 1.15rem;
}

.scope-focus-list {
  list-style: none;
  margin: 0 0 0.85rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.scope-focus-list li {
  border-left: 3px solid #c7d8ee;
  padding-left: 0.72rem;
  color: var(--ink-subtle);
  line-height: 1.6;
}

.scope-focus-list li strong {
  color: var(--ink);
}

.scope-note {
  font-size: 0.93rem;
  color: #5d708a;
  margin-bottom: 0;
}

.scope-panel__right {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 0.6rem;
}

.scope-chip {
  display: inline-block;
  border: 1px solid #c8d8ee;
  background: #f4f8ff;
  color: #1f446f;
  border-radius: 999px;
  padding: 0.43rem 0.72rem;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.single_recent_project {
  overflow: hidden;
}

.recent_project_head img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

.recent_project_content {
  padding: 1.25rem 1.28rem 1.36rem;
}

.recent_project_content h4 a {
  color: var(--ink);
}

/* Project showcase */
.project-showcase__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
}

.project-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #ffffff;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.project-card--feature {
  grid-column: span 12;
  display: grid;
  grid-template-columns: 1.15fr 1fr;
}

.project-showcase__grid > .project-card:not(.project-card--feature) {
  grid-column: span 4;
}

.project-card__media {
  background: #edf3fb;
  overflow: hidden;
}

.project-card__media img {
  width: 100%;
  height: 100%;
  min-height: 188px;
  object-fit: cover;
  object-position: center;
  display: block;
}

.project-card--feature .project-card__media img {
  min-height: 300px;
}

.project-card__media img.project-logo-fit {
  object-fit: contain;
  object-position: center;
  background: #f6f9fe;
  padding: 0.75rem 1rem;
}

.project-card__media img.project-xinda-fit {
  object-fit: cover;
  object-position: center top;
}

.project-card__content {
  padding: 1.1rem 1.15rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  height: 100%;
}

.project-card__content h3 {
  margin: 0;
  font-size: 1.42rem;
  line-height: 1.25;
}

.project-showcase__grid > .project-card:not(.project-card--feature) .project-card__content h3 {
  font-size: 1.08rem;
}

.project-card__content p {
  margin: 0;
  font-size: 0.95rem;
  color: var(--ink-subtle);
}

.project-card__content .button {
  margin-top: 0.55rem;
  align-self: flex-start;
}

.project-links {
  margin-top: 0.55rem;
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.project-link-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid #c7d7ee;
  border-radius: 999px;
  background: #ffffff;
  color: #1f4f88;
  text-decoration: none;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.34rem 0.62rem;
  transition: all 0.2s ease;
}

.project-link-icon i {
  font-size: 0.94rem;
}

.project-link-icon:hover {
  border-color: var(--brand);
  background: var(--brand);
  color: #ffffff;
}

[data-theme="dark"] .project-link-icon {
  border-color: var(--btn-border);
  color: var(--btn-text);
  background: transparent;
}

[data-theme="dark"] .project-link-icon:hover {
  border-color: var(--btn-hover-bg);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

.project-card__content .project-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #c34040;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0;
}

.project-card__content .project-badge::before {
  content: "";
  width: 18px;
  height: 1px;
  background: #cda9a9;
  display: inline-block;
}

.project-carousel-shell {
  position: relative;
}

.project-carousel .project-card {
  height: 100%;
  margin: 0 2px;
}

.project-carousel .owl-stage {
  display: flex;
}

.project-carousel .owl-item {
  display: flex;
}

.project-carousel .owl-item .project-card {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.project-carousel .project-card__media {
  height: 220px;
}

.project-carousel .project-card__media img {
  min-height: 220px;
}

.project-carousel .project-card__content {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 992px) {
  .project-carousel .project-card {
    height: 450px;
  }
}

.project-carousel .project-card__content h3 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.project-carousel .project-card__content p:not(.project-badge) {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.project-carousel .project-card__content .project-badge {
  margin-top: auto;
}

.project-carousel .project-links {
  margin-top: 0.35rem;
}

.project-carousel .owl-nav {
  margin-top: 18px;
  display: flex;
  justify-content: center;
  gap: 0.55rem;
  position: static !important;
  transform: none !important;
}

.project-carousel .owl-nav button.owl-prev,
.project-carousel .owl-nav button.owl-next {
  width: 38px;
  height: 38px;
  border-radius: 999px !important;
  border: 1px solid #c9d7ea !important;
  background: #ffffff !important;
  color: #2a4f80 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

.project-carousel .owl-nav button.owl-prev:hover,
.project-carousel .owl-nav button.owl-next:hover {
  border-color: var(--brand) !important;
  background: var(--brand) !important;
  color: #ffffff !important;
}

.project-carousel .owl-nav .carousel-arrow {
  font-size: 1.2rem;
  line-height: 1;
  font-weight: 700;
}

/* Buttons */
.button {
  border-radius: 999px;
  border: 1px solid var(--btn-border);
  color: var(--btn-text);
  font-weight: 700;
  font-size: 0.94rem;
  letter-spacing: 0.01em;
  transition: all 0.2s ease;
}

.button:hover {
  background: var(--btn-hover-bg);
  border-color: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

.button-light {
  border-color: var(--btn-border);
  color: var(--btn-text);
}

.button-light:hover {
  background: var(--btn-hover-bg);
  border-color: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

/* Blog */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 16px;
}

.blog-card {
  padding: 1.24rem;
}

.blog-card .meta {
  font-size: 0.81rem;
  color: var(--ink-subtle);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 0.55rem;
}

.blog-card h3 {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
}

.blog-empty {
  border: 1px dashed #bbccdf;
  border-radius: var(--radius-md);
  background: var(--surface-subtle);
  padding: 1.1rem;
}

.blog-preview-section .section-intro {
  max-width: 900px;
  margin-bottom: 1.7rem;
}

.layout-home .side-main > section.blog-preview-section > .container {
  padding: 2.15rem 2.3rem 2.45rem;
}

.blog-preview-section .blog-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}

.blog-preview-section .blog-card {
  border: 1px solid #d4deea;
  border-radius: 18px;
  background: #f8fbff;
  box-shadow: none;
  padding: 1.45rem 1.35rem 1.35rem;
}

.blog-preview-section .blog-card .meta {
  font-size: 0.83rem;
  font-weight: 700;
  letter-spacing: 0.045em;
  color: #6a7f98;
  margin-bottom: 0.62rem;
}

.blog-preview-section .blog-card p {
  margin: 0 0 1rem;
  font-size: 0.98rem;
  line-height: 1.62;
  color: #2f3d52;
}

.blog-preview-section .blog-card .button.button-light,
.blog-preview-section__actions .button.button-light {
  border-color: var(--btn-border);
  color: var(--btn-text);
  background: transparent;
  font-weight: 700;
}

.blog-preview-section .blog-card .button.button-light:hover,
.blog-preview-section__actions .button.button-light:hover {
  border-color: var(--btn-hover-bg);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

.blog-preview-section__actions {
  margin-top: 1.8rem !important;
}

/* Blog hub + post redesign */
.layout-default .side-main > section.section-margin.blog-hub > .container,
.layout-post .side-main > section.blog-post-page > .container {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.blog-hub__head {
  max-width: 760px;
  margin: 0 auto 1.8rem;
  text-align: center;
}

.blog-hub__eyebrow,
.blog-post__eyebrow {
  display: inline-block;
  margin: 0 0 0.6rem;
  border: 1px solid #ceddef;
  border-radius: 999px;
  background: #f2f7ff;
  color: #254973;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.24rem 0.62rem;
}

.blog-hub__head h1 {
  margin-bottom: 0.45rem;
}

.blog-hub__head p {
  margin: 0;
  color: var(--ink-subtle);
}

.blog-hub__list {
  display: grid;
  gap: 1rem;
}

.blog-hub__item {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #ffffff;
  box-shadow: var(--shadow-sm);
  padding: 1.15rem 1.2rem;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.blog-hub__item:hover {
  transform: none;
  border-color: #c4d6ea;
  box-shadow: var(--shadow-md);
}

.blog-hub__meta {
  font-size: 0.8rem;
  color: #6f8198;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.42rem;
}

.blog-hub__item h3 {
  margin: 0 0 0.42rem;
  font-size: 1.4rem;
  line-height: 1.25;
}

.blog-hub__item h3 a {
  color: var(--ink);
  text-decoration: none;
}

.blog-hub__item h3 a:hover {
  color: var(--brand-strong);
}

.blog-hub__item p {
  margin: 0 0 0.55rem;
}

.blog-hub__read {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 700;
  color: var(--brand-strong);
  text-decoration: none;
}

.blog-hub__read::after {
  content: "\2192";
  font-size: 0.95rem;
}

.blog-hub__read:hover {
  color: var(--brand);
}

.blog-post {
  width: min(860px, 100%);
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: #ffffff;
  box-shadow: var(--shadow-sm);
  padding: 1.45rem 1.45rem 1.3rem;
}

.blog-post__header {
  padding-bottom: 1rem;
  border-bottom: 1px solid #e5edf8;
  margin-bottom: 1.1rem;
}

.blog-post__header h1 {
  margin-bottom: 0.45rem;
}

.blog-post__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.38rem 0.62rem;
  color: #61758f;
  font-size: 0.9rem;
  font-weight: 600;
}

.blog-post__meta span {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
}

.blog-post__meta span:not(:last-child)::after {
  content: "\00B7";
  color: #91a3b8;
  margin-left: 0.45rem;
}

.blog-post__content {
  color: var(--ink-subtle);
  font-size: 1.03rem;
  line-height: 1.8;
}

.blog-post__content > :first-child {
  margin-top: 0;
}

.blog-post__content h2,
.blog-post__content h3,
.blog-post__content h4 {
  margin-top: 1.55rem;
  margin-bottom: 0.55rem;
}

.blog-post__content p,
.blog-post__content ul,
.blog-post__content ol,
.blog-post__content pre,
.blog-post__content blockquote {
  margin-bottom: 1rem;
}

.blog-post__content ul,
.blog-post__content ol {
  padding-left: 1.15rem;
}

.blog-post__content li + li {
  margin-top: 0.26rem;
}

.blog-post__content blockquote {
  border-left: 3px solid #c8d8ee;
  background: #f7faff;
  color: #415975;
  border-radius: 8px;
  padding: 0.72rem 0.85rem;
}

.blog-post__content code {
  background: #f2f6fc;
  border: 1px solid #dde8f6;
  border-radius: 6px;
  color: #193a64;
  font-size: 0.92em;
  padding: 0.08rem 0.34rem;
}

.blog-post__content pre {
  border: 1px solid #d7e3f2;
  border-radius: 12px;
  background: #0f1e33;
  color: #e6f0ff;
  padding: 0.9rem 1rem;
  overflow: auto;
}

.blog-post__content pre code {
  background: transparent;
  border: 0;
  color: inherit;
  padding: 0;
}

.blog-post__content img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

.blog-post__footer {
  margin-top: 0.9rem;
  padding-top: 0.9rem;
  border-top: 1px solid #e5edf8;
}

/* Home news preview */
.home-news-list {
  list-style: none;
  margin: 0;
  padding-left: 2.15rem;
}

.home-news-list li {
  margin-bottom: 0.7rem;
  display: grid;
  grid-template-columns: 5.4rem minmax(0, 1fr);
  column-gap: 0.45rem;
  align-items: start;
  position: relative;
  padding-left: 0.4rem;
}

.home-news-list li::before {
  content: "";
  width: 0.36rem;
  height: 0.36rem;
  border-radius: 50%;
  background: #7f91a8;
  position: absolute;
  left: -1.25rem;
  top: 0.68rem;
}

.home-news-list li:last-child {
  margin-bottom: 0;
}

.home-news-list__date {
  color: #7a8798;
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.home-news-list a {
  color: var(--brand);
  font-weight: 500;
  line-height: 1.55;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.home-news-list a:hover {
  color: var(--brand-strong);
}

.home-news-list__content {
  display: block;
  padding-right: 1.5rem;
}

/* Sponsors */
.sponsor-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.85rem;
  margin-top: 1rem;
}

.sponsor-card {
  min-height: 116px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-sm);
  padding: 0.9rem;
}

.sponsor-card img {
  max-width: 100%;
  max-height: 68px;
  width: auto;
  height: auto;
}

/* Default/single page wrappers */
.layout-default .side-main > section.section-margin > .container,
.layout-single .side-main > section.section-margin > .container {
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  box-shadow: var(--shadow-sm);
  padding: 1.6rem 1.6rem;
}

.layout-single .side-main > section.section-margin > .container ul,
.layout-single .side-main > section.section-margin > .container ol {
  margin: 0 0 1rem 1.2rem;
  padding-left: 0;
}

.layout-single .side-main > section.section-margin > .container li + li {
  margin-top: 0.3rem;
}

.layout-single .side-main > section.section-margin > .container :is(h1, h2, h3, h4, h5, h6) {
  margin-top: 1.25rem;
  margin-bottom: 0.55rem;
}

.layout-single .side-main > section.section-margin > .container :is(ul, ol) + :is(h1, h2, h3, h4, h5, h6) {
  margin-top: 1.7rem;
}

/* Team page */
.page-orderlab-team-members .team_members_area .row > div > h3 {
  margin-top: 0.5rem;
  margin-bottom: 1rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--line);
}

.single-team-member {
  margin-bottom: 1rem;
}

.single-team-member .thumb .img-team {
  border: 3px solid #ffffff;
  box-shadow: 0 12px 28px rgba(14, 33, 61, 0.14);
}

.single-team-member .meta-text {
  border-radius: var(--radius-md);
  color: var(--ink);
}

.single-team-member .meta-text h4 {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
}

.single-team-member .meta-text h4 a,
.single-team-member .meta-text a {
  color: var(--brand);
}

.single-team-member .meta-text h4 a:hover,
.single-team-member .meta-text a:hover {
  color: var(--brand-strong);
}

.single-team-member .meta-text b {
  color: var(--ink);
}

.team_members_area ul {
  list-style: none;
  padding-left: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.58rem 1.2rem;
}

.team_members_area ul li {
  border: 1px solid #e2ebf7;
  border-radius: 10px;
  background: #fbfdff;
  padding: 0.55rem 0.7rem;
  font-size: 0.95rem;
}

/* News page */
.newslist {
  list-style: none;
  padding-left: 0;
}

.newslist li {
  margin-bottom: 0.95rem;
  padding: 1rem 1rem;
}

.newsicon {
  color: var(--brand);
  width: 2rem;
  display: inline-block;
}

.newsdate {
  color: var(--brand-strong);
  font-weight: 700;
  width: 95px;
  display: inline-block;
}

.newslist details {
  display: block;
  margin-top: 0.58rem;
  margin-left: 2.15rem;
  color: var(--ink-subtle);
  font-size: 0.95rem;
}

.newslist details[open] {
  margin-left: 2.15rem;
}

.page-news .newslist > img,
.page-news .newslist > p {
  max-width: 100%;
  border-radius: var(--radius-md);
}

/* Publications page */
.page-publications h2#publications {
  margin-top: 2.1rem;
  margin-bottom: 0.9rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--line);
}

.publications {
  list-style: none;
  padding-left: 0;
}

.publications li {
  position: relative;
  margin-bottom: 0.95rem;
  border: 1px solid #e0e9f5;
  border-left: 4px solid #d1def0;
  border-radius: 10px;
  background: #fbfdff;
  padding: 0.8rem 0.95rem;
}

.publications li > a:first-child {
  color: var(--brand-strong);
  font-weight: 700;
}

.publications li > a:first-child:hover {
  color: var(--brand);
}

.authorlist {
  color: var(--ink-subtle);
}

.conf {
  font-size: 0.86rem;
  color: var(--brand);
}

.publinkitem {
  display: inline-flex !important;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.25rem;
  border-radius: 999px !important;
  border-color: #c4d5ea !important;
  color: #294f7f !important;
  background: #ffffff !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  padding: 0.2rem 0.62rem !important;
}

.publinkitem:hover {
  border-color: var(--brand) !important;
  color: #ffffff !important;
  background: var(--brand) !important;
}

.pub-link-icon {
  font-size: 0.76rem;
  opacity: 0.95;
}

.pub-link-label {
  line-height: 1;
}

.gh-stars {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  margin-left: 0.18rem;
  padding: 0.1rem 0.38rem;
  border-radius: 999px;
  border: 1px solid rgba(31, 79, 143, 0.24);
  background: rgba(31, 79, 143, 0.08);
  color: #244f84;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

.publinkitem:hover .gh-stars {
  border-color: rgba(255, 255, 255, 0.38);
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

/* About page */
.section-about__photo img {
  border-radius: 16px;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}

/* Footer */
.footer-area {
  margin-top: 2.6rem;
  padding: 1.55rem 0;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(180deg, #0e203a, #091424);
}

.footer-area .footer-bottom p {
  color: #cfdbeb;
}

.footer-area .footer-bottom p a {
  color: #ffffff;
}

/* Subtle interactions */
.card-feature,
.single-team-member .meta-text,
.single_recent_project,
.blog-card,
.newslist li,
.publications li,
.team_members_area ul li {
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.card-feature:hover,
.single_recent_project:hover,
.blog-card:hover,
.newslist li:hover,
.publications li:hover,
.team_members_area ul li:hover {
  transform: none;
  box-shadow: var(--shadow-md);
  border-color: #c4d6ea;
}

.single-team-member:hover .meta-text,
.project-card:hover {
  transform: none;
  box-shadow: var(--shadow-sm);
}

/* Responsive */
@media (max-width: 1199px) {
  .header_area .navbar .nav .nav-item .nav-link {
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    padding: 8px 9px;
  }
}

@media (max-width: 991px) {
  .header_area .navbar {
    margin-top: 0;
    margin-bottom: 0;
    border-radius: 0;
    border: 1px solid #e3e9f1;
    background: rgba(255, 255, 255, 0.96);
  }

  .header_area .navbar-brand {
    border-radius: 0;
    padding: 0;
  }

  .header_area .navbar .nav .nav-item .nav-link {
    font-size: 0.84rem;
    letter-spacing: 0.06em;
  }

  .header_area .navbar-collapse {
    max-height: 66vh;
    overflow-y: auto;
    margin-top: 8px;
    padding-bottom: 8px;
  }

  .hero-banner {
    width: 100%;
    border-radius: var(--radius-xl);
    padding: 3rem 0 2.2rem;
  }

  .hero-banner > .container {
    padding-left: 26px;
    padding-right: 26px;
  }

  .layout-home .side-main > section.hero-banner > .container {
    padding-left: 26px;
    padding-right: 26px;
  }

  .home-hero {
    min-height: 0;
  }

  .home-hero__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

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

  .section-shell .container,
  .layout-default .side-main > section.section-margin > .container,
  .layout-single .side-main > section.section-margin > .container {
    padding: 1.25rem;
    width: calc(100% - 24px);
    max-width: none;
  }

  .layout-home .side-main > section {
    width: calc(100% - (var(--page-gutter-mobile) * 2));
    max-width: none;
  }


  .scope-panel {
    grid-template-columns: 1fr;
    padding: 1.25rem;
  }

  .project-carousel .project-card__content {
    min-height: 0;
  }

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

  .team_members_area ul {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .layout-home .side-main > section:first-child {
    margin-top: var(--top-gap-mobile);
  }

  .side-main {
    padding-top: var(--top-gap-mobile);
  }

  .section-margin {
    margin-top: var(--top-gap-mobile);
    margin-bottom: 52px;
  }

  .hero-banner {
    padding: 2.5rem 0 1.8rem;
  }

  .hero-banner--sm {
    padding: 1.7rem 0 1.2rem;
  }

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

  .blog-grid {
    grid-template-columns: 1fr;
  }

  .blog-preview-section .blog-grid {
    grid-template-columns: 1fr;
  }

  .layout-home .side-main > section.blog-preview-section > .container {
    padding: 1.15rem 1rem 1.35rem;
  }

  .blog-post {
    padding: 1.05rem 0.95rem 1rem;
    border-radius: 14px;
  }

  .blog-post__content {
    font-size: 0.98rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}

/* Theme toggle + dark mode */
.nav-item--theme {
  display: flex;
  align-items: center;
  margin-left: 0.45rem;
}

.theme-toggle {
  border: 0;
  background: transparent;
  color: #214a7b;
  border-radius: 999px;
  width: 36px;
  height: 36px;
  padding: 0;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.theme-toggle:hover {
  background: transparent;
  color: #12355f;
}

.theme-toggle:focus {
  outline: 0;
  box-shadow: 0 0 0 2px rgba(116, 161, 226, 0.35);
}

[data-theme="dark"] {
  --bg: #0a111f;
  --bg-soft: #0f1a2d;
  --surface: #121f34;
  --surface-subtle: #172840;
  --ink: #e7effc;
  --ink-subtle: #aec1da;
  --line: #2b4868;
  --brand: #7aaeff;
  --brand-strong: #9ac3ff;
  --accent: #4fb7b1;
  --shadow-sm: 0 12px 30px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 24px 58px rgba(0, 0, 0, 0.4);
  --btn-border: #8fb4ff;
  --btn-text: #9ec0ff;
  --btn-hover-bg: #9ec0ff;
  --btn-hover-text: #0d1726;
}

[data-theme="dark"] body {
  background: #0b0f14;
}

[data-theme="dark"] .header_area .navbar {
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background: #0f141b;
  backdrop-filter: none;
  box-shadow: none;
}

[data-theme="dark"] .header_area .navbar .nav .nav-item .nav-link {
  color: rgba(238, 245, 255, 0.95);
}

[data-theme="dark"] .header_area .navbar .nav .nav-item:hover .nav-link,
[data-theme="dark"] .header_area .navbar .nav .nav-item.active .nav-link {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .header_area .navbar-brand {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

[data-theme="dark"] .header_area .navbar-brand img {
  filter: brightness(0) invert(1) contrast(1.1);
  opacity: 0.96;
}

[data-theme="dark"] .button,
[data-theme="dark"] .button-light {
  border-color: var(--btn-border);
  color: var(--btn-text);
  background: transparent;
}

[data-theme="dark"] .button:hover,
[data-theme="dark"] .button-light:hover {
  border-color: var(--btn-hover-bg);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

[data-theme="dark"] .home-hero__actions .button.bg,
[data-theme="dark"] .home-hero__actions .button-light {
  border-color: var(--btn-border);
  color: var(--btn-text);
  background: transparent;
}

[data-theme="dark"] .home-hero__actions .button.bg:hover,
[data-theme="dark"] .home-hero__actions .button-light:hover {
  border-color: var(--btn-hover-bg);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

[data-theme="dark"] .theme-toggle {
  border: 0;
  background: transparent;
  color: #f1f6ff;
}

[data-theme="dark"] .section-shell .container {
  background: rgba(18, 30, 48, 0.9);
}

[data-theme="dark"] .layout-default .side-main > section.section-margin > .container,
[data-theme="dark"] .layout-single .side-main > section.section-margin > .container {
  background: var(--surface);
  border-color: var(--line);
}

[data-theme="dark"] .scope-panel {
  background: linear-gradient(145deg, rgba(20, 32, 50, 0.96), rgba(17, 28, 45, 0.98));
}

[data-theme="dark"] .project-card,
[data-theme="dark"] .blog-hub__item,
[data-theme="dark"] .blog-post,
[data-theme="dark"] .publications li,
[data-theme="dark"] .newslist li,
[data-theme="dark"] .team_members_area ul li,
[data-theme="dark"] .sponsor-card,
[data-theme="dark"] .card-feature,
[data-theme="dark"] .single-team-member .meta-text {
  background: var(--surface);
  border-color: var(--line);
}

[data-theme="dark"] .single-team-member .meta-text {
  background: linear-gradient(180deg, #14253d, #122136);
  border-color: #2d4f74;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
  color: #e9f0fc;
}

[data-theme="dark"] .single-team-member .meta-text h4,
[data-theme="dark"] .single-team-member .meta-text b,
[data-theme="dark"] .single-team-member .meta-text strong,
[data-theme="dark"] .single-team-member .meta-text span,
[data-theme="dark"] .single-team-member .meta-text {
  color: #e9f0fc !important;
}

[data-theme="dark"] .single-team-member .meta-text a {
  color: #8eb9ff !important;
}

[data-theme="dark"] .single-team-member .meta-text a:hover {
  color: #bfd8ff !important;
}

[data-theme="dark"] .single-team-member .thumb .img-team {
  border-color: rgba(244, 248, 255, 0.95);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.42);
}

[data-theme="dark"] .team_members_area ul li {
  background: linear-gradient(180deg, #16273f, #122136);
  border-color: #2d4f74;
  color: #dce9fb;
}

[data-theme="dark"] .team_members_area ul li b,
[data-theme="dark"] .team_members_area ul li strong {
  color: #ecf3ff;
}

[data-theme="dark"] .team_members_area ul li a {
  color: #8eb9ff;
}

[data-theme="dark"] .team_members_area ul li a:hover {
  color: #bfd8ff;
}

[data-theme="dark"] .blog-preview-section .blog-card {
  background: var(--surface);
  border-color: var(--line);
}

[data-theme="dark"] .blog-preview-section .blog-card .meta {
  color: #9fb3cb;
}

[data-theme="dark"] .blog-preview-section .blog-card h3 a {
  color: var(--ink);
}

[data-theme="dark"] .blog-preview-section .blog-card h3 a:hover {
  color: var(--brand-strong);
}

[data-theme="dark"] .blog-preview-section .blog-card p {
  color: var(--ink-subtle);
}

[data-theme="dark"] .blog-preview-section .blog-card .button.button-light,
[data-theme="dark"] .blog-preview-section__actions .button.button-light {
  border-color: var(--btn-border);
  color: var(--btn-text);
  background: transparent;
}

[data-theme="dark"] .blog-preview-section .blog-card .button.button-light:hover,
[data-theme="dark"] .blog-preview-section__actions .button.button-light:hover {
  border-color: var(--btn-hover-bg);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-text);
}

[data-theme="dark"] .publications .authorlist,
[data-theme="dark"] .publications .authorlist i,
[data-theme="dark"] .publications .authorlist a,
[data-theme="dark"] .publications a.nodec {
  color: #b7c8de !important;
}

[data-theme="dark"] .publications .authorlist a:hover,
[data-theme="dark"] .publications a.nodec:hover {
  color: #d8e6f9 !important;
}

[data-theme="dark"] .publinkitem {
  border-color: var(--btn-border) !important;
  color: var(--btn-text) !important;
  background: transparent !important;
}

[data-theme="dark"] .publinkitem:hover {
  border-color: var(--btn-hover-bg) !important;
  color: var(--btn-hover-text) !important;
  background: var(--btn-hover-bg) !important;
}

[data-theme="dark"] .gh-stars {
  border-color: rgba(159, 192, 255, 0.36);
  background: rgba(159, 192, 255, 0.12);
  color: #c0d7ff;
}

[data-theme="dark"] .publinkitem:hover .gh-stars {
  border-color: rgba(13, 23, 38, 0.24);
  background: rgba(13, 23, 38, 0.2);
  color: #0d1726;
}

[data-theme="dark"] .project-card__media,
[data-theme="dark"] .hero-visual-card,
[data-theme="dark"] .project-card__media img.project-logo-fit {
  background: var(--surface-subtle);
}

[data-theme="dark"] .scope-chip {
  border-color: #3b5c83;
  background: #1b2d45;
  color: #c4d9f7;
}

[data-theme="dark"] .home-news-list__date {
  color: #9eb1c9;
}

[data-theme="dark"] .home-news-list li::before {
  background: #8da4c3;
}

[data-theme="dark"] .blog-post__meta {
  color: #9fb3cc;
}

[data-theme="dark"] .blog-post__header,
[data-theme="dark"] .blog-post__footer {
  border-color: #2c445f;
}

[data-theme="dark"] .blog-post__content blockquote {
  border-left-color: #4b6f9d;
  background: #15263d;
  color: #bed0e6;
}

[data-theme="dark"] .blog-post__content code {
  background: #1a2b42;
  border-color: #2f4f74;
  color: #c9ddf8;
}

[data-theme="dark"] .blog-post__content pre {
  border-color: #355371;
  background: #0b1423;
}

[data-theme="dark"] .footer-area {
  background: linear-gradient(180deg, #0b1628, #070f1a);
}

@media (max-width: 991px) {
  .nav-item--theme {
    margin-left: 0;
    margin-top: 0.45rem;
  }
}