/*
Theme Name: Xiyue Studio
Theme URI: https://example.invalid/unit-portal
Author: Xiyue Studio Team
Description: Responsive technology company website theme for Beijing Xiyue Technology Studio.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 8.2
Text Domain: unit-portal
*/
:root {
    --unit-primary: #3ce6d0;
    --unit-primary-dark: #08151e;
    --unit-ink: #0b1922;
    --unit-muted: #6b7d86;
    --unit-border: #d9e3e7;
    --unit-surface: #f2f6f7;
    --unit-white: #ffffff;
    --unit-blue: #6d8dff;
    --unit-coral: #ff9b70;
    --unit-content-width: 1200px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--unit-ink); background: var(--unit-white); font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; line-height: 1.7; }
img { max-width: 100%; height: auto; }
a { color: var(--unit-primary); text-decoration: none; }
a:hover { color: var(--unit-primary-dark); text-decoration: underline; }
button, input { font: inherit; }
.unit-container { width: min(100% - 32px, var(--unit-content-width)); margin-inline: auto; }
.unit-skip-link { position: absolute; left: -9999px; }
.unit-skip-link:focus { left: 16px; top: 16px; z-index: 100; padding: 8px 12px; color: var(--unit-ink); background: var(--unit-white); }
.unit-topbar { padding: 7px 0; color: #b8cbd2; background: var(--unit-primary-dark); font-size: .75rem; letter-spacing: 0; }
.unit-topbar .unit-container, .unit-header-row, .unit-nav-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.unit-topbar p { margin: 0; }
.unit-header { color: var(--unit-white); background: var(--unit-primary-dark); border-bottom: 1px solid rgba(255,255,255,.12); }
.unit-header-row { min-height: 92px; }
.unit-brand { display: flex; align-items: center; gap: 12px; color: var(--unit-white); }
.unit-brand:hover { text-decoration: none; }
.unit-brand-mark { display: grid; width: 48px; height: 48px; place-items: center; color: var(--unit-primary-dark); background: var(--unit-primary); font-weight: 900; }
.unit-brand-logo { display: block; width: auto; max-width: 180px; max-height: 64px; }
.unit-brand-name { font-size: 1.2rem; font-weight: 700; }
.unit-brand-tagline { display: block; color: #9eb4bd; font-size: .75rem; font-weight: 400; }
.unit-nav { background: var(--unit-primary-dark); }
.unit-nav-row { min-height: 52px; }
.unit-menu { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.unit-menu a { display: block; padding: 9px 15px; color: #c7d5da; font-size: .92rem; font-weight: 600; }
.unit-menu a:hover, .unit-menu .current-menu-item > a, .unit-menu .current_page_item > a { color: var(--unit-primary); background: rgba(60,230,208,.08); text-decoration: none; }
.unit-menu-toggle { display: none; padding: 8px 12px; border: 1px solid rgba(255,255,255,.22); color: var(--unit-white); background: transparent; cursor: pointer; }
.unit-search { display: flex; gap: 6px; }
.unit-search input { width: 180px; min-height: 38px; padding: 7px 10px; border: 1px solid rgba(255,255,255,.25); color: var(--unit-white); background: rgba(255,255,255,.06); }
.unit-search input::placeholder { color: #8fa7b0; }
.unit-button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border: 0; color: var(--unit-primary-dark); background: var(--unit-primary); cursor: pointer; font-weight: 700; }
.unit-button:hover { color: var(--unit-primary-dark); background: #9bf6e9; text-decoration: none; }
.unit-button--ghost { color: var(--unit-primary); border: 1px solid rgba(60,230,208,.6); background: transparent; }
.unit-button--ghost:hover { color: var(--unit-primary-dark); background: var(--unit-primary); }
.unit-section { padding: 80px 0; }
.unit-section--muted { background: var(--unit-surface); }
.unit-section--dark { color: var(--unit-white); background: var(--unit-primary-dark); }
.unit-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 28px; border-bottom: 1px solid var(--unit-border); }
.unit-section--dark .unit-section-heading { border-color: rgba(255,255,255,.2); }
.unit-section-heading h2 { margin: 0; font-size: 1.85rem; letter-spacing: 0; }
.unit-section-heading a { padding-bottom: 4px; font-size: .9rem; }
.unit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.unit-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.unit-card { min-width: 0; padding: 24px; border: 1px solid var(--unit-border); background: var(--unit-white); }
.unit-card h3 { margin: 0 0 7px; font-size: 1.08rem; }
.unit-card p { margin: 0; }
.unit-card--category { min-height: 150px; }
.unit-card--category h3 { color: var(--unit-primary-dark); }
.unit-hero { padding: 90px 0 82px; color: var(--unit-white); background: var(--unit-primary-dark); }
.unit-hero h1 { max-width: 820px; margin: 0 0 16px; font-size: 4.2rem; line-height: 1.1; letter-spacing: 0; }
.unit-hero p { max-width: 680px; margin: 0; color: #c8d8dd; font-size: 1.1rem; }
.unit-hero .unit-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.unit-hero .unit-hero-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr); align-items: center; gap: 64px; }
.unit-hero .unit-eyebrow, .unit-eyebrow { margin: 0 0 13px; color: var(--unit-primary); font-size: .76rem; font-weight: 800; letter-spacing: 0; }
.unit-signal-visual { min-height: 330px; position: relative; padding: 24px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.04); }
.unit-signal-visual::before, .unit-signal-visual::after { position: absolute; content: ""; background: var(--unit-primary); }
.unit-signal-visual::before { top: 0; left: 0; width: 48px; height: 2px; }
.unit-signal-visual::after { right: 0; bottom: 0; width: 2px; height: 48px; }
.unit-signal-grid { display: grid; height: 100%; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.unit-signal-node { display: flex; min-height: 120px; flex-direction: column; justify-content: space-between; padding: 16px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.045); }
.unit-signal-node strong { color: var(--unit-white); font-size: 1.4rem; }
.unit-signal-node span { color: #9db7bf; font-size: .78rem; }
.unit-signal-node--accent { border-color: rgba(60,230,208,.55); background: rgba(60,230,208,.1); }
.unit-signal-line { position: absolute; top: 50%; left: 24px; right: 24px; height: 1px; background: rgba(60,230,208,.5); transform: rotate(-14deg); transform-origin: center; }
.unit-breadcrumb { padding: 16px 0; color: var(--unit-muted); font-size: .9rem; }
.unit-content { max-width: 850px; }
.unit-content h1 { margin-top: 0; line-height: 1.35; }
.unit-content h2 { margin-top: 2em; }
.unit-content table { width: 100%; border-collapse: collapse; }
.unit-content td, .unit-content th { padding: 8px; border: 1px solid var(--unit-border); }
.unit-content pre { max-width: 100%; overflow-x: auto; }
.unit-featured-image { margin-bottom: 22px; }
.unit-featured-image img { display: block; width: 100%; max-height: 360px; object-fit: cover; }
.unit-meta { color: var(--unit-muted); font-size: .85rem; }
.unit-list { margin: 0; padding: 0; list-style: none; }
.unit-list li { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--unit-border); }
.unit-list li a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unit-list--cards li { display: block; padding: 15px 0; }
.unit-downloads { margin-top: 28px; padding: 18px; border-left: 4px solid var(--unit-coral); background: var(--unit-surface); }
.unit-downloads h2 { margin-top: 0; font-size: 1.1rem; }
.unit-downloads ul { margin-bottom: 0; }
.unit-empty { padding: 22px; color: var(--unit-muted); background: var(--unit-surface); }
.unit-pagination { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.unit-pagination .page-numbers { padding: 7px 11px; border: 1px solid var(--unit-border); }
.unit-pagination .current { color: var(--unit-white); background: var(--unit-primary); }
.unit-footer { padding: 52px 0 30px; color: #b4c7ce; background: var(--unit-primary-dark); }
.unit-footer a { color: var(--unit-white); }
.unit-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 24px; }
.unit-footer h2, .unit-footer h3 { margin-top: 0; color: var(--unit-white); font-size: 1rem; }
.unit-footer p { margin: 5px 0; }
.unit-footer-bottom { margin-top: 26px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.2); font-size: .85rem; }
.unit-stat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.unit-stat { padding-top: 15px; border-top: 1px solid var(--unit-border); }
.unit-stat strong { display: block; color: var(--unit-primary-dark); font-size: 1.5rem; }
.unit-stat span { color: var(--unit-muted); font-size: .85rem; }
.unit-dark-intro { max-width: 720px; margin-bottom: 34px; }
.unit-dark-intro h2 { margin: 0 0 12px; font-size: 2.25rem; }
.unit-dark-intro p { margin: 0; color: #a8c0c8; }
.unit-solution-card { min-height: 230px; padding: 24px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.045); }
.unit-solution-card:hover { border-color: var(--unit-primary); background: rgba(60,230,208,.08); }
.unit-solution-card .unit-card-kicker { color: var(--unit-primary); font-size: .76rem; font-weight: 800; }
.unit-solution-card h3 { margin: 34px 0 8px; color: var(--unit-white); font-size: 1.35rem; }
.unit-solution-card p { margin: 0; color: #a8c0c8; }
.unit-download-row { display: grid; grid-template-columns: minmax(0, 2fr) 1fr auto; align-items: center; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--unit-border); }
.unit-download-row h3 { margin: 0; font-size: 1.05rem; }
.unit-download-row p { margin: 3px 0 0; color: var(--unit-muted); font-size: .88rem; }
.unit-download-row .unit-button { min-width: 90px; }
.unit-contact-band { padding: 58px 0; color: var(--unit-white); background: #102b37; }
.unit-contact-band .unit-container { display: flex; align-items: end; justify-content: space-between; gap: 26px; }
.unit-contact-band h2 { max-width: 600px; margin: 0 0 10px; font-size: 2.35rem; line-height: 1.2; }
.unit-contact-band p { margin: 0; color: #afc5cc; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 760px) {
    .unit-header-row, .unit-nav-row, .unit-topbar .unit-container { align-items: flex-start; flex-direction: column; }
    .unit-header-row { padding: 18px 0; }
    .unit-brand-logo { max-width: 140px; max-height: 52px; }
    .unit-nav-row { padding: 10px 0; }
    .unit-menu-toggle { display: block; }
    .unit-menu-wrap { display: none; width: 100%; }
    .unit-menu-wrap.is-open { display: block; }
    .unit-menu { width: 100%; }
    .unit-menu a { padding: 7px 9px; }
    .unit-search { width: 100%; }
    .unit-search input { width: 100%; }
    .unit-grid, .unit-grid--two, .unit-footer-grid, .unit-stat-row { grid-template-columns: 1fr; }
    .unit-hero { padding: 56px 0; }
    .unit-hero h1 { font-size: 2.6rem; }
    .unit-hero .unit-hero-layout { grid-template-columns: 1fr; gap: 36px; }
    .unit-signal-visual { min-height: 280px; }
    .unit-section { padding: 52px 0; }
    .unit-list li { align-items: flex-start; flex-direction: column; gap: 2px; }
    .unit-download-row { align-items: flex-start; grid-template-columns: 1fr; gap: 8px; }
    .unit-contact-band .unit-container { align-items: flex-start; flex-direction: column; }
}