:root {
  --font-serif: "Source Han Serif SC", "Songti SC", "STSong", "SimSun", Georgia, serif;
  --font-sans: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC", -apple-system, BlinkMacSystemFont, sans-serif;

  --type-h1: clamp(42px, 4.2vw, 56px);
  --type-h2: clamp(30px, 3vw, 40px);
  --type-h3: 24px;
  --type-body: 16px;
  --type-small: 14px;
  --type-eyebrow: 12px;

  --leading-h1: 1.08;
  --leading-h2: 1.16;
  --leading-h3: 1.28;
  --leading-body: 1.68;
  --leading-small: 1.72;
  --leading-eyebrow: 1.2;

  --section-space-standard: 120px;
  --section-space-compact: 88px;
  --section-space-standard-mobile: 88px;
  --section-space-compact-mobile: 72px;
  --space-title-copy: 16px;
  --space-copy-content: 24px;
  --space-eyebrow-title: 14px;
  --space-hero-to-body: 88px;
  --space-hero-to-body-mobile: 72px;
  --space-card-stack: 18px;
  --space-section-head: 32px;

  --card-padding: 28px;
  --card-padding-compact: 24px;
  --grid-gap: 24px;
  --grid-gap-compact: 18px;

  --container-width: 1200px;
  --container-gutter-desktop: 40px;
  --container-gutter-tablet: 32px;
  --container-gutter-mobile: 20px;
  --container-gutter: var(--container-gutter-desktop);
  --container-frame-width: calc(var(--container-width) + (var(--container-gutter) * 2));
  --hero-width: var(--container-width);
  --hero-copy-max: 760px;
  --hero-copy-body-max: 680px;

  --button-height: 48px;
  --button-height-compact: 40px;
  --button-padding-x: 22px;
  --button-radius: 14px;
  --button-font-size: 15px;
  --button-font-weight: 700;
  --button-primary-bg: #fcc92c;
  --button-primary-border: #fcc92c;
  --button-primary-text: #3a2a22;
  --button-primary-hover-bg: #f0bc1f;
  --button-primary-hover-border: #f0bc1f;
  --button-primary-hover-text: #3a2a22;
  --button-secondary-bg: transparent;
  --button-secondary-border: rgba(110, 61, 47, 0.22);
  --button-secondary-text: #6e3d2f;
  --button-secondary-hover-bg: rgba(252, 201, 44, 0.12);
  --button-secondary-hover-border: rgba(110, 61, 47, 0.32);
  --button-secondary-hover-text: #6e3d2f;

  --ratio-hero-media: 5 / 4;
  --ratio-card-image: 4 / 3;
  --ratio-banner-image: 16 / 9;
  --ratio-product-image: 1 / 1;

  --W: var(--container-width);
  --section-space: var(--section-space-standard);
  --content-max: var(--container-width);
  --content-wide: var(--container-frame-width);
  --section-gutter-total: calc(var(--container-gutter) * 2);
}

@media (max-width: 1024px) {
  :root {
    --container-gutter: var(--container-gutter-tablet);
  }
}

@media (max-width: 640px) {
  :root {
    --container-gutter: var(--container-gutter-mobile);
    --type-h1: 32px;
    --type-h2: 30px;
    --type-h3: 22px;
    --type-body: 16px;
    --type-small: 14px;
    --type-eyebrow: 12px;
    --section-space-standard: var(--section-space-standard-mobile);
    --section-space-compact: var(--section-space-compact-mobile);
    --space-hero-to-body: var(--space-hero-to-body-mobile);
    --card-padding: 24px;
    --card-padding-compact: 20px;
  }
}

body[data-page-key] {
  --W: var(--container-width);
  --content-max: var(--container-width);
  --content-wide: var(--container-frame-width);
  --section-space: var(--section-space-standard);
  --section-gutter-total: calc(var(--container-gutter) * 2);
  font-family: var(--font-sans);
}

body[data-page-key]:not([data-page-key="home"]) {
  --section-space-xl: var(--section-space-standard);
  --section-space-lg: var(--section-space-standard);
  --section-space-md: var(--section-space-compact);
  --section-space-sm: var(--grid-gap);
  --grid-gap-lg: var(--grid-gap);
  --grid-gap-md: var(--grid-gap-compact);
  --grid-gap-sm: var(--grid-gap-compact);
  --section-head-space: var(--space-section-head);
}

body[data-page-key="brands"],
body[data-page-key="food"],
body[data-page-key="health"],
body[data-page-key="bakery"],
body[data-page-key="beverage"],
body[data-page-key="medical"],
body[data-page-key="oem"],
body[data-page-key="oem-export"] {
  --section-space: var(--section-space-standard);
}

body[data-page-key="brands"] {
  --space-hero-to-body: 120px;
  --brand-section-gap-first: 120px;
  --brand-section-gap-standard-half: 44px;
  --brand-section-gap-compact-half: 40px;
  --brand-section-gap-feature-half: 60px;
  --brand-section-space-standard: 88px;
  --brand-section-head-space: 24px;
}

body[data-page-key="quality"] {
  --section-space-lg: var(--section-space-standard);
  --section-space-md: var(--section-space-compact);
  --quality-section-gap: var(--section-space-standard);
  --section-head-space: var(--space-section-head);
}

body[data-page-key="oem"],
body[data-page-key="oem-export"] {
  --oem-section-space: var(--section-space-standard);
}

body[data-page-key] .container,
body[data-page-key] .section-inner,
body[data-page-key] .inn {
  width: min(100% - calc(var(--container-gutter) * 2), var(--container-width));
  max-width: none;
  margin-inline: auto;
}

body[data-page-key] .top-notice-inner,
body[data-page-key] .nav-in,
body[data-page-key] .site-footer-frame,
body[data-page-key] .site-footer-record-inner {
  width: min(100% - calc(var(--container-gutter) * 2), var(--container-frame-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

body[data-page-key] .hero .inn,
body[data-page-key] .page-hero .inn,
body[data-page-key] .hero-inner,
body[data-page-key] .hero-shell {
  width: min(100% - calc(var(--container-gutter) * 2), var(--hero-width));
  max-width: none;
  margin-inline: auto;
}

body[data-page-key] :is(.hero-copy h1, .hero-content h1, .page-hero .hero-copy h1) {
  max-width: min(var(--hero-copy-max), 12ch);
  font-family: var(--font-serif) !important;
  font-size: var(--type-h1) !important;
  line-height: var(--leading-h1) !important;
  font-weight: 700 !important;
  letter-spacing: 0;
  white-space: normal;
  text-wrap: balance;
}

body[data-page-key] :is(.hero-copy p, .hero-content .hero-sub, .hero-intro p, .page-hero .hero-copy p) {
  max-width: var(--hero-copy-body-max);
  margin-top: var(--space-title-copy) !important;
  font-size: var(--type-body) !important;
  line-height: var(--leading-body) !important;
}

body[data-page-key] :is(.section-head h2, .section-title, .sec-title, .section-intro h2, .metrics-head h2, .material-head h2, .service-direction-head h2, .coordination-head h2, .intl-supply-head h2, .application-intro h2, .application-core-header h2, .application-head h2, .contact-box h2, .cta h2, .concern-head h2, .concern-panel h2, .concern-copy h2, .capability-copy h2, .supply-system-copy h2, .position-panel h2, .summary-card h2, .source-intro h2, .cert-copy h2, .support-feature h2, .home-section-title, .home-quality-copy h2, .home-tech-copy h2, .home-support-body h2, .home-industry-band h2) {
  font-family: var(--font-serif) !important;
  font-size: var(--type-h2) !important;
  line-height: var(--leading-h2) !important;
  font-weight: 700 !important;
  letter-spacing: 0;
}

body[data-page-key] :is(.contact-card h3, .info-card h3, .service-card h3, .scene-card h3, .product-card h3, .product-body h3, .application-row h3, .concern-item h3, .quality-card h3, .metric-card h3, .spec-card h3, .channel-item h3, .process-step h3, .brand-body h3, .scenario-copy h3, .value-copy h3, .stat-card h3, .cooperation-card-copy h3, .supply-module-copy h3, .coordination-item h3, .service-direction-item h3, .intl-supply-card h3, .medical-summary-panel h3, .app-body h3, .application-core-list h3, .application-step h3, .transport-row h3, .location-title h3, .home-process-head h3, .pillar h3) {
  font-family: var(--font-serif) !important;
  font-size: var(--type-h3) !important;
  line-height: var(--leading-h3) !important;
  font-weight: 700 !important;
  letter-spacing: 0;
}

body[data-page-key] :is(.section-head p, .section-desc, .sec-desc, .section-intro p, .company-copy p, .contact-card p, .location-panel p, .transport-row p, .guide-card p, .info-card p, .service-card p, .brand-body p, .pack-card p, .panel-copy p, .spec-body p, .product-body p, .product-card p, .concern-panel p, .concern-copy p, .concern-item p, .application-row p, .hero-note, .hero-note span, .app-body p, .quality-card p, .support-panel p, .capability-card p, .customer-card p, .application-intro p, .application-core-header p, .position-panel p, .metric-card p, .supply-system-copy p, .intl-supply-copy p, .coordination-copy p, .home-section-copy, .home-medical-products p, .home-support-body p, .home-quality-copy > p, .home-tech-copy p, .apps-story-copy p, .pillar p) {
  font-size: var(--type-body) !important;
  line-height: var(--leading-body) !important;
}

body[data-page-key] :is(.eyebrow, .hero-kicker, .hero-eyebrow, .section-kicker, .apps-story-kicker, .modal-hero-eyebrow, .apps-modal-card-label, .cert-item .cert-en) {
  font-family: var(--font-sans) !important;
  font-size: var(--type-eyebrow) !important;
  line-height: var(--leading-eyebrow) !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  margin-bottom: var(--space-eyebrow-title) !important;
}

body[data-page-key] :is(.top-notice-link, .hero-tags li, .brand-tags span, .metric span, .metric-item span, .summary-metric span, .float-text, .float-panel span, .float-panel p, .float-mobile-item, .float-mobile-sheet-body span, .home-tech-list li, .home-quality-metric p, .hero-strip span, .hero-note strong, .hero-note span) {
  font-size: var(--type-small);
  line-height: var(--leading-small);
}

body[data-page-key] .section {
  padding-block: var(--section-space-standard);
}

body[data-page-key="brands"] .section {
  padding-block: 0 !important;
}

body[data-page-key="home"] :is(.sec, #products, #certs, #home-business-entry) {
  padding-block: var(--section-space-standard);
}

body[data-page-key="home"] :is(.home-soft-section, #why.sec, .home-quality-section) {
  padding-block: var(--section-space-compact);
}

body[data-page-key="home"] #applications {
  padding-top: var(--section-space-compact);
}

body[data-page-key]:not([data-page-key="home"]) :is(.medical-summary-section, .medical-applications-section, .medical-materials-section, .medical-quality-section, .application-section, .service-direction-section, .packing-section, .coordination-section, .supply-system-section, .intl-supply-section) {
  padding-block: var(--section-space-standard);
}

body[data-page-key]:not([data-page-key="home"]) :is(.contact-band, .cta) {
  padding-block: var(--section-space-compact) !important;
}

body[data-page-key]:not([data-page-key="home"]) :is(.about-shell, .hero-shell, .material-head, .metrics-head) {
  gap: var(--section-space-compact);
}

body[data-page-key]:not([data-page-key="home"]) .hero-copy {
  padding-bottom: var(--space-hero-to-body) !important;
}

body[data-page-key]:not([data-page-key="home"]) :is(.hero-actions, .cta-actions, .btn-row) {
  gap: var(--grid-gap) !important;
  margin-top: var(--space-copy-content) !important;
}

body[data-page-key]:not([data-page-key="home"]) :is(.hero-layout, .page-hero .inn, .hero-shell) {
  gap: var(--grid-gap) !important;
}

body[data-page-key="food"] .hero-copy,
body[data-page-key="medical"] .page-hero .hero-copy {
  padding-top: var(--section-space-compact) !important;
  padding-bottom: var(--space-hero-to-body) !important;
}

body[data-page-key="food"] {
  --food-gap-hero: 120px;
  --food-gap-standard: 88px;
  --food-gap-half: 44px;
}

body[data-page-key="food"] :is(#scenes, #products, #concerns) {
  padding-block: 0 !important;
}

body[data-page-key="food"] #scenes {
  padding-top: var(--food-gap-hero) !important;
  padding-bottom: var(--food-gap-half) !important;
}

body[data-page-key="food"] :is(#products, #concerns) {
  padding-top: var(--food-gap-half) !important;
}

body[data-page-key="food"] #products {
  padding-bottom: var(--food-gap-half) !important;
}

body[data-page-key="food"] #concerns {
  padding-bottom: var(--section-space-compact) !important;
}

body[data-page-key="food"] :is(#scenes .section-head, #products .section-head, #concerns .concern-head) {
  margin-bottom: var(--space-copy-content) !important;
}

body[data-page-key="food"] :is(.scene-grid, .product-grid, .concern-grid) {
  gap: var(--grid-gap) !important;
}

body[data-page-key="food"] .scene-body {
  padding: 20px var(--card-padding) var(--card-padding) !important;
}

body[data-page-key="food"] .scene-card p,
body[data-page-key="food"] .product-card p,
body[data-page-key="food"] .concern-item p {
  margin-top: 14px !important;
}

body[data-page-key="food"] .scene-tags {
  margin-top: var(--space-copy-content) !important;
}

body[data-page-key="food"] .product-body {
  padding: 20px var(--card-padding) var(--card-padding) !important;
  row-gap: 0 !important;
}

body[data-page-key="food"] .concerns .concern-item {
  padding: var(--card-padding) !important;
  row-gap: 0 !important;
}

body[data-page-key="food"] .concern-icon {
  margin-bottom: 20px !important;
}

body[data-page-key="medical"] {
  --medical-gap-first: 120px;
  --medical-gap-standard: 88px;
  --medical-gap-dark: 120px;
  --medical-gap-standard-half: 44px;
  --medical-gap-dark-half: 60px;
  --medical-hero-bottom-space: 120px;
}

body[data-page-key="medical"] .page-hero .hero-copy {
  align-self: flex-end;
  max-width: 480px;
  padding-bottom: var(--medical-hero-bottom-space) !important;
}

body[data-page-key="medical"] .page-hero .hero-copy h1 {
  max-width: none !important;
  font-size: var(--type-h1) !important;
  text-wrap: normal;
  line-break: auto;
}

body[data-page-key="medical"] .app-card {
  padding: 0 !important;
}

body[data-page-key="food"] .scene-card {
  padding: 0 !important;
  row-gap: 0 !important;
}

body[data-page-key="medical"] :is(.medical-summary-section, .medical-applications-section, .medical-materials-section, .medical-quality-section, .application-section) > .inn {
  width: min(100% - calc(var(--container-gutter) * 2), var(--container-frame-width)) !important;
}

body[data-page-key="medical"] :is(.medical-summary-section, .medical-applications-section, .medical-materials-section, .medical-quality-section, .application-section) {
  padding-block: 0 !important;
}

body[data-page-key="medical"] .medical-summary-section {
  padding-top: var(--medical-gap-first) !important;
  padding-bottom: var(--medical-gap-standard-half) !important;
}

body[data-page-key="medical"] :is(.medical-applications-section, .medical-materials-section) {
  padding-top: var(--medical-gap-standard-half) !important;
  padding-bottom: var(--medical-gap-standard-half) !important;
}

body[data-page-key="medical"] .medical-quality-section {
  padding-top: var(--medical-gap-standard-half) !important;
  padding-bottom: var(--medical-gap-dark-half) !important;
}

body[data-page-key="medical"] .application-section {
  padding-top: var(--medical-gap-dark-half) !important;
  padding-bottom: var(--medical-gap-dark-half) !important;
}

body[data-page-key="oem"] {
  --oem-gap-first: 120px;
  --oem-gap-standard: 88px;
  --oem-gap-standard-half: 44px;
  --oem-gap-banner: 120px;
  --oem-gap-banner-half: 60px;
}

body[data-page-key="oem"] :is(.service-direction-section, .packing-section, .coordination-section, .supply-system-section, .intl-supply-section) {
  padding-block: 0 !important;
}

body[data-page-key="oem"] .service-direction-section {
  padding-top: var(--oem-gap-banner) !important;
  padding-bottom: var(--oem-gap-standard-half) !important;
}

body[data-page-key="oem"] :is(.service-direction-section, .packing-section, .coordination-section, .supply-system-section, .intl-supply-section) {
  background: #fdf8ef !important;
}

body[data-page-key="oem"] :is(.packing-section, .coordination-section) {
  padding-top: var(--oem-gap-standard-half) !important;
  padding-bottom: var(--oem-gap-standard-half) !important;
}

body[data-page-key="oem"] .coordination-section {
  padding-bottom: var(--oem-gap-banner-half) !important;
}

body[data-page-key="oem"] .supply-system-section {
  padding-top: var(--oem-gap-banner-half) !important;
  padding-bottom: var(--oem-gap-banner-half) !important;
}

body[data-page-key="oem"] .intl-supply-section {
  padding-top: var(--oem-gap-banner-half) !important;
  padding-bottom: var(--oem-gap-standard-half) !important;
}

body[data-page-key="oem"] .contact-band {
  padding-top: var(--oem-gap-standard-half) !important;
  padding-bottom: var(--section-space-compact) !important;
}

body[data-page-key="oem"] :is(.service-direction-head, .packing-section .section-head, .coordination-head, .intl-supply-head) {
  margin-bottom: var(--space-copy-content) !important;
}

body[data-page-key="oem"] :is(.section-head, .coordination-head) {
  row-gap: var(--space-title-copy) !important;
  column-gap: var(--grid-gap) !important;
}

body[data-page-key="oem"] :is(.spec-grid, .intl-supply-grid) {
  gap: var(--grid-gap) !important;
}

body[data-page-key="oem"] :is(.service-direction-item, .coordination-item, .spec-body) {
  padding: var(--card-padding) !important;
}

body[data-page-key="oem"] .service-direction-item {
  min-height: 0;
  border-left-color: var(--oem-line);
}

body[data-page-key="oem"] .service-direction-icon {
  width: 30px !important;
  height: 30px !important;
}

body[data-page-key="oem"] .service-direction-item:first-child {
  padding-left: 0 !important;
}

body[data-page-key="oem"] .service-direction-item:last-child {
  padding-right: 0 !important;
}

body[data-page-key="oem"] .coordination-item {
  min-height: 0;
  border-left-color: var(--oem-line);
}

body[data-page-key="oem"] .coordination-item:first-child {
  padding-left: 0 !important;
}

body[data-page-key="oem"] .coordination-item:last-child {
  padding-right: 0 !important;
}

body[data-page-key="oem"] :is(.service-direction-item p, .coordination-item p, .spec-card p, .intl-supply-card p) {
  margin-top: 14px !important;
}

body[data-page-key="oem"] .spec-card {
  gap: 0 !important;
}

body[data-page-key="oem"] .spec-body {
  row-gap: 0 !important;
}

body[data-page-key="oem"] .intl-supply-card {
  gap: 0 !important;
}

body[data-page-key="oem"] .intl-supply-card h3 {
  padding: var(--card-padding) var(--card-padding) var(--card-padding) !important;
}

body[data-page-key="oem"] .supply-system-copy p {
  margin-top: var(--space-title-copy) !important;
}

body[data-page-key="health"] .hero,
body[data-page-key="bakery"] .hero,
body[data-page-key="beverage"] .hero {
  padding-block: var(--section-space-compact) !important;
}

body[data-page-key="health"] .hero-copy,
body[data-page-key="bakery"] .hero-copy,
body[data-page-key="beverage"] .hero-copy {
  padding-block: 0 !important;
}

body[data-page-key]:not([data-page-key="home"]) .about-shell {
  gap: var(--section-space-compact) !important;
  padding-block: var(--section-space-standard) var(--section-space-compact) !important;
}

body[data-page-key]:not([data-page-key="home"]) .about-content {
  gap: var(--section-space-standard) !important;
}

body[data-page-key]:not([data-page-key="home"]) :is(.section-head, .sec-head-center, .service-direction-head, .coordination-head, .intl-supply-head, .metrics-head, .section-intro, .material-head, .application-intro, .application-core-header, .application-head) {
  row-gap: var(--grid-gap-compact) !important;
  column-gap: var(--grid-gap) !important;
  margin-bottom: var(--space-section-head) !important;
}

body[data-page-key="brands"] :is(.section-head, .sec-head-center, .service-direction-head, .coordination-head, .intl-supply-head, .metrics-head, .section-intro, .material-head, .application-intro, .application-core-header, .application-head) {
  row-gap: var(--space-title-copy) !important;
  column-gap: var(--grid-gap) !important;
  margin-bottom: var(--brand-section-head-space) !important;
}

body[data-page-key="food"] :is(#scenes .section-head, #products .section-head, #concerns .concern-head) {
  margin-bottom: var(--space-copy-content) !important;
}

body[data-page-key] :is(.contact-grid, .brand-grid, .channel-grid, .pack-grid, .stats-grid, .service-grid, .card-grid, .scene-grid, .product-grid, .service-row, .spec-grid, .customer-grid, .capability-grid, .quality-grid, .app-grid, .factory-cards, .concern-list, .application-rows, .metrics-grid, .material-grid, .showcase-grid, .showcase-hero-row, .apps-stories, .hero-actions, .cta-actions, .btn-row) {
  gap: var(--grid-gap);
}

body[data-page-key] :is(.process, .scenario-grid, .hero-tags, .hero-metrics) {
  gap: var(--grid-gap-compact);
}

body[data-page-key="brands"] :is(.process, .scenario-grid) {
  gap: var(--grid-gap) !important;
}

body[data-page-key] :is(.contact-card, .location-panel, .transport-row, .guide-card, .info-card, .service-card, .brand-body, .pack-card, .scene-card, .product-body, .concern-item, .application-row, .metric-card, .quality-card, .support-panel, .app-card, .spec-body, .material-card, .source-card, .logo-card, .position-panel, .value-card, .pillar-content, .showcase-item, .home-support-card, .home-industry-copy) {
  padding: var(--card-padding);
}

body[data-page-key]:not([data-page-key="home"]) :is(.contact-card, .location-panel, .transport-row, .guide-card, .info-card, .service-card, .brand-body, .pack-card, .scene-card, .product-body, .concern-item, .application-row, .metric-card, .quality-card, .support-panel, .app-card, .spec-body, .material-card, .source-card, .logo-card, .position-panel, .value-card, .customer-card, .capability-card, .process-step) {
  row-gap: var(--space-card-stack) !important;
  column-gap: var(--space-card-stack) !important;
}

body[data-page-key="brands"] #matrix {
  padding-top: var(--brand-section-gap-first) !important;
  padding-bottom: var(--brand-section-gap-compact-half) !important;
}

body[data-page-key="brands"] #channels {
  padding-top: var(--brand-section-gap-compact-half) !important;
  padding-bottom: var(--brand-section-gap-feature-half) !important;
}

body[data-page-key="brands"] #packaging {
  padding-top: var(--brand-section-gap-feature-half) !important;
  padding-bottom: var(--brand-section-gap-compact-half) !important;
}

body[data-page-key="brands"] #process {
  padding-top: var(--brand-section-gap-compact-half) !important;
  padding-bottom: var(--brand-section-gap-standard-half) !important;
}

body[data-page-key="brands"] #position {
  padding-top: var(--brand-section-gap-standard-half) !important;
  padding-bottom: var(--brand-section-space-standard) !important;
}

body[data-page-key="brands"] .position-panel {
  padding: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  background: #efeee5 !important;
}

body[data-page-key="brands"] .capability-top,
body[data-page-key="brands"] .capability-metrics {
  padding-right: var(--card-padding) !important;
  background: #efeee5 !important;
}

body[data-page-key="brands"] .capability-copy {
  background-position: left center !important;
}

body[data-page-key="brands"] .hero-copy h1,
body[data-page-key="brands"] .hero-copy p {
  color: #fff !important;
}

body[data-page-key="brands"] .brand-body {
  row-gap: 0 !important;
  column-gap: 0 !important;
}

body[data-page-key="brands"] .brand-card,
body[data-page-key="brands"] .brand-media,
body[data-page-key="brands"] .brand-body {
  background: #fff !important;
}

body[data-page-key="brands"] .brand-product {
  width: calc(100% - 64px) !important;
  max-width: 336px !important;
  max-height: 280px !important;
}

body[data-page-key="brands"] .brand-body p,
body[data-page-key="brands"] .capability-copy p {
  margin-top: var(--space-title-copy) !important;
}

body[data-page-key="brands"] .brand-tags {
  margin-top: var(--space-copy-content) !important;
}

body[data-page-key="brands"] .channel-item h3,
body[data-page-key="brands"] .scenario-copy h3,
body[data-page-key="brands"] .value-copy h3,
body[data-page-key="brands"] .capability-copy h2 {
  margin-bottom: var(--space-title-copy) !important;
}

body[data-page-key="brands"] .scenario-copy {
  row-gap: 0 !important;
}

body[data-page-key="brands"] .process-step b {
  margin-bottom: var(--space-eyebrow-title) !important;
}

body[data-page-key="food"] .product-body {
  padding: 20px var(--card-padding) var(--card-padding) !important;
  row-gap: 0 !important;
}

body[data-page-key="food"] .product-card p {
  margin-top: 14px !important;
}

body[data-page-key="food"] .concerns .concern-item {
  row-gap: 0 !important;
}

body[data-page-key="food"] .concern-item p {
  margin-top: 14px !important;
}

body[data-page-key="oem"] :is(.service-direction-head, .packing-section .section-head, .coordination-head, .intl-supply-head) {
  margin-bottom: var(--space-copy-content) !important;
}

body[data-page-key="oem"] :is(.section-head, .coordination-head) {
  row-gap: var(--space-title-copy) !important;
  column-gap: var(--grid-gap) !important;
}

body[data-page-key="oem"] .spec-body {
  padding: var(--card-padding) !important;
  row-gap: 0 !important;
}

body[data-page-key="oem"] :is(.service-direction-item h3, .coordination-item h3) {
  margin-top: 20px !important;
}

body[data-page-key="oem"] .spec-card p {
  margin-top: 14px !important;
}

body[data-page-key="oem"] .spec-card-product .spec-image img {
  padding: 2px !important;
  transform: scale(1.18);
  transform-origin: center;
}

body[data-page-key="oem"] .spec-card-product:hover .spec-image img {
  transform: scale(1.2);
}

body[data-page-key="oem"] .packing-section .spec-body {
  display: grid !important;
  align-content: start;
  row-gap: 22px !important;
}

body[data-page-key="oem"] .packing-section .spec-card h3,
body[data-page-key="oem"] .packing-section .spec-card p {
  margin-top: 0 !important;
  line-height: 1 !important;
}

body[data-page-key="oem"] .hero-copy h1 {
  max-width: none !important;
  color: #fff !important;
  white-space: nowrap !important;
  text-wrap: nowrap !important;
}

body[data-page-key="oem"] .hero-copy p {
  color: #fff !important;
}

body[data-page-key="oem"] .hero-copy {
  padding-bottom: 0 !important;
}

body[data-page-key="oem"] .hero-copy .eyebrow {
  margin-bottom: var(--space-eyebrow-title) !important;
}

body[data-page-key="quality"] :is(#understanding, #origins, #metrics, #certification, #support) {
  padding-block: var(--section-space-standard) !important;
}

body[data-page-key] :is(.hero-note, .metric, .summary-metric, .brand-tags span, .hero-strip span, .home-tech-qr, .home-quality-metric) {
  padding: var(--card-padding-compact);
}

body[data-page-key] :is(.hero-tags li, .brand-tags span, .scene-tag, .product-meta li, .indicator-tags li) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 8px 12px !important;
  border: none !important;
  border-radius: 999px !important;
  background: #f9f5ec !important;
  color: var(--button-secondary-text) !important;
  font-size: var(--type-small) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  text-align: center;
  box-shadow: none !important;
}

body[data-page-key] :is(.btn, .btn-primary, .btn-ghost) {
  min-height: var(--button-height) !important;
  padding-inline: var(--button-padding-x) !important;
  border-radius: var(--button-radius) !important;
  font-size: var(--button-font-size) !important;
  font-weight: var(--button-font-weight) !important;
  box-shadow: none;
  transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease, opacity 0.22s ease;
}

body[data-page-key] .btn-primary {
  background: var(--button-primary-bg);
  border: 1px solid var(--button-primary-border);
  color: var(--button-primary-text);
}

body[data-page-key] .btn-primary:hover {
  background: var(--button-primary-hover-bg);
  border-color: var(--button-primary-hover-border);
  color: var(--button-primary-hover-text);
  transform: none;
  box-shadow: none;
}

body[data-page-key] :is(.btn-ghost, .btn:not(.btn-primary):not(.nav-contact)) {
  background: var(--button-secondary-bg);
  border: 1px solid var(--button-secondary-border);
  color: var(--button-secondary-text);
}

body[data-page-key] :is(.btn-ghost:hover, .btn:not(.btn-primary):not(.nav-contact):hover) {
  background: var(--button-secondary-hover-bg);
  border-color: var(--button-secondary-hover-border);
  color: var(--button-secondary-hover-text);
  transform: none;
  box-shadow: none;
}

body[data-page-key] .nav-contact {
  min-height: var(--button-height-compact);
  padding-inline: 16px;
  border-radius: var(--button-radius);
  font-size: var(--type-small);
  font-weight: var(--button-font-weight);
}

body[data-page-key] :is(.hero-media, .home-quality-image, .home-support-media) {
  aspect-ratio: var(--ratio-hero-media);
  min-height: 0;
}

body[data-page-key] :is(.hero-media img, .home-quality-image img, .home-support-media img) {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
}

body[data-page-key] :is(.product-img, .spec-image) {
  aspect-ratio: var(--ratio-product-image);
  height: auto;
}

body[data-page-key] :is(.product-img img, .spec-image img) {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body[data-page-key] .spec-card-product .spec-image img,
body[data-page-key] .brand-product,
body[data-page-key="home"] :is(.showcase-item img, .showcase-hero-item img) {
  object-fit: contain;
}

body[data-page-key] :is(.pillar-visual, .scenario-media, .home-honey-flow-frame) {
  aspect-ratio: var(--ratio-card-image);
}

body[data-page-key] .home-honey-flow-frame {
  aspect-ratio: var(--ratio-banner-image);
}

body[data-page-key] :is(.pillar-visual img, .scenario-media img, .home-honey-flow-frame img) {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 640px) {
  body[data-page-key]:not([data-page-key="home"]) {
    --section-space-xl: var(--section-space-standard);
    --section-space-lg: var(--section-space-standard);
    --section-space-md: var(--section-space-compact);
    --section-space-sm: var(--grid-gap);
  }

  body[data-page-key] .nav-contact {
    min-height: 36px;
    padding-inline: 14px;
  }

  body[data-page-key="food"] {
    --food-gap-hero: 88px;
    --food-gap-standard: 72px;
    --food-gap-half: 36px;
  }

  body[data-page-key="brands"] {
    --space-hero-to-body: 72px;
    --brand-section-gap-first: 88px;
    --brand-section-gap-standard-half: 44px;
    --brand-section-gap-compact-half: 36px;
    --brand-section-gap-feature-half: 44px;
    --brand-section-space-standard: 88px;
  }

  body[data-page-key="food"] #concerns {
    padding-bottom: var(--food-gap-standard) !important;
  }

  body[data-page-key="food"] .scene-body,
  body[data-page-key="food"] .product-body {
    padding: 20px var(--card-padding) var(--card-padding) !important;
  }

  body[data-page-key="food"] .concerns .concern-item {
    padding: var(--card-padding) !important;
  }

  body[data-page-key] :is(.contact-card, .location-panel, .transport-row, .guide-card, .info-card, .service-card, .brand-body, .pack-card, .scene-card, .product-body, .concern-item, .application-row, .metric-card, .quality-card, .support-panel, .app-card, .spec-body, .material-card, .source-card, .logo-card, .position-panel, .value-card, .pillar-content, .showcase-item, .home-support-card, .home-industry-copy) {
    padding: var(--card-padding);
  }

  body[data-page-key="food"] .product-body {
    padding: 20px var(--card-padding) var(--card-padding) !important;
  }

  body[data-page-key="oem"] {
    --oem-gap-first: 88px;
    --oem-gap-standard: 72px;
    --oem-gap-standard-half: 36px;
    --oem-gap-banner: 88px;
    --oem-gap-banner-half: 44px;
  }

  body[data-page-key="oem"] :is(.service-direction-head, .packing-section .section-head, .coordination-head, .intl-supply-head) {
    margin-bottom: var(--space-copy-content) !important;
  }

  body[data-page-key="oem"] :is(.service-direction-item, .coordination-item, .spec-body) {
    padding: var(--card-padding) !important;
  }

  body[data-page-key="oem"] .spec-body {
    padding: var(--card-padding) !important;
  }

  body[data-page-key="oem"] .intl-supply-card h3 {
    padding: var(--card-padding) !important;
  }

  body[data-page-key] :is(.hero-copy h1, .hero-content h1, .page-hero .hero-copy h1) {
    max-width: 100%;
  }

  body[data-page-key="medical"] .page-hero .hero-copy h1 {
    max-width: 100%;
  }

  body[data-page-key="medical"] {
    --medical-gap-first: 80px;
    --medical-gap-standard-half: 36px;
    --medical-gap-dark-half: 44px;
    --medical-hero-bottom-space: 72px;
  }
}
