/* =========================================================
   Zhiyan Showcase v25 — typography & rhythm system
   One scale, one spacing rhythm, one brand hierarchy.
   ========================================================= */
:root{
  --v25-hero:clamp(56px,5.25vw,84px);
  --v25-section:clamp(42px,3.75vw,60px);
  --v25-section-compact:clamp(38px,3.35vw,54px);
  --v25-panel-title:clamp(28px,2.25vw,38px);
  --v25-body:15px;
  --v25-body-small:13px;
  --v25-label:10px;
  --v25-section-y:clamp(96px,7.6vw,128px);
  --v25-section-gap:clamp(28px,3vw,44px);
  --v25-radius-xl:28px;
  --v25-radius-lg:20px;
  --v25-weight-display:780;
  --v25-weight-title:760;
  --v25-weight-ui:680;
}

/* Global typography */
body{font-weight:400;letter-spacing:0}
.hero h1,
.continuity-title-block h2,
.organization-v15-head h2,
.instrument-v14-title h2,
.contact-copy h2,
.final-cta h2{
  font-family:Inter,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif!important;
  font-weight:var(--v25-weight-display)!important;
  letter-spacing:-.055em!important;
  text-wrap:balance;
}
.hero h1{font-size:var(--v25-hero)!important;line-height:1.045!important}
.continuity-title-block h2,
.organization-v15-head h2,
.instrument-v14-title h2{font-size:var(--v25-section)!important;line-height:1.055!important}
.contact-copy h2,.final-cta h2{font-size:var(--v25-section-compact)!important;line-height:1.07!important}

.hero-copy>p,
.continuity-v10-copy>p,
.organization-v15-head>p,
.instrument-v14-title>p,
.contact-copy>p,
.final-cta p{
  font-size:var(--v25-body)!important;
  line-height:1.86!important;
  letter-spacing:-.01em;
}
.eyebrow,
.hero-meta,
.instrument-v14-note,
.instrument-live,
.instrument-breadcrumb,
.context-assets header,
.context-audit header{
  font-size:var(--v25-label)!important;
  letter-spacing:.12em!important;
}

/* Section rhythm */
.continuity-v9,
.organization-v15,
.instrument-v11,
.contact-section,
.final-cta{
  padding-top:var(--v25-section-y)!important;
  padding-bottom:var(--v25-section-y)!important;
}
.continuity-v10-head,
.organization-v15-head,
.instrument-v11-head{margin-bottom:var(--v25-section-gap)!important}

/* Header is calmer and more consistent */
.site-header .desktop-nav{gap:clamp(26px,2.6vw,42px)}
.site-header .desktop-nav a{font-size:13px!important;font-weight:650!important;letter-spacing:-.01em}
.brand-text strong{font-size:18px!important;font-weight:760!important;letter-spacing:-.03em}
.brand-text small{font-size:9px!important;letter-spacing:.14em!important}
.header-actions .text-link{font-size:13px!important;font-weight:650!important}
.header-actions .button{min-height:44px;padding-inline:18px!important;border-radius:13px!important}

/* Hero: brand-first, not oversized compared with the rest */
.hero-shell{column-gap:clamp(54px,6vw,96px)!important}
.hero-copy{max-width:760px}
.hero-copy>p{max-width:630px!important;margin-top:24px!important}
.hero-actions{margin-top:30px!important}
.hero-actions .button{min-height:48px;border-radius:14px!important;font-size:13px!important;font-weight:700!important}
.hero-signals{margin-top:42px!important}
.hero-signals strong{font-weight:750!important}
.hero-signals span{font-size:11px!important;font-weight:650!important}
.hero-signals small{font-size:10px!important}

/* Section headings all use the same editorial composition */
.continuity-v9-head,
.organization-v15-head,
.instrument-v11-head{
  grid-template-columns:minmax(0,1.08fr) minmax(330px,.62fr)!important;
  gap:clamp(48px,6vw,88px)!important;
  align-items:end!important;
}
.continuity-title-block h2{max-width:790px!important;margin-top:14px!important}
.organization-v15-head h2{max-width:820px!important}
.instrument-v14-title h2{max-width:820px!important;margin-top:14px!important}
.continuity-v10-copy>p,.organization-v15-head>p{max-width:530px!important}
.instrument-v14-title>p{max-width:660px!important}

/* Panels and cards share a common geometry */
.continuity-v10-stage,
.institution-duet,
.instrument-workbench-v11,
.contact-shell{
  border-radius:var(--v25-radius-xl)!important;
}
.context-scenarios button,
.instrument-tabs-v11,
.workbench-controls-v11,
.engineering-layer,
.academic-label,
.contact-channels button,
.contact-email,
.contact-form,
.metric-card,
.lab-panel{
  border-radius:var(--v25-radius-lg)!important;
}

/* UI copy and titles */
.context-scenarios button b,
.instrument-tabs-v11 button b,
.contact-channels b{font-size:13px!important;font-weight:700!important;letter-spacing:-.02em}
.context-scenarios button small,
.instrument-tabs-v11 button small,
.contact-channels small{font-size:10px!important;line-height:1.55!important}
.institution-pane-copy h3{font-size:var(--v25-panel-title)!important;font-weight:var(--v25-weight-title)!important;letter-spacing:-.045em!important}
.institution-pane-copy p{font-size:14px!important;line-height:1.82!important}
.instrument-v11 .lab-titlebar h3{font-weight:760!important;letter-spacing:-.035em!important}
.instrument-v11 .metric-card strong{font-weight:740!important}

/* Organization: reduce visual shouting, improve left/right balance */
.institution-duet{min-height:620px!important}
.institution-pane{padding:32px 36px 36px!important}
.institution-pane-copy{margin-top:48px!important}
.institution-pane-bg span{font-weight:850!important;opacity:.7}
.institution-v15-footer{margin-top:20px!important}

/* Tools: controls become secondary to the workbench */
.instrument-v11-selector{margin-bottom:16px!important}
.instrument-tabs-v11 button{min-height:72px!important;padding:12px 14px!important}
.workbench-controls-v11 button{height:44px!important;padding-inline:14px!important;font-size:10px!important;font-weight:680!important}
.instrument-workbench-v11{overflow:hidden}
.instrument-workbench-top-v11{min-height:58px!important}
.instrument-workbench-footer-v11{min-height:56px!important}

/* Contact: less heavy than a product workbench */
.contact-shell{gap:clamp(48px,5vw,76px)!important;padding:clamp(40px,4.5vw,64px)!important}
.contact-copy{max-width:620px}
.contact-channels{margin-top:28px!important}
.contact-channels button{min-height:72px;padding:15px 16px!important}
.contact-form{padding:28px!important}
.contact-form label>span{font-size:11px!important;font-weight:620!important}
.contact-form input,.contact-form textarea,.contact-form select{font-size:13px!important;line-height:1.5!important}
.final-cta .cta-shell{max-width:920px;text-align:center}
.final-cta p{max-width:590px;margin-left:auto!important;margin-right:auto!important}

/* Light theme palette consistency */
html[data-theme="light"] .hero h1,
html[data-theme="light"] .continuity-title-block h2,
html[data-theme="light"] .organization-v15-head h2,
html[data-theme="light"] .instrument-v14-title h2,
html[data-theme="light"] .contact-copy h2,
html[data-theme="light"] .final-cta h2{color:#18213d!important}
html[data-theme="light"] .hero h1 span,
html[data-theme="light"] .continuity-title-block h2 em,
html[data-theme="light"] .organization-v15-head h2 em,
html[data-theme="light"] .instrument-v14-title h2 em,
html[data-theme="light"] .contact-copy h2 em{color:#5f70e8!important;background:none!important;-webkit-text-fill-color:currentColor!important}
html[data-theme="light"] .hero-copy>p,
html[data-theme="light"] .continuity-v10-copy>p,
html[data-theme="light"] .organization-v15-head>p,
html[data-theme="light"] .instrument-v14-title>p{color:#65728b!important}

/* Dark theme final brand pass: softer headings, fewer white stretches */
html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .continuity-title-block h2,
html[data-theme="dark"] .organization-v15-head h2,
html[data-theme="dark"] .instrument-v14-title h2,
html[data-theme="dark"] .contact-copy h2,
html[data-theme="dark"] .final-cta h2{color:#dbe4fb!important}
html[data-theme="dark"] .hero h1 span,
html[data-theme="dark"] .continuity-title-block h2 em,
html[data-theme="dark"] .organization-v15-head h2 em,
html[data-theme="dark"] .instrument-v14-title h2 em,
html[data-theme="dark"] .contact-copy h2 em{color:#91a2ff!important;background:none!important;-webkit-text-fill-color:currentColor!important}
html[data-theme="dark"] .hero-copy>p,
html[data-theme="dark"] .continuity-v10-copy>p,
html[data-theme="dark"] .organization-v15-head>p,
html[data-theme="dark"] .instrument-v14-title>p,
html[data-theme="dark"] .contact-copy>p,
html[data-theme="dark"] .final-cta p{color:#a8b5d1!important}
html[data-theme="dark"] .eyebrow{color:#8798f7!important}

/* Responsive rhythm */
@media(max-width:1180px){
  .continuity-v9-head,.organization-v15-head,.instrument-v11-head{grid-template-columns:1fr!important;gap:22px!important}
  .continuity-v10-copy>p,.organization-v15-head>p{max-width:700px!important}
  .instrument-v14-title>p{max-width:720px!important}
}
@media(max-width:720px){
  :root{--v25-hero:clamp(42px,12vw,54px);--v25-section:clamp(34px,9.6vw,42px);--v25-section-compact:clamp(32px,8.8vw,40px);--v25-body:13px;--v25-section-y:82px}
  .hero h1,.continuity-title-block h2,.organization-v15-head h2,.instrument-v14-title h2,.contact-copy h2,.final-cta h2{line-height:1.075!important;letter-spacing:-.048em!important}
  .institution-pane{padding:24px 22px 26px!important}
  .contact-shell{padding:26px 22px!important}
  .context-scenarios button b,.instrument-tabs-v11 button b,.contact-channels b{font-size:12px!important}
}
