/* Shared visual system for all second- and third-level pages. */
body.subpage {
  --bg: #020a13;
  --paper: #061321;
  --paper-2: #081a2d;
  --text: #edf7ff;
  --muted: #9aafc2;
  --line: rgba(40, 139, 216, .26);
  --brand: #079ee8;
  --brand-dark: #001426;
  --cream: #f5fbff;
  --shadow: 0 22px 60px rgba(0, 4, 10, .34);
  --radius: 12px;
  color-scheme: dark;
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 7%, rgba(0, 116, 214, .12), transparent 28%),
    radial-gradient(circle at 86% 38%, rgba(0, 82, 155, .08), transparent 32%),
    #020a13;
  color: var(--text);
}

body.subpage a { transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
body.subpage .container { width: min(1280px, calc(100% - 48px)); }
body.subpage .eyebrow {
  color: #23b7ff;
  font-size: 12px;
  letter-spacing: .22em;
}
body.subpage .eyebrow::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 2px;
  margin-right: 10px;
  vertical-align: middle;
  background: #079ee8;
  box-shadow: 0 0 12px rgba(7, 158, 232, .7);
}

/* Header and mobile drawer */
body.subpage .site-header,
body.subpage .site-header.scrolled {
  position: fixed;
  top: 0;
  z-index: 30;
  padding: 0;
  background: rgba(1, 9, 18, .94);
  border-bottom: 1px solid rgba(25, 118, 188, .28);
  box-shadow: 0 12px 35px rgba(0, 4, 9, .32);
  backdrop-filter: blur(16px);
}
body.subpage .header-inner,
body.subpage .site-header > .container.nav {
  width: min(1640px, calc(100% - 72px));
  min-height: 86px;
  padding: 0;
}
body.subpage .brand-en,
body.subpage .site-header .brand strong,
body.subpage .site-header.scrolled .brand-en,
body.subpage .site-header.scrolled .brand strong {
  color: #f3f9ff;
  font-family: "STSong", "SimSun", serif;
  font-size: 24px;
  letter-spacing: .1em;
}
body.subpage .brand-cn,
body.subpage .site-header .brand span,
body.subpage .site-header.scrolled .brand-cn,
body.subpage .site-header.scrolled .brand span {
  margin-top: 7px;
  color: #7d9bb7;
  font-size: 11px;
  letter-spacing: .13em;
}
body.subpage .nav,
body.subpage .desktop-nav,
body.subpage .site-header.scrolled .nav {
  gap: clamp(20px, 2.1vw, 38px);
  color: #dbe8f3;
  font-size: 13px;
  letter-spacing: .08em;
  text-transform: none;
}
body.subpage .nav a::after,
body.subpage .desktop-nav a::after {
  bottom: -13px;
  height: 2px;
  background: #08a9f5;
  box-shadow: 0 0 10px rgba(8, 169, 245, .8);
}
body.subpage .nav a:hover,
body.subpage .nav a.active,
body.subpage .desktop-nav a:hover,
body.subpage .desktop-nav a.active { color: #fff; }
body.subpage .menu-btn,
body.subpage .site-header.scrolled .menu-btn { color: #dff4ff; }
body.subpage .menu-btn:hover { background: rgba(7, 158, 232, .12); }
body.subpage .drawer {
  background: rgba(1, 11, 22, .985);
  border-left: 1px solid rgba(28, 133, 211, .32);
  color: #eef8ff;
}
body.subpage .drawer-card {
  border-color: rgba(31, 132, 208, .3);
  background: rgba(6, 26, 45, .72);
  color: #9eb5c8;
}

/* Shared inner hero */
body.subpage .page-main,
body.subpage main { background: transparent; }
body.subpage .page-hero,
body.subpage .commercial-page .compact-hero,
body.subpage .private-services-hero {
  position: relative;
  isolation: isolate;
  min-height: 380px;
  max-width: none;
  padding: 156px max(24px, calc((100vw - 1280px) / 2)) 72px !important;
  overflow: hidden;
  border-bottom: 1px solid rgba(22, 118, 191, .28);
  background:
    radial-gradient(circle at 76% 24%, rgba(0, 118, 224, .24), transparent 30%),
    linear-gradient(115deg, rgba(0, 8, 17, .97), rgba(2, 25, 46, .94) 58%, rgba(0, 10, 21, .98)) !important;
  color: #f2f8fd !important;
}
body.subpage .page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .22;
  background-image:
    linear-gradient(rgba(32, 124, 194, .15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(32, 124, 194, .15) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(90deg, transparent, #000 30%, #000 72%, transparent);
}
body.subpage .page-hero::after {
  content: "";
  position: absolute;
  right: max(24px, calc((100vw - 1280px) / 2));
  bottom: 58px;
  width: min(320px, 24vw);
  height: 1px;
  background: linear-gradient(90deg, transparent, #08a9f5);
  box-shadow: 0 0 14px rgba(8, 169, 245, .65);
}
body.subpage .page-hero h1,
body.subpage .commercial-page .compact-hero h1 {
  max-width: 1040px;
  margin: 14px 0 20px;
  color: #f7fbff;
  font-family: "STSong", "SimSun", serif;
  font-size: clamp(42px, 5vw, 76px);
  font-weight: 600;
  line-height: 1.13;
  letter-spacing: .06em;
  text-shadow: 0 12px 34px rgba(0, 3, 8, .5);
}
body.subpage .page-hero p,
body.subpage .page-hero .lead,
body.subpage .commercial-page .compact-hero .lead {
  max-width: 900px;
  color: #a9bdce !important;
  font-size: 16px;
  line-height: 1.9;
}
body.subpage .service-contact { color: #65ccff !important; }

/* Section rhythm and typography */
body.subpage .content-section,
body.subpage .content-info-section,
body.subpage .section,
body.subpage .brief-section,
body.subpage .case-reference-notice {
  color: var(--text);
  background: transparent;
}
body.subpage .content-section,
body.subpage .content-info-section,
body.subpage .subpage .section { padding-top: 72px; padding-bottom: 72px; }
body.subpage .section.soft,
body.subpage .private-services-page .private-planning-section,
body.subpage .case-reference-notice {
  background: rgba(3, 16, 29, .72) !important;
  border-top: 1px solid rgba(29, 121, 190, .18);
  border-bottom: 1px solid rgba(29, 121, 190, .18);
}
body.subpage h2,
body.subpage h3,
body.subpage h4 { color: #edf7ff; }
body.subpage .content-section h2,
body.subpage .content-info-section h2,
body.subpage .section-title,
body.subpage .form-heading h2,
body.subpage .brief-result h2,
body.subpage .case-reference-notice h2 {
  margin-top: 0;
  color: #f4f9fd !important;
  font-family: "STSong", "SimSun", serif;
  font-weight: 600;
  line-height: 1.22;
}
body.subpage .content-section h2,
body.subpage .content-info-section h2 { font-size: clamp(30px, 3.4vw, 48px); }
body.subpage p,
body.subpage li,
body.subpage dd,
body.subpage .section-desc,
body.subpage .lead,
body.subpage .notice { color: #9db0c1; line-height: 1.85; }
body.subpage strong { color: #edf7ff; }
body.subpage hr { border-color: rgba(31, 126, 198, .24); }

/* Reusable cards and grids */
body.subpage :is(
  .text-card,
  .mini-card-grid article,
  .commercial-service-card,
  .area-card,
  .stat-card,
  .info-card,
  .text-grid > div,
  .contact-card,
  .brief-form,
  .proposal-card,
  .service-proposal-card,
  .case-reference-notice .container
) {
  color: var(--text);
  border: 1px solid rgba(33, 128, 201, .28);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(7, 25, 42, .96), rgba(3, 15, 27, .96));
  box-shadow: var(--shadow);
}
body.subpage :is(
  .text-card,
  .mini-card-grid article,
  .commercial-service-card,
  .area-card,
  .stat-card,
  .info-card,
  .text-grid > div,
  .contact-card
):hover {
  border-color: rgba(27, 166, 245, .58);
  transform: translateY(-3px);
  box-shadow: 0 22px 58px rgba(0, 8, 18, .5), 0 0 24px rgba(0, 130, 220, .08);
}
body.subpage .mini-card-grid { gap: 16px; }
body.subpage .mini-card-grid article,
body.subpage .commercial-service-card,
body.subpage .area-card,
body.subpage .stat-card,
body.subpage .info-card { padding: 26px; }
body.subpage .mini-card-grid article { border-top: 2px solid #078fd4; }
body.subpage .card-no,
body.subpage .commercial-service-card .card-no { color: #18aff5; }
body.subpage .check-list { color: #aebfcd; }
body.subpage .check-list li::marker { color: #13adf5; }

body.subpage .service-facts {
  max-width: 1280px;
  gap: 10px;
  margin-top: -30px;
}
body.subpage .service-facts > div,
body.subpage .service-facts > div:first-child,
body.subpage .service-facts > div:last-child {
  padding: 22px 24px;
  border: 1px solid rgba(30, 128, 204, .32);
  border-radius: 10px;
  background: rgba(5, 24, 41, .98);
  box-shadow: 0 16px 36px rgba(0, 5, 12, .3);
}
body.subpage .service-facts dt { color: #23b7ff; }
body.subpage .service-facts dd { color: #b0c0ce; }
body.subpage .entity-summary {
  border-color: rgba(30, 128, 204, .3);
  background: rgba(5, 24, 41, .9);
}

/* Image-led service, case, and proposal cards */
body.subpage .service-card,
body.subpage .case-card,
body.subpage .commercial-case-card,
body.subpage .proposal-card,
body.subpage .service-proposal-card {
  overflow: hidden;
  border: 1px solid rgba(30, 128, 204, .28);
  border-radius: 12px;
  background: #061524;
  box-shadow: 0 18px 46px rgba(0, 5, 12, .32);
}
body.subpage .service-card:hover,
body.subpage .case-card:hover,
body.subpage .proposal-card:hover,
body.subpage .service-proposal-card:hover { border-color: rgba(22, 170, 247, .62); }
body.subpage .service-proposal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 28px;
}
body.subpage .service-proposal-card { display: grid; }
body.subpage .service-proposal-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
body.subpage .service-proposal-card strong { padding: 16px 16px 5px; }
body.subpage .service-proposal-card span { padding: 0 16px 18px; }
body.subpage .case-body,
body.subpage .commercial-case-body,
body.subpage .proposal-card figcaption { background: #061524; color: #a8bac9; }
body.subpage .case-body h3,
body.subpage .commercial-case-body h3,
body.subpage .service-proposal-card strong { color: #eef8ff; }
body.subpage .case-desc,
body.subpage .commercial-case-body p,
body.subpage .proposal-card figcaption,
body.subpage .service-proposal-card span { color: #8fa5b8; }
body.subpage .proposal-card a { background: #03101d; }
body.subpage .case-placeholder {
  color: #a8e2ff;
  background: radial-gradient(circle at 76% 20%, rgba(0, 127, 220, .2), transparent 34%), linear-gradient(135deg, #041524, #08253d);
}
body.subpage .placeholder-badge,
body.subpage .tag {
  border: 1px solid rgba(22, 161, 237, .28);
  background: rgba(4, 128, 202, .12);
  color: #61caff;
}
body.subpage .filter-btn {
  border-color: rgba(32, 128, 201, .32);
  background: rgba(5, 25, 43, .8);
  color: #b5c8d7;
}
body.subpage .filter-btn:hover,
body.subpage .filter-btn.active {
  border-color: #0a9de7;
  background: #087fbd;
  color: #fff;
}

/* Buttons, calls to action, and contact surfaces */
body.subpage .btn {
  min-height: 44px;
  border: 1px solid rgba(44, 146, 219, .48);
  border-radius: 4px;
  background: rgba(4, 26, 45, .72);
  color: #dff4ff;
}
body.subpage .btn:hover {
  border-color: #18aff5;
  background: rgba(5, 83, 129, .72);
  color: #fff;
}
body.subpage .btn.primary {
  border-color: transparent;
  background: linear-gradient(135deg, #079ee8, #0567d9);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0, 112, 215, .28);
}
body.subpage :is(.commercial-cta, .private-cta, .contact-strip, .contact-panel, .brief-result) {
  color: #eef8ff;
  border: 1px solid rgba(30, 139, 220, .36);
  border-radius: 12px;
  background:
    radial-gradient(circle at 86% 12%, rgba(0, 132, 231, .22), transparent 30%),
    linear-gradient(135deg, #031321, #061f35);
  box-shadow: 0 22px 60px rgba(0, 4, 11, .4);
}
body.subpage :is(.commercial-cta, .private-cta, .contact-strip, .contact-panel, .brief-result) p { color: #a8bbc9 !important; }
body.subpage .commercial-cta .cta-row { justify-content: flex-end; }

/* FAQ and long-form content */
body.subpage .faq-preview,
body.subpage .faq-list { border-color: rgba(32, 128, 201, .24); }
body.subpage .faq-preview article,
body.subpage .faq-item,
body.subpage details {
  border-bottom: 1px solid rgba(32, 128, 201, .24);
  background: transparent;
}
body.subpage .faq-q,
body.subpage summary { color: #eaf6ff; }
body.subpage .faq-q span { color: #18aff5; }
body.subpage .faq-a,
body.subpage details p { color: #9db0c1; }
body.subpage article > :is(h2, h3) { scroll-margin-top: 110px; }

/* Forms */
body.subpage .brief-section { max-width: 1280px; }
body.subpage .brief-form,
body.subpage .brief-result { padding: 32px; }
body.subpage .form-grid label { color: #dceaf5; }
body.subpage .form-grid input,
body.subpage .form-grid select,
body.subpage .form-grid textarea,
body.subpage .brief-result textarea,
body.subpage .form input,
body.subpage .form textarea {
  border: 1px solid rgba(40, 135, 207, .34);
  background: #031321;
  color: #eef8ff;
}
body.subpage :is(input, select, textarea):focus {
  border-color: #11aaf2;
  outline: 2px solid rgba(17, 170, 242, .18);
  outline-offset: 1px;
}
body.subpage .form-heading p:not(.eyebrow),
body.subpage .form-notice { color: #91a8ba; }

/* About, areas, and error page exceptions */
body.subpage .stats-grid { gap: 14px; }
body.subpage .stat-card strong,
body.subpage .about-stats strong { color: #25b8ff; }
body.subpage .area-tags a,
body.subpage .area-tags span,
body.subpage .tag-list a,
body.subpage .tag-list li {
  border: 1px solid rgba(31, 139, 219, .3);
  background: rgba(5, 31, 52, .76);
  color: #a9c2d6;
}
body.subpage .area-tags a:hover,
body.subpage .tag-list a:hover,
body.subpage .tag-list li:hover { border-color: #0ba6ef; color: #fff; }
body.subpage .error-page-main {
  background: radial-gradient(circle at 76% 22%, rgba(0, 132, 231, .18), transparent 32%), linear-gradient(145deg, #020b14, #061a2c);
}
body.subpage .error-shell {
  border-color: rgba(37, 143, 219, .34);
  background: rgba(5, 23, 40, .94);
  box-shadow: var(--shadow);
}
body.subpage .error-code { color: #18aff5; }

/* Footer */
body.subpage .site-footer {
  padding: 54px 0 30px;
  border-top: 1px solid rgba(29, 124, 196, .28);
  background: #010812;
  color: #edf7ff;
}
body.subpage .footer-grid { grid-template-columns: 1.2fr .9fr .9fr; gap: 46px; }
body.subpage .footer-brand { color: #f4f9fd; font-size: 28px; }
body.subpage .footer-title { color: #20b2f8; }
body.subpage .footer-list,
body.subpage .site-footer p { color: #8199ad; }
body.subpage .footer-list a:hover { color: #45c4ff; }
body.subpage .copyright {
  border-top-color: rgba(31, 128, 201, .2);
  color: #61798d;
}
body.subpage .site-disclaimer {
  border-top-color: rgba(31, 128, 201, .2) !important;
  color: #61798d !important;
}
body.subpage .skip-link { background: #087fbd; color: #fff; }
body.subpage .wechat-toast { background: rgba(1, 13, 24, .96); color: #eef8ff; }

@media (max-width: 1050px) {
  body.subpage .header-inner,
  body.subpage .site-header > .container.nav { width: calc(100% - 36px); min-height: 78px; }
  body.subpage .page-hero,
  body.subpage .commercial-page .compact-hero,
  body.subpage .private-services-hero { padding-top: 138px !important; }
  body.subpage .footer-grid { grid-template-columns: 1fr 1fr; }
  body.subpage .footer-grid > :first-child { grid-column: 1 / -1; }
  body.subpage .service-proposal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  body.subpage .container { width: min(100% - 28px, 560px); }
  body.subpage .header-inner,
  body.subpage .site-header > .container.nav { width: calc(100% - 28px); min-height: 70px; }
  body.subpage .brand-en,
  body.subpage .site-header .brand strong { font-size: 19px; }
  body.subpage .brand-cn,
  body.subpage .site-header .brand span { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.subpage .page-hero,
  body.subpage .commercial-page .compact-hero,
  body.subpage .private-services-hero {
    min-height: 330px;
    padding: 118px 14px 54px !important;
  }
  body.subpage .page-hero h1,
  body.subpage .commercial-page .compact-hero h1 { font-size: clamp(34px, 11vw, 50px); letter-spacing: .03em; }
  body.subpage .page-hero p,
  body.subpage .page-hero .lead { font-size: 14px; }
  body.subpage .page-hero::after { right: 14px; bottom: 30px; width: 120px; }
  body.subpage .content-section,
  body.subpage .content-info-section,
  body.subpage .section { padding-top: 52px; padding-bottom: 52px; }
  body.subpage .service-facts { grid-template-columns: 1fr; margin-top: 0; padding-top: 16px; }
  body.subpage :is(.commercial-cta, .private-cta, .contact-strip, .contact-panel, .brief-form, .brief-result) { padding: 24px; }
  body.subpage .commercial-cta .cta-row { justify-content: flex-start; }
  body.subpage .service-proposal-grid { grid-template-columns: 1fr; }
  body.subpage .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  body.subpage .footer-grid > :first-child { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  body.subpage *,
  body.subpage *::before,
  body.subpage *::after { transition-duration: .01ms !important; }
}

/* Official Feike Event Planning logo. */
body.subpage .brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
body.subpage .site-brand-logo {
  display: block;
  width: 220px;
  height: auto;
  object-fit: contain;
  object-position: left center;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .25));
}
body.subpage .footer-brand {
  display: inline-flex;
  align-items: center;
  letter-spacing: 0;
}
body.subpage .footer-brand-logo {
  display: block;
  width: 220px;
  height: auto;
  object-fit: contain;
  object-position: left center;
}
@media (max-width: 680px) {
  body.subpage .site-brand-logo { width: 164px; }
  body.subpage .footer-brand-logo { width: 200px; }
}
