/* Keep the existing type hierarchy; clamp only its undersized PC values. */
:root { --pc-min-font: 0px; --ui-ease: cubic-bezier(.23, 1, .32, 1); }
@media (min-width: 801px) {
  :root { --pc-min-font: 14px; }
  small { font-size: max(14px, .833333em); }
}

/* Navigation backgrounds include breathing room on both sides of each label. */
.main-nav { gap: 12px; }
.nav-link { font-weight: 400; padding-inline: 14px; }
.nav-dropdown a { font-weight: 400; }
.nav-item:last-child .nav-dropdown { left: auto; right: 0; }
.text-link:hover, .text-link:focus-visible { text-decoration: none; }
.home-news-list a { padding-inline: 18px; }
.home-news-list a > div { min-width: 0; }

/* Language choices are a visual menu; translation is intentionally not wired. */
.language { position: relative; display: flex; align-items: center; padding-left: 16px; }
.language-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 5px 7px; border: 0; background: transparent; color: inherit; font-size: 14px; }
.language-globe { width: 19px; height: 19px; flex-shrink: 0; }
.language-chevron { width: 12px; height: 12px; transition: transform 180ms ease; }
.language-toggle[aria-expanded="true"] .language-chevron { transform: rotate(180deg); }
.language-menu { position: absolute; top: calc(100% + 15px); right: 0; z-index: 32; width: 166px; padding: 7px; border: 1px solid #e1e7ee; background: white; color: var(--blue); box-shadow: 0 10px 28px #06204526; }
.language-option { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; min-height: 42px; padding: 8px 13px; border: 0; background: transparent; text-align: left; color: #526075; font-size: 14px; }
.language-option.is-current { color: var(--blue); background: #f1f5fb; }
.language-option svg { width: 15px; height: 15px; color: var(--gold); }
.language-toggle:focus-visible, .language-option:focus-visible { outline-offset: 1px; }
@media (hover: hover) and (pointer: fine) {
  .language-toggle:hover { color: var(--blue); background: #edf2fa; }
  .home-header .language-toggle:hover { color: var(--gold); background: #ffffff24; }
  .language-option:hover { background: #e9f0fa; color: var(--blue); }
}
@media (max-width: 1550px) { .main-nav { gap: 8px; } .nav-link { padding-inline: 12px; } }
@media (max-width: 1100px) { .main-nav { gap: 6px; } .nav-link { padding-inline: 10px; } .language { padding-left: 10px; } }
@media (min-width: 1001px) and (max-width: 1250px) {
  .header-inner { gap: 16px; }
  .brand { width: 160px; }
  .main-nav { gap: 4px; }
  .nav-link { padding-inline: 9px; font-size: 14px; }
  .header-tools { gap: 10px; }
  .language { padding-left: 10px; }
}
@media (max-width: 1000px) {
  .site-header { height: 74px; }
  .main-nav { display: none; position: absolute; top: 74px; left: 0; right: 0; height: auto; max-height: calc(100dvh - 74px); overflow: auto; padding: 16px 5% 28px; background: white; color: var(--blue); box-shadow: 0 20px 30px #06204530; }
  .main-nav.open { display: block; }
  .nav-item { display: block; border-bottom: 1px solid #eee; }
  .nav-link { display: block; height: auto; padding: 14px 12px; font-size: 16px; }
  .nav-dropdown { display: flex; flex-wrap: wrap; position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; padding: 0 12px 12px; gap: 3px 16px; }
  .nav-dropdown a { padding: 5px 0; white-space: normal; }
  .menu-toggle { display: block; }
  .language { display: flex; }
  .header-tools { gap: 10px; }
}
@media (max-width: 800px) { .home-news-list a { padding-inline: 12px; } }
@media (max-width: 480px) {
  .language { padding-left: 8px; }
  .language-label { display: none; }
  .language-toggle { gap: 4px; padding: 5px 3px; }
  .header-tools { gap: 8px; }
}

/* The photo track shares the hero's touch surface, with captions above it. */
.hero-home > .hero-slides { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; }
.hero-home:not(.banner-ready) > .hero-slides { visibility: hidden; }
.hero-home.banner-ready { background-image: none; background-color: #102e65; }
.hero-home .hero-slide { background-size: cover; background-position: center 39%; transition-timing-function: cubic-bezier(.4, 0, .2, 1); }
.hero-home > .zy-hero-veil { z-index: 1; }
.hero-home > .container { z-index: 2; pointer-events: none; }
.hero-home .hero-actions { pointer-events: auto; }
.hero-home > .hero-dots { z-index: 3; }
.hero-home .hero-dot { cursor: pointer; }
@media (max-width: 800px) { .hero-home .hero-slide { background-position: 47% center; } }

/* Explicit properties prevent CSS transitions from fighting GSAP transforms. */
a, button, [role="button"] {
  transition-property: color, background-color, border-color, box-shadow, opacity;
  transition-duration: 200ms;
  transition-timing-function: var(--ui-ease);
}
input, select, textarea { transition: border-color 180ms ease, background-color 180ms ease; }
.brand img { transition: opacity 180ms ease; }
.home-news-list h3, .home-news-list p, .news-row h2, .news-row p,
.product-card h3, .case-card h3, .service-step p { transition: color 200ms ease; }
.product-card, .case-card { transition: border-color 220ms ease, box-shadow 220ms ease; }
.module-icon { perspective: 700px; }
.module-icon svg { transform-origin: center; transition: transform 550ms var(--ui-ease), stroke 200ms ease; }
.service-step span { transition: color 200ms ease, border-color 200ms ease, background-color 200ms ease, box-shadow 200ms ease; }
.case-mosaic p { transition: background-color 200ms ease; }
.related img { transition: filter 220ms ease; }
.culture-card { transition: flex 350ms ease, box-shadow 200ms ease, color 200ms ease; }

@media (hover: hover) and (pointer: fine) {
  a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 5px; }
  :where(button:not(:disabled), [role="button"]):hover { color: var(--blue); background-color: #eef3fa; }
  .brand:hover, .nav-link:hover, .button:hover, .pill:hover, .module-icon:hover,
  .case-mosaic a:hover, .home-news-list a:hover, .service-step:hover { text-decoration: none; }
  .brand:hover img { opacity: .78; }
  .nav-link:hover { color: var(--gold); background-color: #103b820b; }
  .home-header .nav-link:hover { background-color: #ffffff14; }
  .nav-dropdown a:hover { color: var(--blue); background: #f0f4fb; }
  .icon-button:hover { background: #edf2fa; color: var(--blue); }
  .home-header .icon-button:hover { background: #ffffff24; color: var(--gold); }
  .hero-dot:hover { background: var(--gold); opacity: 1; box-shadow: 0 0 0 4px #ffffff25; }

  .button:hover { color: white; background: #b4a12c; border-color: #b4a12c; box-shadow: 0 4px 14px #173f781c; }
  .button.primary:hover { color: white; background: #082b66; border-color: #082b66; }
  .button.light:hover { background: #ffffff22; color: white; border-color: white; }
  .button.gold:hover, .inquiry-form button:hover { background: #dcc748; color: #15396e; }
  .text-link:hover { color: var(--blue); border-color: var(--blue); }
  .breadcrumb a:hover { color: var(--blue); }
  .product-card:hover, .product-card:focus-within, .case-card:hover, .case-card:focus-within {
    border-color: #6385b7; box-shadow: 0 5px 18px #103b8230;
  }
  .product-card:hover h3, .case-card:hover h3, .home-news-list a:hover h3,
  .news-row:hover h2, .news-row:hover h2 a { color: var(--blue); }
  .card-link:hover { background: #edf3fc; color: var(--blue); }
  .case-mosaic a:hover p { background: #103b82dd; }
  .home-news-list a:hover { background: #f6f8fc; }
  .home-news-list a:hover p, .news-row:hover p { color: #52719e; }
  .module-icon:hover { color: var(--blue); background: #edf2fa; }
  .module-icon:hover svg { transform: rotateY(360deg); stroke: var(--gold); }
  .module-icon:focus-visible svg { stroke: var(--gold); }
  .service-step:hover span { color: var(--blue); border-color: var(--blue); background: #f1f5fc; box-shadow: 0 4px 12px #103b821a; }
  .service-step:hover p { color: var(--blue); }
  .related a:hover img { filter: brightness(1.08); }

  .pill:hover { border-color: var(--blue); }
  .pill.active:hover { color: white; background: #082b66; }
  .pill.gold.active:hover { color: white; background: #b09d27; border-color: #b09d27; }
  .news-tabs button:hover { color: var(--blue); border-bottom-color: var(--blue); background: transparent; }
  .pagination button:hover:not(:disabled) { border-color: var(--blue); }
  .pagination button.active:hover { background: #af9c27; border-color: #af9c27; color: white; }
  .culture-card:hover { box-shadow: inset 0 -5px var(--gold); background-color: transparent; }
  .culture-card.active:hover { color: white; }
  .team-thumbnails button:hover { border-color: var(--blue); background: #f5f8fc; }
  .qualification-tabs button:hover { background: #e9eff8; color: var(--blue); }
  .qualification-tabs button.active:hover { background: #b09d27; color: white; }
  .qualification-display button:hover { border-color: var(--blue); box-shadow: 0 4px 18px #103b8220; }
  .recruit-tabs button:hover { color: var(--blue); background: transparent; box-shadow: inset 0 -2px var(--blue); }
  .job-filters button:hover { color: var(--blue); background: #edf3fc; }
  .job-table button:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 5px; }
  .job-search button:hover, .comment-note button:hover { background: #082b66; color: white; }
  .module-tabs button:hover { background: #f0f4fa; border-color: var(--gold); }
  .sensor:hover { background: #f8e66d; color: #152341; border-color: white; box-shadow: 0 0 0 4px #e9d54330, 0 0 18px #e7d84580; }
  .sensor.alert:hover { background: #f36d66; color: white; }
  .demo-actions button:hover { background: #e0cb4b; color: #18324f; }
  .demo-actions button + button:hover { background: #244679; color: white; border-color: #8197b7; }

  input:hover, select:hover, textarea:hover { border-color: #718fbd; }
  .inquiry-form input:hover { background: #ffffff12; border-bottom-color: #d7c55b; }
  .inquiry-form select:hover { background: #fbf8e9; }
  .dialog-close:hover { background: #edf3fc; color: var(--blue); }
  .search-results a:hover { background: #eef3fa; border-color: #9fb4d2; }
  .back-top:hover { background: #0b2b61; color: var(--gold); box-shadow: 0 5px 16px #103b8240; }
  .site-footer a:hover { color: #e1ce63; }
}

@media (prefers-reduced-motion: reduce) {
  .module-icon:hover svg { transform: none; }
  .hero-home .swiper-slide { transition-duration: 0ms !important; }
}

/* Keep the original dark blue backdrop with the company's source photograph. */
.culture-stage {
  background-image: linear-gradient(110deg, #071d3bde, #071d3b99), url('../images/image-053.webp');
}

/* Shared navigation stays visible without removing inner-page space from flow. */
:root { --header-height: 100px; }
html { scroll-padding-top: calc(var(--header-height) + 18px); }
.site-header { position: sticky; top: 0; z-index: 40; height: var(--header-height); }
.site-header.home-header { position: fixed; }
.home-header:not(.header-ready), .home-header.is-scrolled { background: white; color: var(--blue); border-bottom-color: #e7edf4; box-shadow: 0 3px 14px #103b8212; }

@media (hover: hover) and (pointer: fine) {
  .home-header.is-scrolled .nav-link:hover { background-color: #103b820b; }
  .home-header.is-scrolled .icon-button:hover,
  .home-header.is-scrolled .language-toggle:hover { color: var(--blue); background: #edf2fa; }
}

/* Original culture emphasis and the original four outlined icon shapes. */
.company-principle .principle-word { color: var(--gold); }
.culture-icon { display: block; width: 38px; height: 38px; margin-bottom: 14px; color: #555; }
.culture-card.active .culture-icon { display: none; }

/* Rotate only the source scan, including its enlarged view. */
.certificate-image { rotate: 180deg; }
.qualification-display .certificate-open { padding: 0; overflow: hidden; width: min(100%, 450px); }
.qualification-display .certificate-image { width: 100%; padding: 15px; }
.qualification-display .certificate-open p { margin: 0; padding: 9px 14px; background: var(--gold); color: white; }

/* The sequence numerals fade behind the overlapping service name in the design. */
.service-heading { gap: 0; align-items: flex-end; isolation: isolate; }
.service-heading .service-number { font: 700 100px/.95 Arial, sans-serif; letter-spacing: -.07em; color: #173a82; background: linear-gradient(#173a82 25%, #6673a0 58%, #f4f3f6 98%); background-clip: text; -webkit-text-fill-color: transparent; }
.service-heading .service-name { position: relative; z-index: 1; margin-left: -24px; padding-bottom: 4px; font: 500 35px/1.2 var(--serif); letter-spacing: 0; color: inherit; }
.blue .service-heading .service-number { background-image: linear-gradient(#f3f4fb 20%, #b2bdd9 62%, #103b82 100%); }

/* Module monitor: retain the original six-row grouping and compact toolbar. */
.module-panel { gap: 0; }
.module-panel li { position: relative; padding-left: 18px; }
.module-panel li::before { content: ''; position: absolute; left: 0; top: 1.05em; width: 9px; height: 2px; background: var(--gold); }
.module-preview { background: #0d0a26; border-radius: 7px; padding: 15px; margin-top: auto; }
.preview-toolbar { display: flex; align-items: center; justify-content: space-between; min-height: 24px; margin-bottom: 12px; padding-bottom: 6px; border-bottom: 1px solid #8c8146; color: #a9adc2; font-size: max(var(--pc-min-font), 12px); }
.preview-live-dot { width: 6px; height: 6px; margin-left: 2px; border-radius: 50%; background: #d6c940; box-shadow: 0 0 7px #e8d44c; }
.module-preview .module-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(6, auto); gap: 8px; margin: 0; padding: 0; background: transparent; }
.module-preview .metric { padding: 7px 9px; border-radius: 5px; border-color: #45465e; background: #20263f; font-size: max(var(--pc-min-font), 12px); line-height: 1.55; }
.module-preview .metric b { font-size: max(var(--pc-min-font), 15px); line-height: 1.6; }
.preview-temperature { grid-area: 2 / 1; }
.preview-tension { grid-area: 3 / 1; }
.preview-current { grid-area: 3 / 2; }
.preview-inspection { grid-area: 3 / 3; }
.preview-alarm { grid-area: 4 / 1; }
.preview-model { grid-area: 5 / 1; }
.preview-reuse { grid-area: 5 / 2; }
.preview-fps { grid-area: 5 / 3; }
.preview-zoom { grid-area: 6 / 1; }

@media (max-width: 1550px) { :root { --header-height: 82px; } }
@media (max-width: 1100px) {
  .module-preview { padding: 10px; }
  .module-preview .metric { padding: 7px; }
}
@media (max-width: 1000px) { :root { --header-height: 74px; } }
@media (min-width: 801px) {
  .culture-card { padding-inline: clamp(12px, .8vw, 16px); }
  .culture-card h3 { font-size: clamp(18px, 1.4vw, 24px); }
}
@media (max-width: 800px) {
  .culture-icon { width: 30px; height: 30px; margin: 18px 0 9px; }
  .service-heading .service-number { font-size: 76px; }
  .service-heading .service-name { margin-left: -18px; padding-bottom: 3px; font-size: 26px; }
  .module-preview { margin-top: 10px; }
  .module-preview .module-metrics { gap: 6px; }
  .preview-toolbar { font-size: 12px; }
  .module-preview .metric { font-size: 12px; padding: 6px; }
  .module-preview .metric b { font-size: 14px; }
}