html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 0;
}

/* ----- 상단 네비 높이(히어로 min-height 계산용). 줄바꿈 시 값만 키우면 됨 ----- */
:root {
  /* 고정 헤더 높이 추정(히어로 padding-top). 탑바 py·링크 높이 늘리면 같이 키움 */
  --site-header-h: 5rem;
  /* 모바일 햄버거 메뉴: 탑바만(펼친 메뉴 제외) 높이 — JS가 show 시 고정 */
  --site-header-bar-h: 5rem;
  /* 메인 타이틀을 세로 중앙에서 위로 (값 ↑ = 더 위로) */
  --hero-title-lift: 20vh;

  /*
   * HD현대마린솔루션 개요「사이트」SNS pill
   * 출처: https://www.hd-marinesolution.com/kr/company/about/overview/contents
   * 상세: docs/design-references/hd-marinesolution-company-overview.md
   * --Color-Blue-Primary (#003087), .overview .sns-box a (height/min-width 56rem 등)
   */
  --ref-hd-marine-blue-primary: #003087;
  --ref-hd-marine-blue-primary-hover: #00266e;
  /* 로버스텍 사업부문(PageNavRail 제품군 탭 등) */
  --robustech-brand: #003087;
  --robustech-brand-hover: #00266a;
  --robustech-brand-accent: #004282;
  --robustech-brand-tab-bg: #e4ebf5;
  --robustech-brand-tab-bg-hover: #d5e0f2;
  /* Hi-INS accent — GNB LABS 로고·태그라인 전환색 */
  --labs-brand-accent: #1b2d26;
  --ref-hd-marine-sns-pill-height: 3.5rem;
  --ref-hd-marine-sns-pill-padding-y: 1rem;
  --ref-hd-marine-sns-pill-padding-x-start: 1rem;
  --ref-hd-marine-sns-pill-padding-x-end: 1.5rem;
  --ref-hd-marine-sns-pill-gap: 0.5rem;
  --ref-hd-marine-sns-row-gap: 1.25rem;
  --ref-hd-marine-sns-icon: 1.375rem;
}

/* ----- 스크롤형 메인: 첫 화면 = 네비 + (뷰포트 − 네비) 높이의 영상 구역 ----- */
.hero-video-page {
  margin-bottom: 0;
}

/*
 * 메뉴가 투명일 때 뒤가 ‘흰 body’로 보이면 글자가 안 보임.
 * 헤더를 fixed로 뷰포트 상단에 두고, 히어로 영역을 100dvh로 올려 영상이 메뉴 뒤까지 깔리게 함.
 */
:is(body.hero-video-page, body.content-subpage) header.hero-header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
}

body.hero-video-page .hero-viewport {
  min-height: 100dvh;
}

body.hero-video-page .hero-viewport-content {
  min-height: 100dvh;
}

.hero-mode-layout {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.hero-mode-main {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.hero-viewport {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  min-height: calc(100dvh - var(--site-header-h));
  overflow: hidden;
  background: #0b1220;
}

.hero-video-root-inner {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

/* 좌우 끝까지 꽉 채움(뷰포트 비율에 맞춰 상하 일부 크롭) */
.hero-video-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero-video-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(5, 12, 24, 0.55) 0%,
    rgba(5, 12, 24, 0.35) 40%,
    rgba(5, 12, 24, 0.65) 100%
  );
  pointer-events: none;
}

.hero-video-scrim.hero-scrim-light {
  background: linear-gradient(
    to bottom,
    rgba(5, 12, 24, 0.22) 0%,
    rgba(5, 12, 24, 0.12) 45%,
    rgba(5, 12, 24, 0.35) 100%
  );
}

.hero-viewport-content {
  min-height: calc(100dvh - var(--site-header-h));
}

/*
 * 메인 타이틀: HD 마린솔루션형 — 뷰포트 안에서 세로 중앙(고정 네비 높이만큼 위 패딩으로 겹침 방지).
 */
.hero-viewport-content--title-raised {
  justify-content: center;
  padding-bottom: 2rem;
}

body.hero-video-page .hero-viewport-content.hero-viewport-content--title-raised {
  box-sizing: border-box;
  min-height: 100dvh;
  padding-top: var(--site-header-h);
  justify-content: center;
}

body.hero-video-page .hero-viewport-content--title-raised .hero-copy {
  transform: translateY(calc(-1 * var(--hero-title-lift, 5vh)));
}

/* 메인 타이틀: 일정 시간 후 옆으로 슬라이드 아웃, 호버·영상 전환 시 재등장 */
body.hero-video-page .hero-copy[data-hero-main-copy] {
  --hero-main-copy-x: 0%;
  --hero-main-copy-opacity: 1;
  transform: translateY(calc(-1 * var(--hero-title-lift, 5vh))) translateX(var(--hero-main-copy-x));
  opacity: var(--hero-main-copy-opacity);
  transition:
    transform 0.72s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.52s ease;
  will-change: transform, opacity;
}

body.hero-video-page .hero-copy[data-hero-main-copy].hero-main-copy--hidden {
  --hero-main-copy-x: -118%;
  --hero-main-copy-opacity: 0;
  pointer-events: none;
}

body.hero-video-page .hero-copy[data-hero-main-copy].text-end.hero-main-copy--hidden {
  --hero-main-copy-x: 118%;
}

body.hero-video-page .hero-copy[data-hero-main-copy].text-center.hero-main-copy--hidden {
  --hero-main-copy-x: -105%;
}

@media (prefers-reduced-motion: reduce) {
  body.hero-video-page .hero-copy[data-hero-main-copy] {
    transition: none;
  }
}

/* 영상 구간 소개 라벨 — 회사 정체성 메인 타이틀 위, 뷰포트 중앙 상단 */
body.hero-video-page .hero-viewport-content--title-raised {
  position: relative;
}

.hero-segment-kicker {
  position: absolute;
  top: calc(var(--site-header-h) + clamp(0.85rem, 2.8vh, 1.85rem));
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  margin: 0;
  padding: 0.42rem 1.15rem;
  max-width: min(92vw, 40rem);
  font-size: clamp(0.72rem, 1.45vw, 0.98rem);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.94);
  text-align: center;
  white-space: normal;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  background: rgba(6, 16, 30, 0.36);
  backdrop-filter: blur(6px);
  opacity: 1;
  transition: opacity 0.28s ease, transform 0.28s ease;
}

.hero-segment-kicker.is-changing {
  animation: hero-segment-kicker-in 0.38s ease;
}

@keyframes hero-segment-kicker-in {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(-0.35rem);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

@media (max-width: 575.98px) {
  .hero-segment-kicker {
    max-width: calc(100vw - 2rem);
  }
}

/* 메인 히어로: 구간 탭 + 진행 바(진행률은 하늘색 계열, 트랙은 잔여/대기 톤) */
.hero-video-segments {
  --hero-seg-track: rgba(120, 198, 255, 0.14);
  --hero-seg-track-active: rgba(130, 210, 255, 0.26);
  --hero-seg-fill: linear-gradient(90deg, #4aaee0 0%, #6ec8ff 45%, #9ee5ff 100%);
  --hero-seg-fill-glow: 0 0 10px rgba(120, 210, 255, 0.35);

  position: absolute;
  left: 50%;
  bottom: clamp(5rem, 11.5vh, 6.75rem);
  transform: translateX(-50%);
  z-index: 2;
  display: flex;
  width: min(98vw, 48rem);
  gap: 0.15rem 0.35rem;
  justify-content: center;
  align-items: flex-end;
  padding: 0 0.2rem;
  pointer-events: auto;
}

.hero-video-segment {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  border: none;
  background: transparent;
  padding: 0.12rem 0.2rem 0;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.4);
  font-size: clamp(0.58rem, 1.35vw, 0.78rem);
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: none;
  transition: color 0.22s ease, opacity 0.22s ease;
}

.hero-video-segment.is-active {
  color: #fff;
  font-weight: 700;
}

.hero-video-segment:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 3px;
  border-radius: 2px;
}

.hero-video-segment__label {
  display: block;
  line-height: 1.2;
  margin-bottom: 0.42rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hero-video-segment__track {
  display: block;
  height: 3px;
  border-radius: 2px;
  background: var(--hero-seg-track);
  overflow: hidden;
  width: 100%;
}

.hero-video-segment.is-active .hero-video-segment__track {
  background: var(--hero-seg-track-active);
}

.hero-video-segment__fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: var(--hero-seg-fill);
  box-shadow: var(--hero-seg-fill-glow);
  will-change: width;
}

/* 구간 바가 있을 때 원형 컨트롤을 조금 위로(겹침 방지) */
.hero-viewport:has(.hero-video-segments) .hero-video-controls {
  bottom: clamp(1.35rem, 4.2vh, 2.85rem);
}

/* 메인 히어로 배경 영상: HD현대마린솔루션 메인형 이전·다음(원형) + 재생/일시정지(원 없음) */
.hero-video-controls {
  position: absolute;
  left: 50%;
  bottom: clamp(1.25rem, 4vh, 2.75rem);
  transform: translateX(-50%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
}

.hero-video-ctrl {
  margin: 0;
  padding: 0;
  cursor: pointer;
  color: #fff;
  line-height: 0;
  transition: border-color 0.15s ease, opacity 0.15s ease;
}

.hero-video-ctrl--circle {
  box-sizing: border-box;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.78);
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.hero-video-ctrl--circle:hover,
.hero-video-ctrl--circle:focus-visible {
  border-color: #fff;
  border-width: 2px;
}

.hero-video-ctrl:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 3px;
}

.hero-video-ctrl--play {
  box-sizing: border-box;
  border: none;
  background: transparent;
  width: 2.5rem;
  height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-inline-start: 0.2rem;
}

.hero-video-ctrl__icon {
  display: block;
  opacity: 0.94;
}

.hero-video-ctrl--play .hero-video-ctrl__icon {
  opacity: 0.98;
}

.hero-video-ctrl:disabled {
  cursor: not-allowed;
  opacity: 0.34;
}

.hero-video-ctrl--circle:disabled {
  border-color: rgba(255, 255, 255, 0.28);
}

.hero-video-ctrl--circle:disabled:hover,
.hero-video-ctrl--circle:disabled:focus-visible {
  border-width: 1px;
  border-color: rgba(255, 255, 255, 0.28);
}

.home-below-fold {
  flex: 0 0 auto;
}

/* ----- 메인 하단: 본사·단지 조감(좌우 분할 배경, 푸터와 자연스럽게 이어짐) ----- */
.home-bottom-visuals {
  flex: 0 0 auto;
  width: 100%;
  overflow: hidden;
  background: #0b1220;
}

.home-bottom-visuals__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* 좌측 로고 클러스터가 잘리지 않도록 세로 여유 확보 */
  min-height: clamp(17rem, 34vh, 30rem);
}

.home-bottom-visuals__pane {
  position: relative;
  min-height: clamp(17rem, 34vh, 30rem);
  background-color: #0b1220;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* 좌측: 사옥 모서리·세로 로고 스택 — 좌상단 앵커 + 행 높이로 전체가 들어오게 */
.home-bottom-visuals__pane--building {
  background-image: url("/images/home-bottom-bg-building.png");
  background-position: left top;
  min-height: clamp(19rem, 38vh, 32rem);
}

.home-bottom-visuals__pane--campus {
  background-image: url("/images/home-bottom-bg-campus.png");
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.06);
}

/* 살짝 어둡게: 푸터(#343434)로 이어질 때 대비·톤 정리 */
.home-bottom-visuals__pane::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(8, 12, 20, 0.12) 0%,
    transparent 42%,
    rgba(11, 18, 32, 0.38) 100%
  );
}

@media (max-width: 767.98px) {
  .home-bottom-visuals__grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .home-bottom-visuals__pane {
    min-height: clamp(12rem, 36vh, 20rem);
  }

  .home-bottom-visuals__pane--building {
    min-height: clamp(15rem, 42vh, 24rem);
    background-position: left top;
  }

  .home-bottom-visuals__pane--campus {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  }
}

/* ----- 메인 하단 고정 블록: HD현대마린솔루션 메인(https://www.hd-marinesolution.com/kr/main) 계열 레이아웃 ----- */
.home-marine {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  background: #fff;
  color: #111;
  /* 플로팅 바로가기(하단 고정)에 가리지 않도록 여백 */
  padding-bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
}

.home-marine-container {
  max-width: min(1580px, 100%);
  margin-left: auto;
  margin-right: auto;
}

.home-marine-section-title {
  font-size: clamp(1.78rem, 2.95vw, 2.28rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  margin: 0 0 1.5rem;
  color: #111;
}

.home-marine-section-title--light {
  color: #fff;
}

.home-marine-section-title--primary {
  font-size: clamp(2.05rem, 3.45vw, 2.85rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin: 0 0 1.25rem;
  color: #111;
}

.home-marine-section-lead {
  font-size: clamp(1.02rem, 1.22vw, 1.14rem);
  line-height: 1.55;
  color: #5c6570;
  margin: 0;
}

/* HD 메인 scroll-motion2 계열: 뷰포트 진입 시 타이틀·리드 상승 + 페이드 */
[data-home-marine-motion] {
  opacity: 0;
  transform: translate3d(0, 2.25rem, 0);
  transition:
    opacity 1s ease,
    transform 1s ease;
  transition-delay: var(--home-marine-motion-delay, 0s);
  will-change: opacity, transform;
}

[data-home-marine-motion].is-motion-in {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.home-marine-motion--delay-0 {
  --home-marine-motion-delay: 0s;
}

.home-marine-motion--delay-1 {
  --home-marine-motion-delay: 0.08s;
}

.home-marine-motion--delay-2 {
  --home-marine-motion-delay: 0.16s;
}

.home-marine-business {
  position: relative;
  background: #fff;
  /* 히어로 아래 첫 섹션을 거의 한 화면 높이로 */
  min-height: min(96dvh, calc(100dvh - 3.25rem));
  min-height: min(96vh, calc(100vh - 3.25rem));
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.home-marine-business::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("/images/rt-bg-pattern.png") repeat center top;
  opacity: 0.055;
  pointer-events: none;
}

.home-marine-business__inner {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.home-marine-section-title--business {
  flex-shrink: 0;
  font-size: clamp(2.35rem, 5.2vw, 3.75rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.home-marine-biz-row {
  --home-marine-biz-radius: clamp(1.35rem, 2.2vw, 1.65rem);
  --home-marine-biz-gap: clamp(0.55rem, 1vw, 0.85rem);
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--home-marine-biz-gap);
  min-height: min(78dvh, calc(100dvh - 13rem));
  min-height: min(78vh, calc(100vh - 13rem));
}

/*
 * 데스크톱: 4개의 고정 그리드 슬롯(열 중심 불변). 카드만 슬롯 너비 대비 %로 좌우 대칭 확대·축소.
 * 포인터 판정은 site.js에서 슬롯 getBoundingClientRect 기준(카드 폭과 무관).
 */
@media (min-width: 992px) {
  .home-marine-biz-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: visible;
    align-items: stretch;
  }

  .home-marine-biz-slot {
    min-width: 0;
    display: flex;
    justify-content: center;
    align-items: stretch;
    position: relative;
    z-index: 1;
  }

  .home-marine-biz-row:has(.home-marine-biz-card.is-biz-expanded)
    .home-marine-biz-slot:has(.home-marine-biz-card.is-biz-expanded) {
    z-index: 4;
  }
}

/* BUSINESS 카드: 슬롯 안에서 폭만 전환(열 레이아웃은 그리드가 고정) */
.home-marine-biz-card {
  position: relative;
  min-width: 0;
  border-radius: var(--home-marine-biz-radius);
  overflow: hidden;
  color: #fff;
  isolation: isolate;
  box-shadow: 0 0.45rem 1.85rem rgba(0, 0, 0, 0.14);
}

@media (min-width: 992px) {
  .home-marine-biz-card {
    flex: none;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    transition:
      width 1s cubic-bezier(0.22, 1, 0.36, 1),
      max-width 1s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.35s ease,
      filter 0.35s ease;
  }

  @supports selector(:has(*)) {
    .home-marine-biz-row:has(.home-marine-biz-card.is-biz-expanded)
      .home-marine-biz-slot:not(:has(.home-marine-biz-card.is-biz-expanded))
      .home-marine-biz-card {
      width: 86%;
      max-width: 86%;
      filter: brightness(0.94);
    }

    .home-marine-biz-slot .home-marine-biz-card.is-biz-expanded {
      width: 138%;
      max-width: none;
      box-shadow: 0 0.85rem 2.75rem rgba(0, 0, 0, 0.22);
      filter: none;
    }
  }
}

.home-marine-biz-card__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-color: #0b1220;
  background-size: cover;
  background-position: center;
  transform: scale(1.03);
  transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-marine-biz-card.is-biz-expanded .home-marine-biz-card__media {
  transform: scale(1.045);
}

@media (min-width: 992px) {
  /* 확장 시: 섹션 타이틀(.home-marine-section-title--business)에 맞춘 굵은 대형 타이포 */
  .home-marine-biz-card.is-biz-expanded .home-marine-biz-card__label {
    font-size: clamp(1.55rem, 3.6vw + 0.65rem, 2.75rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.08;
  }
}

.home-marine-biz-card__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(4, 8, 14, 0.12) 0%,
    rgba(4, 8, 14, 0.28) 42%,
    rgba(4, 8, 14, 0.62) 100%
  );
  transition: opacity 0.35s ease;
}

.home-marine-biz-card__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 100%;
  padding: 1.75rem 0.85rem 3.25rem;
  text-align: center;
}

.home-marine-biz-card__label {
  margin: 0;
  font-size: clamp(0.82rem, 0.65vw + 0.55rem, 1.15rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.3;
  text-shadow: 0 2px 28px rgba(0, 0, 0, 0.55);
  transition:
    font-size 0.55s cubic-bezier(0.22, 1, 0.36, 1),
    letter-spacing 0.45s ease,
    line-height 0.45s ease;
  max-width: 11.5rem;
}

/* 한 줄 타이틀: 확대 중 max-width 제약으로 줄바꿈되지 않도록 */
.home-marine-biz-card--serviceafter .home-marine-biz-card__label {
  white-space: nowrap;
  max-width: none;
}

@media (min-width: 992px) {
  .home-marine-biz-card.is-biz-expanded .home-marine-biz-card__label {
    max-width: min(95%, 26rem);
  }

  .home-marine-biz-card--serviceafter.is-biz-expanded .home-marine-biz-card__label {
    max-width: none;
  }
}

@supports selector(:has(*)) {
  .home-marine-biz-row:has(.home-marine-biz-card.is-biz-expanded)
    .home-marine-biz-card:not(.is-biz-expanded)
    .home-marine-biz-card__label {
    font-size: clamp(0.82rem, 0.9vw + 0.45rem, 1.05rem);
  }
}

.home-marine-biz-card__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
  margin-top: 1.1rem;
  max-width: 100%;
  padding: 0 0.25rem;
  opacity: 0;
  transform: translateY(0.65rem);
  pointer-events: none;
  transition:
    opacity 0.35s ease,
    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.home-marine-biz-card__actions--dense {
  gap: 0.35rem;
  margin-top: 0.85rem;
}

.home-marine-biz-card.is-biz-expanded .home-marine-biz-card__actions,
.home-marine-biz-card:focus-within .home-marine-biz-card__actions {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.home-marine-biz-card__btn {
  display: inline-block;
  padding: 0.38rem 0.75rem;
  border-radius: 999px;
  font-size: clamp(0.65rem, 0.45vw + 0.52rem, 0.78rem);
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  background: rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.28);
  backdrop-filter: blur(8px);
  white-space: normal;
  text-align: center;
  max-width: 100%;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}

.home-marine-biz-card__btn:hover {
  color: #fff;
  background: rgba(0, 64, 128, 0.72);
  border-color: rgba(255, 255, 255, 0.45);
}

.home-marine-biz-card__btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* 마린 메인 하단: 탑 메뉴와 동일한 링크만 — 좁은 캡슐 + 위로 펼쳐지는 썸네일 목록 */
.home-marine-float-nav {
  position: fixed;
  left: 50%;
  bottom: max(1rem, env(safe-area-inset-bottom, 0px));
  z-index: 1040;
  transform: translateX(-50%);
  width: fit-content;
  max-width: min(17.25rem, calc(100vw - 1.5rem));
  pointer-events: none;
}

.home-marine-float-nav__box {
  display: flex;
  flex-direction: column-reverse;
  align-items: stretch;
  gap: 0.45rem;
  width: 100%;
  pointer-events: auto;
}

.home-marine-float-nav__shell {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.5rem;
  border-radius: 999px;
  background: #181818;
  box-shadow:
    0 0.25rem 0.75rem rgba(0, 0, 0, 0.2),
    0 0.65rem 1.75rem rgba(0, 0, 0, 0.14);
}

.home-marine-float-nav__toggle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.5rem;
  margin: 0;
  padding: 0.5rem 2.35rem 0.5rem 2.65rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  color-scheme: dark;
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
  text-align: center;
  cursor: pointer;
  transition:
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.home-marine-float-nav__toggle:hover {
  background: rgba(255, 255, 255, 0.06);
}

.home-marine-float-nav__toggle:focus {
  outline: none;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.12);
}

.home-marine-float-nav__toggle:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 3px;
}

.home-marine-float-nav__label {
  display: block;
  flex: 1 1 auto;
  padding: 0 0.2rem;
  white-space: nowrap;
}

.home-marine-float-nav__thumb {
  position: absolute;
  left: 0.35rem;
  top: 50%;
  z-index: 1;
  width: 1.875rem;
  height: 1.875rem;
  margin-top: -0.9375rem;
  border-radius: 50%;
  background-color: #0d3d4a;
  background-image: url("/images/rt-pack-product-01.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border: 2px solid rgba(255, 255, 255, 0.28);
  box-shadow:
    0 0 0 1px rgba(100, 190, 255, 0.45),
    inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  pointer-events: none;
}

.home-marine-float-nav__chev {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  z-index: 1;
  margin-top: -4px;
  color: #fff;
  opacity: 0.95;
  line-height: 0;
  pointer-events: none;
  transition: transform 0.28s ease;
}

.home-marine-float-nav.is-open .home-marine-float-nav__chev {
  transform: rotate(180deg);
}

.home-marine-float-nav__panel {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.35rem);
  border-radius: 1.35rem;
  background: rgba(22, 22, 24, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow:
    0 0.5rem 1.5rem rgba(0, 0, 0, 0.28),
    0 1.25rem 2.75rem rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  pointer-events: none;
  transition:
    max-height 0.32s ease,
    opacity 0.26s ease,
    transform 0.28s ease,
    visibility 0.32s;
}

.home-marine-float-nav.is-open .home-marine-float-nav__panel {
  max-height: min(56vh, 22rem);
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.home-marine-float-nav__list {
  margin: 0;
  padding: 0.45rem 0.35rem 0.25rem;
  list-style: none;
  max-height: min(48vh, 19rem);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.35) transparent;
}

.home-marine-float-nav__list > li {
  margin: 0;
  padding: 0;
}

.home-marine-float-nav__item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 0.65rem;
  margin: 0.08rem 0;
  padding: 0.45rem 0.5rem;
  border: none;
  border-radius: 0.75rem;
  background: transparent;
  color: #fff;
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-align: start;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.18s ease;
}

.home-marine-float-nav__item:visited {
  color: #fff;
}

.home-marine-float-nav__item--accent.is-section-active:visited .home-marine-float-nav__item-label,
.home-marine-float-nav__item.is-section-active:visited .home-marine-float-nav__item-label {
  color: #c8ff50;
}

.home-marine-float-nav__item:hover {
  background: rgba(255, 255, 255, 0.07);
}

.home-marine-float-nav__item.is-section-active:hover {
  background: rgba(200, 255, 80, 0.16);
}

.home-marine-float-nav__item:focus {
  outline: none;
}

.home-marine-float-nav__item:focus-visible {
  outline: 2px solid rgba(200, 255, 80, 0.85);
  outline-offset: 1px;
}

.home-marine-float-nav__item-thumb {
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: #1a2a38;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border: 2px solid rgba(255, 255, 255, 0.22);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.35);
}

.home-marine-float-nav__item-thumb--business,
.home-marine-float-nav__thumb.home-marine-float-nav__thumb--sync-business {
  background-image: url("/images/home-marine-biz-shipbuilding.png");
  background-position: center 46%;
}

.home-marine-float-nav__item-thumb--global,
.home-marine-float-nav__thumb.home-marine-float-nav__thumb--sync-global {
  background-image: url("/images/hm-hms-global-01.jpg");
}

.home-marine-float-nav__item-thumb--media,
.home-marine-float-nav__thumb.home-marine-float-nav__thumb--sync-media {
  background-image: url("/images/home-marine-media-hero.jpg");
}

.home-marine-float-nav__item-thumb--invest,
.home-marine-float-nav__thumb.home-marine-float-nav__thumb--sync-invest {
  background-image: url("/images/home-marine-invest-financial-bg.png");
}

.home-marine-float-nav__item-thumb--contact,
.home-marine-float-nav__thumb.home-marine-float-nav__thumb--sync-contact {
  background-image: url("/images/rt-pack-product-01.png");
  background-color: #0d3d4a;
}

.home-marine-float-nav__item.is-section-active {
  background: rgba(200, 255, 80, 0.12);
}

.home-marine-float-nav__toggle .home-marine-float-nav__label {
  color: #c8ff50;
  font-weight: 600;
}

.home-marine-float-nav__item-label {
  flex: 1 1 auto;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.98);
}

.home-marine-float-nav__item.is-section-active .home-marine-float-nav__item-label {
  color: #c8ff50;
  font-weight: 600;
}

.home-marine-float-nav__panel-foot {
  display: flex;
  justify-content: flex-end;
  padding: 0.15rem 0.55rem 0.55rem;
}

.home-marine-float-nav__collapse {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  transition:
    background 0.18s ease,
    transform 0.18s ease;
}

.home-marine-float-nav__collapse:hover {
  background: rgba(255, 255, 255, 0.12);
}

.home-marine-float-nav__collapse:focus-visible {
  outline: 2px solid #c8ff50;
  outline-offset: 2px;
}

#home-marine-section-business,
#home-marine-section-glance,
#home-marine-section-history,
#home-marine-section-global,
#home-marine-section-media,
#home-marine-section-invest,
#home-marine-section-contact,
#home-marine-section-newsletter {
  scroll-margin-top: 4.75rem;
}

.home-marine-biz-card--shipbuilding .home-marine-biz-card__media {
  background-image: url("/images/home-marine-biz-shipbuilding.png");
  background-position: center 46%;
}

.home-marine-biz-card--landdivision .home-marine-biz-card__media {
  background-image: url("/images/home-marine-biz-landdivision.png");
  background-position: center 44%;
}

.home-marine-biz-card--serviceafter .home-marine-biz-card__media {
  background-image: url("/images/home-marine-biz-service.png");
  background-position: center 48%;
}

.home-marine-biz-card--futuredefense .home-marine-biz-card__media {
  background-image: url("/images/home-marine-biz-futuredefense.png");
  background-position: center 40%;
}

/* :has 미지원: 확대 카드만 폭 힌트(나머지 슬롯 동기 축소는 생략) */
@supports not selector(:has(*)) {
  @media (min-width: 992px) {
    .home-marine-biz-slot .home-marine-biz-card.is-biz-expanded {
      width: 138%;
      max-width: none;
    }
  }
}

/* 호버 불가(대부분 터치): 가로 4열이어도 하위 버튼 항상 노출 */
@media (hover: none) and (pointer: coarse) and (min-width: 992px) {
  .home-marine-biz-card__actions {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
}

.home-marine-glance {
  position: relative;
  color: #111;
  background: #fff;
  overflow: hidden;
}

.home-marine-glance::before,
.home-marine-glance::after {
  display: none;
}

.home-marine-glance__inner {
  position: relative;
  z-index: 1;
  text-align: center;
}

.home-marine-glance-eyebrow {
  margin: 0 0 clamp(0.65rem, 1.2vw, 0.85rem);
  font-size: clamp(0.875rem, 1.05vw, 1rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.02em;
  color: #000;
}

.home-marine-glance-headline {
  margin: 0 auto clamp(2.25rem, 4.5vw, 3.5rem);
  max-width: 38rem;
  font-size: clamp(1.75rem, 3.6vw, 2.5rem);
  font-weight: 800;
  line-height: 1.28;
  letter-spacing: -0.035em;
  color: #000;
}

/* 한국어: 음절 단위 줄바꿈으로 마지막 한 글자만 내려가는 현상 방지 — 문장 단위(스팬)마다 한 줄 */
.home-marine-glance-headline--kr {
  max-width: min(48rem, 100%);
}

.home-marine-glance-headline--kr .home-marine-glance-headline__line {
  white-space: nowrap;
}

.home-marine-glance-headline__line {
  display: block;
}

.home-marine-glance-headline__line + .home-marine-glance-headline__line {
  margin-top: 0.14em;
}

.home-marine-glance-stats {
  max-width: min(1200px, 100%);
  margin-left: auto;
  margin-right: auto;
}

.home-marine-glance .home-marine-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  min-height: 100%;
}

.home-marine-glance .home-marine-stat-label {
  margin: 0 0 clamp(0.45rem, 1vw, 0.65rem);
  font-size: clamp(0.95rem, 1.15vw, 1rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: #000;
}

.home-marine-glance .home-marine-stat-num {
  margin: 0;
  font-size: clamp(3rem, 7.5vw, 5rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: #000;
  font-variant-numeric: tabular-nums;
}

.home-marine-glance .home-marine-stat-unit {
  margin: clamp(0.4rem, 1vw, 0.55rem) 0 0;
  font-size: clamp(0.625rem, 0.8vw, 0.75rem);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #000;
  opacity: 0.88;
}

.home-marine-glance a.home-marine-stat--ffsb {
  color: inherit;
  cursor: pointer;
  border-radius: 0.2rem;
  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}

.home-marine-glance a.home-marine-stat--ffsb:hover {
  color: #004080;
  background-color: rgba(0, 64, 128, 0.04);
}

.home-marine-glance a.home-marine-stat--ffsb:focus-visible {
  outline: 2px solid #004080;
  outline-offset: 3px;
}

.home-marine-glance a.home-marine-stat--ffsb .home-marine-stat-unit {
  text-transform: none;
  letter-spacing: 0.08em;
}

/* ----- 메인·서브 회사 연혁: 중앙 세로축 + 좌우 교차 가지(HD 계열 타임라인) ----- */
.home-marine-history {
  position: relative;
  background: #fff;
  overflow: hidden;
}

.home-marine-history__header {
  border-bottom: 1px solid #e4e9ef;
  padding-bottom: clamp(1rem, 2vw, 1.35rem);
}

.home-marine-history__eyebrow {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6b7582;
}

.home-marine-history__lead {
  max-width: 40rem;
}

.home-marine-history__more {
  flex-shrink: 0;
  font-weight: 700;
  font-size: 0.9rem;
  color: #004080;
  text-decoration: none;
  border-bottom: 2px solid rgba(0, 64, 128, 0.35);
  padding-bottom: 0.12rem;
  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.home-marine-history__more:hover {
  color: #003066;
  border-bottom-color: rgba(0, 48, 102, 0.55);
}

.home-marine-history__timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.home-marine-history__timeline--branch {
  position: relative;
  padding: clamp(1.5rem, 3vw, 2.25rem) 0 clamp(2rem, 4vw, 3rem);
  margin-top: 0;
}

.home-marine-history__timeline--branch::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  background: #e0e4e8;
  z-index: 0;
}

.home-marine-history__timeline--branch::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -2px);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c5ccd4;
  z-index: 1;
}

.home-marine-history-node {
  position: relative;
  padding: clamp(1.15rem, 2.5vw, 1.85rem) 0;
  z-index: 1;
}

.home-marine-history-node__dot {
  position: absolute;
  left: 50%;
  top: clamp(1.05rem, 2vw, 1.35rem);
  z-index: 2;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  border-radius: 50%;
  background: linear-gradient(180deg, #0a7ac8 0%, #005a9c 100%);
  box-shadow:
    0 0 0 5px rgba(0, 90, 156, 0.12),
    0 1px 2px rgba(15, 20, 25, 0.12);
}

.home-marine-history-node--right::after {
  content: "";
  position: absolute;
  top: calc(clamp(1.05rem, 2vw, 1.35rem) + 6px);
  left: calc(50% + 7px);
  width: min(5.5rem, 16vw);
  height: 2px;
  background: #e0e4e8;
  z-index: 1;
}

.home-marine-history-node--left::before {
  content: "";
  position: absolute;
  top: calc(clamp(1.05rem, 2vw, 1.35rem) + 6px);
  right: calc(50% + 7px);
  width: min(5.5rem, 16vw);
  height: 2px;
  background: #e0e4e8;
  z-index: 1;
}

.home-marine-history-node__body {
  position: relative;
  z-index: 2;
  max-width: calc(50% - 2.25rem);
}

.home-marine-history-node--right .home-marine-history-node__body {
  margin-left: calc(50% + 2.25rem);
  text-align: left;
}

.home-marine-history-node--left .home-marine-history-node__body {
  margin-right: calc(50% + 2.25rem);
  margin-left: 0;
  text-align: right;
}

.home-marine-history-node__year {
  margin: 0 0 0.4rem;
  font-size: clamp(1.65rem, 3.2vw, 2.45rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: #005a9c;
}

.home-marine-history-node__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-marine-history-node__list li {
  margin-bottom: 0.45rem;
  font-size: clamp(0.9rem, 1.1vw, 1.02rem);
  line-height: 1.55;
  color: #333;
}

.home-marine-history-node__list li:last-child {
  margin-bottom: 0;
}

@media (max-width: 767.98px) {
  .home-marine-history__timeline--branch::before {
    left: 18px;
    transform: none;
  }

  .home-marine-history__timeline--branch::after {
    left: 18px;
    transform: translateX(-50%);
  }

  .home-marine-history-node__dot {
    left: 18px;
    margin-left: 0;
    transform: translateX(-50%);
  }

  .home-marine-history-node--right::after {
    left: 26px;
    right: auto;
    width: min(2.25rem, 12vw);
  }

  .home-marine-history-node--left::before {
    display: none;
  }

  .home-marine-history-node--left::after {
    content: "";
    position: absolute;
    top: calc(clamp(1.05rem, 2vw, 1.35rem) + 6px);
    left: 26px;
    width: min(2.25rem, 12vw);
    height: 2px;
    background: #e0e4e8;
    z-index: 1;
  }

  .home-marine-history-node--left .home-marine-history-node__body,
  .home-marine-history-node--right .home-marine-history-node__body {
    margin-left: 3.15rem;
    margin-right: 0;
    max-width: none;
    text-align: left;
  }
}

/* 서브페이지 «회사 연혁»: 메인과 동일 중앙축·좌우 교차 타임라인 */
body.content-subpage .content-subpage-main--marine-history {
  max-width: min(920px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

body.content-subpage .home-marine-history--page {
  background: transparent;
}

body.content-subpage .content-page-body--history-marine {
  max-width: 100%;
}

/* ----- Danfoss Agency: Sensing(sub13) + Drives(sub12) ----- */
body.content-subpage .content-subpage-main--danfoss-agency {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.danfoss-agency__head {
  margin-bottom: 1.25rem;
}

.danfoss-agency__title {
  margin: 0 0 0.5rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
}

.danfoss-agency__lead {
  font-size: 0.95rem;
  color: #5c6775;
  line-height: 1.55;
}

.danfoss-agency__tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #e4e9ef;
}

.danfoss-agency__tab {
  margin: 0 0 -1px;
  padding: 0.65rem 1.1rem;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 600;
  color: #5c6775;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 0.35rem 0.35rem 0 0;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
}

.danfoss-agency__tab:hover {
  color: #0f1419;
}

.danfoss-agency__foot {
  margin-top: 1.5rem;
  line-height: 1.55;
}

/* Agency 파트너 탭은 PageNavRail 4레벨 — 제품 카드만 독립 스크롤(벤더 간 레이아웃 통일) */
:is(.danfoss-agency-layout, .yokogawa-agency-layout, .skarpenord-agency-layout, .agency-partner-catalog-layout) {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

:is(.danfoss-agency-layout, .yokogawa-agency-layout, .skarpenord-agency-layout) :is(.danfoss-agency__head, .yokogawa-agency__head, .skarpenord-agency__head) {
  flex-shrink: 0;
  margin-bottom: 1rem;
}

:is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll, .agency-partner-catalog__scroll) {
  flex: 1 1 auto;
  min-height: min(28rem, 52vh);
  max-height: min(
    72vh,
    calc(100dvh - var(--site-header-h) - var(--page-nav-rail-h, 2.75rem) - 8.5rem)
  );
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-inline: clamp(0.65rem, 1.6vw, 1.05rem);
  padding-block: 0.55rem 0.25rem;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

:is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll, .agency-partner-catalog__scroll)
  .shipbuilding-line__grid {
  padding-inline: 0.15rem;
}

:is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll, .agency-partner-catalog__scroll)
  .shipbuilding-line__card {
  padding: 0.25rem;
  box-sizing: border-box;
}

.danfoss-agency__scroll {
  scrollbar-color: rgba(226, 0, 15, 0.35) transparent;
}

.yokogawa-agency__scroll {
  scrollbar-color: rgba(255, 209, 0, 0.45) transparent;
}

.skarpenord-agency__scroll {
  scrollbar-color: rgba(0, 162, 164, 0.4) transparent;
}

.agency-partner-catalog__scroll {
  scrollbar-color: rgba(0, 38, 62, 0.28) transparent;
}

:is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll, .agency-partner-catalog__scroll)
  :is(.danfoss-agency, .yokogawa-agency, .skarpenord-agency, .agency-partner-catalog__inner).content-page-body {
  padding-top: 0;
}

.agency-partner-catalog__inner {
  min-height: min(36rem, 58vh);
  box-sizing: border-box;
}

:is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll)
  :is(.danfoss-agency, .yokogawa-agency, .skarpenord-agency).content-page-body {
  min-height: min(36rem, 58vh);
  box-sizing: border-box;
}

.agency-partner-catalog__foot {
  line-height: 1.55;
}

body.content-subpage .content-subpage-main--agency-partner-catalog {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

@media (max-width: 767.98px) {
  :is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll, .agency-partner-catalog__scroll) {
    min-height: min(24rem, 46vh);
    max-height: min(
      68vh,
      calc(100dvh - var(--site-header-h) - var(--page-nav-rail-h, 2.75rem) - 9.5rem)
    );
  }

  .agency-partner-catalog__inner,
  :is(.danfoss-agency__scroll, .yokogawa-agency__scroll, .skarpenord-agency__scroll)
    :is(.danfoss-agency, .yokogawa-agency, .skarpenord-agency).content-page-body {
    min-height: min(30rem, 52vh);
  }
}

/* ----- YOKOGAWA: 카테고리별 제품군(Agency 탭과 분리) ----- */
body.content-subpage .content-subpage-main--yokogawa-agency {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.yokogawa-agency__head {
  margin-bottom: 1.25rem;
}

.yokogawa-agency__brand {
  margin-bottom: 0.85rem;
}

.yokogawa-agency__brand img {
  display: block;
  width: auto;
  max-width: min(140px, 40vw);
  height: auto;
}

.yokogawa-agency__kicker {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5c6775;
}

.yokogawa-agency__title {
  margin: 0 0 0.5rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--yokogawa-text, #111);
}

.yokogawa-agency__lead {
  font-size: 0.95rem;
  color: #5c6775;
  line-height: 1.55;
}

.yokogawa-agency__foot {
  margin-top: 1.5rem;
  line-height: 1.55;
}

/* YOKOGAWA 브랜드 테마: 노란 배경 + 검은 글자 (Danfoss 레드와 동일한 적용 범위) */
body.content-subpage--yokogawa {
  --yokogawa-yellow: #ffd100;
  --yokogawa-yellow-hover: #f5c400;
  --yokogawa-yellow-border: #e6bc00;
  --yokogawa-text: #111;
}

.company-overview-tabs--yokogawa .company-overview-tabs__item--active {
  color: var(--yokogawa-text, #111);
  border-color: var(--yokogawa-yellow-border, #e6bc00);
  background-color: var(--yokogawa-yellow, #ffd100);
}

.company-overview-tabs--yokogawa-pressure .company-overview-tabs__item--active {
  color: var(--yokogawa-text, #111);
  border-color: var(--yokogawa-yellow-border, #e6bc00);
  background-color: var(--yokogawa-yellow, #ffd100);
}

.page-nav-rail--yokogawa .page-nav-rail__home:hover {
  background-color: rgba(255, 209, 0, 0.22);
}

.page-nav-rail--yokogawa .page-nav-rail__dropdown .dropdown-item.active {
  color: var(--yokogawa-text, #111);
  background-color: rgba(255, 209, 0, 0.2);
}

.page-nav-rail--yokogawa .page-nav-rail__tabs-row--nested {
  background-color: rgba(255, 209, 0, 0.06);
}

body.content-subpage--yokogawa .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
body.content-subpage--yokogawa .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
  border-color: var(--yokogawa-yellow-border, #e6bc00);
  box-shadow:
    0 0 0 2px var(--yokogawa-yellow, #ffd100),
    0 0.65rem 1.35rem rgba(255, 209, 0, 0.22);
}

body.content-subpage--yokogawa .shipbuilding-line__card-link:focus-visible .shipbuilding-line__card-inner,
body.content-subpage--yokogawa .shipbuilding-line__card:focus-within > .shipbuilding-line__card-inner {
  border-color: var(--yokogawa-yellow-border, #e6bc00);
  box-shadow: 0 0 0 2px var(--yokogawa-yellow, #ffd100);
}

body.content-subpage--yokogawa .shipbuilding-line__card-link:focus-visible {
  outline-color: var(--yokogawa-yellow, #ffd100);
}

/* ----- Skarpenord: Offshore · Marine · Service and spares ----- */
body.content-subpage .content-subpage-main--skarpenord-agency {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.skarpenord-agency__head {
  margin-bottom: 1.25rem;
}

.skarpenord-agency__head--hero {
  position: relative;
  margin-inline: calc(-1 * clamp(0.85rem, 2.2vw, 1.5rem));
  margin-bottom: 1.5rem;
  min-height: clamp(9rem, 28vw, 14rem);
  border-radius: 0.55rem;
  overflow: hidden;
  background-color: #004244;
  background-image: linear-gradient(
      180deg,
      rgba(0, 36, 38, 0.28) 0%,
      rgba(0, 122, 124, 0.58) 100%
    ),
    var(--skarpenord-segment-hero);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.skarpenord-agency__head--hero .skarpenord-agency__head-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: inherit;
  padding: clamp(1.1rem, 3vw, 1.75rem) clamp(1rem, 2.4vw, 1.5rem);
}

.skarpenord-agency__title-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.skarpenord-agency__title-decor {
  flex: 0 0 auto;
  width: auto;
  max-width: min(9rem, 28vw);
  height: auto;
  max-height: 2.25rem;
  opacity: 0.95;
}

.skarpenord-agency__head--hero .skarpenord-agency__title-decor {
  filter: none;
}

.skarpenord-agency__head--hero .skarpenord-agency__brand {
  margin-bottom: auto;
  padding-bottom: 0.75rem;
}

.skarpenord-agency__head--hero .skarpenord-agency__brand img {
  filter: none;
  max-width: min(11rem, 42vw);
  max-height: 2rem;
}

.skarpenord-agency__head--hero .skarpenord-agency__title {
  margin: 0;
  color: #fff;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.45);
}

.skarpenord-agency__brand {
  margin-bottom: 0.85rem;
}

.skarpenord-agency__brand img {
  display: block;
  width: auto;
  max-width: min(11rem, 42vw);
  max-height: 2rem;
  height: auto;
}

.skarpenord-agency__title {
  margin: 0 0 0.5rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-agency__lead {
  font-size: 0.95rem;
  color: #5c6775;
  line-height: 1.55;
}

.skarpenord-agency__foot {
  margin-top: 1.5rem;
  line-height: 1.55;
}

body.content-subpage--skarpenord {
  /* skarpenord.no theme — --colormain: #00a2a4 */
  --skarpenord-brand: #00a2a4;
  --skarpenord-brand-hover: #00b5b7;
  --skarpenord-brand-active: #008d8f;
  --skarpenord-brand-text: #007678;
  --skarpenord-brand-border: #009a9c;
  --skarpenord-accent: #57babe;
  --skarpenord-navy: var(--skarpenord-brand);
  --skarpenord-navy-hover: var(--skarpenord-brand-hover);
  --skarpenord-navy-border: var(--skarpenord-brand-border);
}

.company-overview-tabs--skarpenord .company-overview-tabs__item--active {
  color: #fff;
  border-color: var(--skarpenord-brand-border, #009a9c);
  background-color: var(--skarpenord-brand, #00a2a4);
}

.page-nav-rail--skarpenord .page-nav-rail__home:hover {
  background-color: rgba(0, 162, 164, 0.14);
}

.page-nav-rail--skarpenord .page-nav-rail__dropdown .dropdown-item.active {
  color: #fff;
  background-color: rgba(0, 162, 164, 0.88);
}

.page-nav-rail--skarpenord .page-nav-rail__tabs-row--nested {
  background-color: rgba(0, 162, 164, 0.06);
}

body.content-subpage--skarpenord .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
body.content-subpage--skarpenord .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
  border-color: var(--skarpenord-brand, #00a2a4);
  box-shadow:
    0 0 0 2px var(--skarpenord-brand, #00a2a4),
    0 0.65rem 1.35rem rgba(0, 162, 164, 0.22);
}

body.content-subpage--skarpenord .shipbuilding-line__card-link:focus-visible .shipbuilding-line__card-inner,
body.content-subpage--skarpenord .shipbuilding-line__card:focus-within > .shipbuilding-line__card-inner {
  border-color: var(--skarpenord-brand, #00a2a4);
  box-shadow: 0 0 0 2px var(--skarpenord-brand, #00a2a4);
}

body.content-subpage--skarpenord .shipbuilding-line__card-link:focus-visible {
  outline-color: var(--skarpenord-accent, #5eb3e4);
}

.skarpenord-segment__cards {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 162, 164, 0.14);
}

.skarpenord-segment__cards-lead {
  max-width: 42rem;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #5c6775;
}

.skarpenord-segment__cards .shipbuilding-line {
  max-width: none;
}

.skarpenord-segment {
  max-width: 42rem;
}

.skarpenord-segment__subtitle {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-segment__intro {
  margin: 0 0 0.85rem;
  font-size: 0.98rem;
  line-height: 1.65;
  color: #3d4652;
}

.skarpenord-segment__block {
  margin-top: 1.35rem;
}

.skarpenord-segment__heading {
  margin: 0 0 0.65rem;
  font-size: 0.92rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-segment__list {
  margin: 0;
  padding-left: 1.15rem;
  line-height: 1.65;
  color: #3d4652;
}

.skarpenord-segment__list li + li {
  margin-top: 0.35rem;
}

.skarpenord-segment__product-list {
  display: grid;
  gap: 0.45rem;
}

.skarpenord-segment__product-link {
  display: inline-flex;
  align-items: center;
  padding: 0.55rem 0.85rem;
  border: 1px solid rgba(0, 162, 164, 0.22);
  border-radius: 0.45rem;
  font-weight: 600;
  color: var(--skarpenord-brand-text, #007678);
  text-decoration: none;
  background: rgba(0, 162, 164, 0.06);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.skarpenord-segment__product-link:hover {
  border-color: var(--skarpenord-brand, #00a2a4);
  background: rgba(0, 162, 164, 0.1);
  box-shadow: 0 0 0 2px rgba(0, 162, 164, 0.16);
}

.skarpenord-segment__product-link:focus-visible {
  outline: 2px solid var(--skarpenord-accent, #5eb3e4);
  outline-offset: 2px;
}

.skarpenord-segment__contact {
  margin-top: 1.25rem;
  padding: 0.85rem 1rem;
  border-left: 3px solid var(--skarpenord-brand, #00a2a4);
  background: rgba(0, 162, 164, 0.06);
  font-size: 0.92rem;
  line-height: 1.6;
  color: #3d4652;
}

.skarpenord-segment__official {
  margin-top: 1.35rem;
  font-size: 0.88rem;
}

.skarpenord-segment__official a {
  font-weight: 600;
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-segment__official a:hover {
  color: var(--skarpenord-brand-hover, #00b5b7);
}

/* ----- Skarpenord PDP (skarpenord.no/products) ----- */
body.content-subpage--skarpenord .skarpenord-pdp__back-link:hover {
  color: var(--skarpenord-brand-text, #007678);
}

body.content-subpage--skarpenord .skarpenord-pdp__image-frame {
  background: rgba(0, 162, 164, 0.06);
  border-color: rgba(0, 162, 164, 0.18);
}

body.content-subpage--skarpenord .skarpenord-pdp__title {
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-pdp__tagline {
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-pdp__intro {
  font-size: 0.98rem;
  line-height: 1.65;
  color: #3d4652;
}

body.content-subpage--skarpenord .skarpenord-pdp__btn-inquiry {
  background: var(--skarpenord-brand, #00a2a4);
  border-color: var(--skarpenord-brand-border, #009a9c);
}

body.content-subpage--skarpenord .skarpenord-pdp__btn-inquiry:hover {
  background: var(--skarpenord-brand-hover, #00b5b7);
  border-color: var(--skarpenord-brand-hover, #00b5b7);
}

.skarpenord-pdp__official-link {
  display: inline-flex;
  align-items: center;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--skarpenord-brand-text, #007678);
  text-decoration: none;
}

.skarpenord-pdp__official-link:hover {
  color: var(--skarpenord-brand-hover, #00b5b7);
  text-decoration: underline;
}

.skarpenord-pdp__body {
  padding-top: 1.5rem;
}

.skarpenord-pdp__section + .skarpenord-pdp__section {
  margin-top: 1.75rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 162, 164, 0.12);
}

body.content-subpage--skarpenord .skarpenord-pdp__section-title {
  color: var(--skarpenord-brand-text, #007678);
}

.skarpenord-pdp__section-subtitle {
  margin: 0 0 0.75rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #3d4652;
}

.skarpenord-pdp__paragraph {
  margin: 0 0 0.85rem;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #3d4652;
}

body.content-subpage--skarpenord .skarpenord-pdp__features li::before {
  background: var(--skarpenord-brand, #00a2a4);
}

body.content-subpage--danfoss {
  --danfoss-red: #e2000f;
}

body.content-subpage--danfoss .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
body.content-subpage--danfoss .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
  border-color: var(--danfoss-red, #e2000f);
  box-shadow:
    0 0 0 2px var(--danfoss-red, #e2000f),
    0 0.65rem 1.35rem rgba(226, 0, 15, 0.2);
}

body.content-subpage--danfoss .shipbuilding-line__card-link:focus-visible .shipbuilding-line__card-inner,
body.content-subpage--danfoss .shipbuilding-line__card:focus-within > .shipbuilding-line__card-inner {
  border-color: var(--danfoss-red, #e2000f);
  box-shadow: 0 0 0 2px var(--danfoss-red, #e2000f);
}

body.content-subpage--danfoss .shipbuilding-line__card-link:focus-visible {
  outline-color: var(--danfoss-red, #e2000f);
}

.company-overview-tabs--yokogawa-pressure {
  padding-left: 0.25rem;
}

.company-overview-tabs--yokogawa-pressure .company-overview-tabs__item {
  font-size: 0.875rem;
}

.shipbuilding-line__series-desc {
  color: var(--bs-secondary-color);
  font-size: 0.95rem;
  line-height: 1.55;
  max-width: 52rem;
}

.company-overview-tabs--agency .company-overview-tabs__item {
  font-size: clamp(0.72rem, 1.4vw, 0.88rem);
  padding: 0.55rem 0.7rem;
  letter-spacing: -0.01em;
}

/* 사업부문(조선·해양 / 육상 / 미래기술·방산) PageNavRail 제품군 탭 — 로버스텍 네이비 */
.company-overview-tabs--business-division.company-overview-tabs--segmented .company-overview-tabs__item {
  background-color: var(--robustech-brand-tab-bg, #e4ebf5);
  color: #1e293b;
}

.company-overview-tabs--business-division.company-overview-tabs--segmented .company-overview-tabs__item:hover {
  color: var(--robustech-brand, #003087);
  background-color: var(--robustech-brand-tab-bg-hover, #d5e0f2);
}

.company-overview-tabs--business-division.company-overview-tabs--segmented .company-overview-tabs__item--active,
.company-overview-tabs--business-division.company-overview-tabs--segmented .company-overview-tabs__item--active:hover {
  color: #fff !important;
  background-color: var(--robustech-brand, #003087);
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--business-division .company-overview-tabs__item {
  font-size: 0.8125rem;
  padding: 0.45rem 0.65rem;
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--business-division .company-overview-tabs__item--active {
  color: #fff !important;
  background-color: var(--robustech-brand, #003087);
  border-color: var(--robustech-brand, #003087);
}

.page-nav-rail--business .page-nav-rail__home:hover {
  background-color: rgba(0, 48, 135, 0.08);
}

.page-nav-rail--business .page-nav-rail__dropdown .dropdown-item.active {
  color: var(--robustech-brand, #003087);
  background-color: rgba(0, 48, 135, 0.1);
}

.page-nav-rail--business .page-nav-rail__tabs-row {
  background-color: rgba(0, 48, 135, 0.04);
}

/* 사업부문 전역 — 조선·해양 / 육상 / 미래기술·방산 (카탈로그·PDP·문의) */
body.content-subpage--business-division,
body.content-subpage--robustech {
  --bd-brand: var(--robustech-brand, #003087);
  --bd-brand-hover: var(--robustech-brand-hover, #00266a);
  --bd-brand-accent: var(--robustech-brand-accent, #004282);
  --bd-surface: var(--robustech-brand-tab-bg, #e4ebf5);
  --bd-surface-strong: var(--robustech-brand-tab-bg-hover, #d5e0f2);
  --bd-border: #c5d4e8;
}

body.content-subpage--business-division .shipbuilding-line__series + .shipbuilding-line__series {
  border-top-color: var(--bd-border);
}

body.content-subpage--business-division .shipbuilding-line__series-title {
  color: var(--bd-brand);
}

body.content-subpage--business-division .shipbuilding-line__thumb--placeholder {
  background: linear-gradient(145deg, var(--bd-surface) 0%, #f4f7fb 100%);
}

@media (hover: hover) and (pointer: fine) {
  body.content-subpage--business-division .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
  body.content-subpage--business-division .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
    border-color: var(--bd-brand);
    box-shadow:
      0 0 0 2px var(--bd-brand),
      0 0.65rem 1.35rem rgba(0, 48, 135, 0.18);
  }

  body.content-subpage--business-division .shipbuilding-line__card-link:hover .shipbuilding-line__model,
  body.content-subpage--business-division .shipbuilding-line__card:hover .shipbuilding-line__model {
    color: var(--bd-brand);
  }
}

body.content-subpage--business-division .shipbuilding-line__card-link:focus-visible .shipbuilding-line__card-inner,
body.content-subpage--business-division .shipbuilding-line__card:focus-within > .shipbuilding-line__card-inner {
  border-color: var(--bd-brand);
  box-shadow: 0 0 0 2px var(--bd-brand);
}

body.content-subpage--business-division .shipbuilding-line__card-link:focus-visible {
  outline-color: var(--bd-brand);
}

body.content-subpage--business-division .agency-partner-catalog__foot {
  color: #4a5568;
}

body.content-subpage--business-division .danfoss-pdp {
  --danfoss-red: var(--bd-brand);
  --danfoss-text: #1a1a1a;
  --danfoss-muted: #4a5568;
  --danfoss-border: var(--bd-border);
  --danfoss-surface: var(--bd-surface);
}

body.content-subpage--business-division .danfoss-pdp__back-link:hover {
  color: var(--bd-brand);
}

body.content-subpage--business-division .danfoss-pdp__image-frame {
  background: var(--bd-surface);
  border-color: var(--bd-border);
}

body.content-subpage--business-division .danfoss-pdp__category {
  color: var(--bd-brand-accent);
  font-weight: 600;
}

body.content-subpage--business-division .danfoss-pdp__variant-title,
body.content-subpage--business-division .danfoss-pdp__order-no {
  color: var(--bd-brand);
  font-weight: 700;
}

body.content-subpage--business-division .danfoss-pdp__hero {
  border-bottom-color: var(--bd-border);
}

body.content-subpage--business-division .danfoss-pdp__btn-inquiry {
  color: #fff !important;
  background: var(--bd-brand) !important;
  border-color: var(--bd-brand) !important;
}

body.content-subpage--business-division .danfoss-pdp__btn-inquiry:hover {
  color: #fff !important;
  background: var(--bd-brand-hover) !important;
  border-color: var(--bd-brand-hover) !important;
}

body.content-subpage--business-division .danfoss-pdp__btn-inquiry:focus-visible {
  outline: 2px solid var(--bd-brand);
  outline-offset: 2px;
}

body.content-subpage--business-division .danfoss-pdp__spec-group-title {
  color: var(--bd-brand);
  padding-bottom: 0.35rem;
  border-bottom: 2px solid var(--bd-surface-strong);
}

body.content-subpage--business-division .danfoss-pdp__features {
  background: var(--bd-surface);
  border-left: 4px solid var(--bd-brand) !important;
}

body.content-subpage--business-division .danfoss-pdp__features li::before {
  color: var(--bd-brand);
  font-weight: 700;
}

body.content-subpage--business-division .danfoss-pdp__tab:hover,
body.content-subpage--business-division .danfoss-pdp__tab.is-active {
  color: var(--bd-brand);
  border-bottom-color: var(--bd-brand);
}

body.content-subpage--business-division .danfoss-pdp__tab.is-active {
  background: rgba(0, 48, 135, 0.08);
}

body.content-subpage--business-division .danfoss-pdp__tab:focus-visible {
  outline-color: var(--bd-brand);
}

body.content-subpage--business-division .danfoss-pdp__table--striped tbody tr:nth-child(odd) {
  background-color: var(--bd-surface);
}

body.content-subpage--business-division .danfoss-pdp__table th {
  color: var(--bd-brand-accent);
}

.product-inquiry--robustech {
  --inquiry-brand: var(--robustech-brand, #003087);
  --inquiry-brand-hover: var(--robustech-brand-hover, #00266a);
  --inquiry-brand-text: var(--robustech-brand, #003087);
  --inquiry-brand-border: rgba(0, 48, 135, 0.18);
  --inquiry-brand-accent: rgba(0, 48, 135, 0.08);
  --inquiry-submit-bg: var(--robustech-brand, #003087);
  --inquiry-submit-text: #fff;
  --inquiry-submit-hover-bg: var(--robustech-brand-hover, #00266a);
}

/* ----- 홍보센터 · 홍보 영상: 구 공식 홈페이지 sub03/sub01 계열 ----- */
body.content-subpage .content-subpage-main--marine-pr-videos {
  max-width: min(960px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.pr-videos-marine__head {
  margin-bottom: 1.25rem;
}

.pr-videos-marine__title {
  margin: 0;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
}

.pr-videos-marine__tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-videos-marine__tab {
  margin: 0 0 -1px;
  padding: 0.65rem 1.1rem;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 600;
  color: #5c6775;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 0.35rem 0.35rem 0 0;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
}

.pr-videos-marine__tab:hover {
  color: #0f1419;
}

.pr-videos-marine__panel {
  margin-bottom: 1.5rem;
}

.pr-videos-marine__player-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  background: #0f1419;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid #e4e9ef;
  box-shadow: 0 8px 28px rgba(15, 20, 25, 0.08);
}

.pr-videos-marine__player {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
}

.pr-videos-marine__foot {
  margin-top: 1rem;
  line-height: 1.55;
}

/* ----- 홍보센터 · 인증 및 수상: 구 공식 홈페이지 sub03/sub03 (.certi_con) ----- */
body.content-subpage .content-subpage-main--marine-pr-certifications {
  max-width: min(1280px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.pr-certi-marine__head {
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
}

.pr-certi-marine__title {
  margin: 0;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
}

/* 인증 마크 가독성: 열 수를 줄이고 카드·이미지를 크게 */
.pr-certi-marine__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.25rem, 3vw, 2rem);
}

@media (min-width: 480px) {
  .pr-certi-marine__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .pr-certi-marine__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1.5rem, 2.5vw, 2.25rem);
  }
}

.pr-certi-marine__item {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.pr-certi-marine__figure {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #fff;
  border: 1px solid #d8dee6;
  border-radius: 0.5rem;
  box-shadow: 0 6px 24px rgba(15, 20, 25, 0.07);
  min-height: clamp(220px, 32vw, 300px);
}

.pr-certi-marine__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: min(70vw, 360px);
  object-fit: contain;
}

@media (min-width: 992px) {
  .pr-certi-marine__figure {
    min-height: 300px;
    padding: 1.75rem 2rem;
  }

  .pr-certi-marine__img {
    max-height: 340px;
  }
}

.pr-certi-marine__foot {
  margin-top: 1.5rem;
  line-height: 1.55;
}

/* ----- YouTube형 카드 그리드 (회사 소식·미디어허브 공통) ----- */
.yt-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: clamp(0.65rem, 1.2vw, 1rem) clamp(0.5rem, 1vw, 0.85rem);
}

.yt-card-grid--gallery {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
  gap: 0.65rem;
}

.yt-card-grid__item {
  min-width: 0;
}

.yt-card {
  display: block;
  color: inherit;
  border-radius: 0.75rem;
  transition: background-color 0.15s ease;
}

.yt-card:hover {
  background-color: rgba(15, 20, 25, 0.04);
}

.yt-card__media {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
  background: #0f1419;
  aspect-ratio: 16 / 9;
}

.yt-card:hover .yt-card__thumb {
  transform: scale(1.03);
}

.yt-card__thumb {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s ease;
}

.yt-card__thumb[src*="pps-logo"],
.yt-card__thumb[src*="industry-news-outlets"],
.industry-news-list-item__thumb[src*="pps-logo"],
.industry-news-list-item__thumb[src*="industry-news-outlets"] {
  object-fit: contain;
  background: #f3f6f9;
  padding: 10%;
}

.yt-card:hover .yt-card__thumb[src*="pps-logo"],
.yt-card:hover .yt-card__thumb[src*="industry-news-outlets"] {
  transform: none;
}

.yt-card__info {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 0.65rem 0.75rem;
  padding: 0.7rem 0.35rem 0.5rem;
  align-items: start;
}

.yt-card--compact .yt-card__info {
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 0.5rem 0.65rem;
  padding: 0.55rem 0.2rem 0.35rem;
}

.yt-card__avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #f0f3f7;
  flex-shrink: 0;
}

.yt-card--compact .yt-card__avatar {
  width: 32px;
  height: 32px;
}

.yt-card__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.yt-card__avatar--inline {
  width: 40px;
  height: 40px;
}

.yt-card__text {
  min-width: 0;
}

.yt-card__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.35;
  color: #0f1419;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.yt-card--compact .yt-card__title {
  font-size: 0.88rem;
  -webkit-line-clamp: 2;
}

.yt-card:hover .yt-card__title {
  color: #004080;
}

.yt-card__channel,
.yt-card__stats,
.yt-card__desc {
  margin: 0.15rem 0 0;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #606060;
}

.yt-card__desc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.yt-card--media-only {
  pointer-events: none;
}

.yt-card--media-only .yt-card__media {
  border-radius: 10px;
}

/* ----- 홍보센터 · 회사 소식 ----- */
body.content-subpage .content-subpage-main--marine-pr-news-list {
  max-width: min(1680px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

body.content-subpage .content-subpage-main--marine-pr-news-article {
  max-width: min(1400px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.pr-news-marine__head {
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.pr-news-marine__title {
  margin: 0 0 0.35rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
}

.pr-news-marine__lead {
  font-size: 0.92rem;
  color: #606060;
}

.pr-news-marine__foot {
  margin-top: 2rem;
  line-height: 1.55;
}

/* ----- 홍보센터 · 업계 뉴스 ----- */
body.content-subpage .content-subpage-main--marine-pr-industry-news-list {
  max-width: min(960px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.pr-industry-news__head {
  margin-bottom: clamp(1rem, 2vw, 1.35rem);
}

.pr-industry-news__title {
  margin: 0 0 0.35rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
}

.pr-industry-news__lead {
  font-size: 0.92rem;
  color: #606060;
}

.pr-industry-news__updated {
  margin-top: 0.35rem;
}

.pr-industry-news__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.pr-industry-news__filter {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  border: 1px solid #d8dee6;
  background: #fff;
  color: #4a5562;
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
}

.pr-industry-news__filter.is-active {
  border-color: #004080;
  background: #004080;
  color: #fff;
}

.pr-industry-news__filter:not(.is-active):hover,
.pr-industry-news__filter:not(.is-active):focus-visible {
  border-color: #004080;
  color: #004080;
}

.pr-industry-news__filters--sub {
  margin-top: -0.65rem;
  margin-bottom: 1rem;
  padding-left: 0.35rem;
}

.pr-industry-news__filter--sub {
  font-size: 0.78rem;
  font-weight: 500;
  border-style: dashed;
}

.pr-industry-news__list {
  border-top: 1px solid #e4e9ef;
}

.pr-industry-news__item {
  border-bottom: 1px solid #e4e9ef;
}

.pr-industry-news__link {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  padding: 1rem 0.15rem;
  color: inherit;
}

.industry-news-list-item__link {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  color: inherit;
}

.industry-news-list-item__media {
  flex: 0 0 5.75rem;
  width: 5.75rem;
  aspect-ratio: 4 / 3;
  border-radius: 0.45rem;
  overflow: hidden;
  background: #eef2f6;
}

.industry-news-list-item__thumb {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.industry-news-list-item__content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 auto;
}

.industry-news-list-item__title {
  display: block;
}

.industry-news-list-item__source,
.industry-news-list-item__date {
  display: block;
}

@media (max-width: 575px) {
  .industry-news-list-item__media {
    flex-basis: 4.75rem;
    width: 4.75rem;
  }
}

.pr-industry-news__link:hover .pr-industry-news__item-title,
.pr-industry-news__link:focus-visible .pr-industry-news__item-title {
  color: #004080;
}

.pr-industry-news__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  margin-bottom: 0.35rem;
  font-size: 0.78rem;
  color: #868e96;
}

.pr-industry-news__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  background: #eef4fb;
  color: #004080;
  font-weight: 700;
}

.pr-industry-news__source {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 600;
  color: #4a5562;
}

.pr-industry-news__source-label {
  font-weight: 700;
  color: #004080;
}

.pr-industry-news__item-title {
  display: block;
  font-size: clamp(1rem, 1.6vw, 1.12rem);
  font-weight: 700;
  line-height: 1.45;
  color: #0f1419;
}

.pr-industry-news__summary {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.88rem;
  line-height: 1.55;
  color: #606060;
}

.pr-industry-news__external {
  display: inline-block;
  margin-top: 0.45rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #004080;
}

.pr-industry-news__empty {
  padding: 2rem 0;
  color: #868e96;
}

.pr-industry-news__pager {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 1.5rem;
}

.pr-industry-news__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.1rem;
  height: 2.1rem;
  padding: 0 0.55rem;
  border-radius: 6px;
  border: 1px solid #d8dee6;
  color: #4a5562;
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
}

.pr-industry-news__page.is-active {
  border-color: #004080;
  background: #004080;
  color: #fff;
}

.pr-industry-news__foot {
  margin-top: 2rem;
  line-height: 1.55;
}

.g2b-procurement-table-wrap {
  border: 1px solid #d8dee6;
  border-radius: 0.35rem;
  overflow: hidden;
  background: #fff;
}

.g2b-procurement-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid #e4e9ef;
  background: #f8fafc;
}

.g2b-procurement-table-total {
  font-size: 0.88rem;
  font-weight: 700;
  color: #334155;
}

.g2b-procurement-table {
  margin-bottom: 0;
  font-size: 0.82rem;
}

.g2b-procurement-table thead th {
  background: #eef4fb;
  color: #1f2937;
  font-weight: 700;
  white-space: nowrap;
  border-bottom-width: 1px;
  vertical-align: middle;
}

.g2b-procurement-table tbody td {
  vertical-align: middle;
}

.g2b-procurement-table__title {
  min-width: 18rem;
  max-width: 28rem;
}

.g2b-procurement-table__agency {
  min-width: 10rem;
  max-width: 16rem;
}

.g2b-procurement-table__link {
  color: #0b5cab;
  font-weight: 600;
  text-decoration: none;
}

.g2b-procurement-table__link:hover,
.g2b-procurement-table__link:focus-visible {
  color: #004080;
  text-decoration: underline;
}

.g2b-procurement-detail__toolbar {
  margin-bottom: 1rem;
}

.g2b-procurement-detail__back {
  color: #004080;
  font-weight: 600;
  text-decoration: none;
}

.g2b-procurement-detail__head {
  margin-bottom: 1.25rem;
}

.g2b-procurement-detail__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.g2b-procurement-detail__status,
.g2b-procurement-detail__dday {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}

.g2b-procurement-detail__status {
  background: #e8f1fb;
  color: #004080;
}

.g2b-procurement-detail__dday {
  background: #fff4e5;
  color: #9a6700;
}

.g2b-procurement-detail__dday--closed {
  background: #eef1f4;
  color: #64748b;
}

.g2b-procurement-detail__title {
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  font-weight: 700;
  line-height: 1.35;
  color: #111827;
}

.g2b-procurement-detail__section {
  margin-bottom: 1rem;
  border: 1px solid #d8dee6;
  border-radius: 0.35rem;
  overflow: hidden;
  background: #fff;
}

.g2b-procurement-detail__section-head {
  padding: 0.55rem 0.85rem;
  background: linear-gradient(180deg, #edf4fb 0%, #e3eef8 100%);
  border-bottom: 1px solid #d8dee6;
}

.g2b-procurement-detail__section-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #1e3a5f;
}

.g2b-procurement-detail__table {
  margin-bottom: 0;
  font-size: 0.84rem;
}

.g2b-procurement-detail__table th[scope="row"] {
  width: 12%;
  min-width: 7.5rem;
  background: #f3f6f9;
  color: #475569;
  font-weight: 600;
  white-space: nowrap;
}

.g2b-procurement-detail__table td {
  color: #111827;
  word-break: break-word;
}

.g2b-procurement-detail__actions {
  margin-top: 1.5rem;
}

.g2b-procurement-detail__open-g2b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.55rem 1.2rem;
  border-radius: 0.35rem;
  background: #004080;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.g2b-procurement-detail__note {
  margin-top: 0.75rem;
  font-size: 0.82rem;
  color: #64748b;
}

.home-marine-media-more__link {
  font-size: 0.88rem;
  font-weight: 700;
  color: #004080;
  text-decoration: none;
}

.home-marine-media-more__link:hover,
.home-marine-media-more__link:focus-visible {
  text-decoration: underline;
}

.home-marine-media-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.home-marine-media-quick__link {
  font-size: 0.85rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.home-marine-media-quick__link:hover,
.home-marine-media-quick__link:focus-visible {
  text-decoration: underline;
}

.pr-news-watch {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: start;
}

@media (min-width: 1100px) {
  .pr-news-watch {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1.5rem 2rem;
  }
}

.pr-news-watch__title {
  margin: 0 0 0.85rem;
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: #0f1419;
}

.pr-news-watch__meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding-bottom: 1.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-news-watch__channel {
  font-size: 0.95rem;
  font-weight: 600;
  color: #0f1419;
}

.pr-news-watch__stats {
  font-size: 0.85rem;
  color: #606060;
}

.pr-news-gallery {
  margin: 1.5rem 0 0.5rem;
}

.pr-news-gallery__title {
  margin: 0 0 0.35rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f1419;
}

.pr-news-gallery__hint {
  margin: 0 0 1rem;
  font-size: 0.88rem;
  color: #606060;
}

/* 회사 소식 상세 — 사진 카드 갤러리 */
.pr-news-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
  gap: clamp(0.65rem, 1.5vw, 1rem);
}

.pr-news-photo-grid__item {
  min-width: 0;
}

.pr-news-photo-card {
  display: block;
  width: 100%;
  padding: 0;
  border: none;
  border-radius: 12px;
  overflow: hidden;
  cursor: zoom-in;
  background: #0f1419;
  box-shadow: 0 4px 18px rgba(15, 20, 25, 0.08);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.pr-news-photo-card:hover,
.pr-news-photo-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(15, 20, 25, 0.14);
  outline: none;
}

.pr-news-photo-card:focus-visible {
  box-shadow:
    0 10px 28px rgba(15, 20, 25, 0.14),
    0 0 0 3px rgba(0, 64, 128, 0.35);
}

.pr-news-photo-card__media {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.pr-news-photo-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.25s ease;
}

.pr-news-photo-card:hover .pr-news-photo-card__img,
.pr-news-photo-card:focus-visible .pr-news-photo-card__img {
  transform: scale(1.05);
}

.pr-news-photo-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  background: rgba(15, 20, 25, 0.45);
  color: #fff;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.pr-news-photo-card {
  position: relative;
}

.pr-news-photo-card:hover .pr-news-photo-card__overlay,
.pr-news-photo-card:focus-visible .pr-news-photo-card__overlay {
  opacity: 1;
}

.pr-news-photo-card__zoom-icon {
  width: 2.5rem;
  height: 2.5rem;
  border: 2px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: rgba(0, 64, 128, 0.75)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.35-4.35M11 8v6M8 11h6'/%3E%3C/svg%3E")
    center / 1.25rem no-repeat;
}

.pr-news-photo-card__zoom-text {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* 라이트박스 */
body.pr-news-lightbox-open {
  overflow: hidden;
}

.pr-news-lightbox {
  --pr-news-lightbox-img-max-h: min(94dvh, 94vh);
  --pr-news-lightbox-img-max-w: min(96vw, 100%);
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem;
}

.pr-news-lightbox[hidden] {
  display: none !important;
}

.pr-news-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 20, 25, 0.88);
  cursor: zoom-out;
}

.pr-news-lightbox__panel {
  position: relative;
  z-index: 1;
  width: var(--pr-news-lightbox-img-max-w);
  max-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0 3.25rem;
}

.pr-news-lightbox__figure {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-height: var(--pr-news-lightbox-img-max-h);
  margin: 0;
  overflow: hidden;
  touch-action: none;
  cursor: zoom-in;
  user-select: none;
  -webkit-user-select: none;
}

.pr-news-lightbox__figure.is-zoomed {
  cursor: grab;
}

.pr-news-lightbox__figure.is-panning {
  cursor: grabbing;
}

.pr-news-lightbox__img {
  display: block;
  max-width: var(--pr-news-lightbox-img-max-w);
  max-height: var(--pr-news-lightbox-img-max-h);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 0.25rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
  transform-origin: center center;
  will-change: transform;
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

.pr-news-lightbox--zoomed .pr-news-lightbox__backdrop {
  cursor: default;
}

.pr-news-lightbox__caption {
  max-width: var(--pr-news-lightbox-img-max-w);
  font-size: 0.88rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.88);
  text-align: center;
}

.pr-news-lightbox__counter {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.65);
}

.pr-news-lightbox__close {
  position: fixed;
  top: max(0.65rem, env(safe-area-inset-top, 0px));
  right: max(0.65rem, env(safe-area-inset-right, 0px));
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.pr-news-lightbox__close:hover {
  background: rgba(255, 255, 255, 0.22);
}

.pr-news-lightbox__nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.pr-news-lightbox__nav:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.28);
}

.pr-news-lightbox__nav:disabled {
  opacity: 0.35;
  cursor: default;
}

.pr-news-lightbox__nav--prev {
  left: max(0.5rem, env(safe-area-inset-left, 0px));
}

.pr-news-lightbox__nav--next {
  right: max(0.5rem, env(safe-area-inset-right, 0px));
}

@media (max-width: 575.98px) {
  .pr-news-lightbox {
    --pr-news-lightbox-img-max-h: min(90dvh, 90vh);
    --pr-news-lightbox-img-max-w: 100%;
    padding: 0.2rem;
  }

  .pr-news-lightbox__panel {
    padding: 0 2.75rem;
  }

  .pr-news-lightbox__nav {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.65rem;
  }
}

.pr-news-watch__sidebar-title,
.pr-news-more__title {
  margin: 0 0 0.85rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f1419;
}

.pr-news-watch__sidebar-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

@media (max-width: 1099.98px) {
  .pr-news-watch__sidebar {
    padding-top: 1.5rem;
    border-top: 1px solid #e4e9ef;
  }
}

.pr-news-more {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid #e4e9ef;
}

/* ----- 홍보센터 · 공지사항 · 입찰공지 (HD현대중공업 입찰공고 UI 참고) ----- */
body.content-subpage .content-subpage-main--marine-pr-notices {
  max-width: min(1080px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1rem, 2vh, 1.5rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

body.content-subpage .content-subpage-main--marine-pr-public-procurement-list {
  max-width: min(1440px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.75rem, 2vw, 1.25rem) !important;
  padding-top: clamp(1rem, 2vh, 1.5rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table {
  min-width: 1180px;
  width: 100%;
  table-layout: auto;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table thead th,
.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table tbody td {
  padding-inline: 0.65rem;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table thead th:nth-child(1),
.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table tbody td:nth-child(1) {
  width: 3rem;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table thead th:nth-child(4),
.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table tbody td:nth-child(4) {
  min-width: 20rem;
}

.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table thead th:nth-child(5),
.content-subpage-main--marine-pr-public-procurement-list .g2b-procurement-table tbody td:nth-child(5) {
  min-width: 11rem;
}

.pr-notices-subnav {
  margin-top: -0.25rem;
}

.pr-bid-source-tabs {
  margin-bottom: 1.25rem;
}

.pr-public-procurement__head {
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-public-procurement__title {
  margin: 0 0 0.5rem;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 800;
  color: #0f1419;
}

.pr-public-procurement__lead {
  color: #3d4652;
  line-height: 1.55;
}

.pr-public-procurement__updated {
  margin-top: 0.5rem;
}

.pr-public-procurement__search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
  align-items: center;
}

@media (max-width: 575.98px) {
  .pr-public-procurement__search {
    grid-template-columns: 1fr;
  }
}

.pr-public-procurement__query {
  min-height: 2.75rem;
  border-radius: 0.35rem;
  border-color: #ced4da;
}

.pr-public-procurement__submit,
.pr-public-procurement__reset {
  min-height: 2.75rem;
  padding-inline: 1.35rem;
  font-weight: 600;
  border-radius: 0.35rem;
}

.pr-public-procurement__submit {
  color: #fff;
  background: #004080;
  border: none;
}

.pr-public-procurement__submit:hover {
  background: #003366;
  color: #fff;
}

.pr-public-procurement__reset {
  color: #004080;
  background: #fff;
  border: 1px solid #ced4da;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.pr-public-procurement__reset:hover {
  color: #003366;
  border-color: #004080;
}

.pr-public-procurement__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
  margin-bottom: 1.25rem;
}

.pr-public-procurement__filter {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  border: 1px solid #d8dee6;
  background: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  color: #4a5562;
  text-decoration: none;
}

.pr-public-procurement__filter.is-active {
  border-color: #004080;
  background: #004080;
  color: #fff;
}

.pr-public-procurement__filter:not(.is-active):hover,
.pr-public-procurement__filter:not(.is-active):focus-visible {
  border-color: #004080;
  color: #004080;
}

.pr-public-procurement__empty {
  padding: 2rem 1rem;
  text-align: center;
  color: #5c6775;
}

.pr-public-procurement__pager {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: center;
  margin-top: 1.5rem;
}

.pr-public-procurement__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.65rem;
  border-radius: 0.35rem;
  border: 1px solid #d8dee6;
  background: #fff;
  color: #1a1a1a;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
}

.pr-public-procurement__page.is-active {
  border-color: #004080;
  background: #004080;
  color: #fff;
}

.pr-public-procurement__foot {
  margin-top: 1.25rem;
  line-height: 1.55;
}

.pr-bid-list__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-bid-list__title {
  margin: 0;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 800;
  color: #0f1419;
}

.pr-bid-list__count {
  font-size: 0.95rem;
  font-weight: 600;
  color: #5c6775;
}

.pr-bid-list__search {
  display: grid;
  grid-template-columns: minmax(7rem, 9rem) minmax(0, 1fr) auto;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  align-items: center;
}

@media (max-width: 575.98px) {
  .pr-bid-list__search {
    grid-template-columns: 1fr;
  }
}

.pr-bid-list__scope,
.pr-bid-list__query {
  min-height: 2.75rem;
  border-radius: 0.35rem;
  border-color: #ced4da;
}

.pr-bid-list__submit {
  min-height: 2.75rem;
  padding-inline: 1.35rem;
  font-weight: 600;
  color: #fff;
  background: #004080;
  border: none;
  border-radius: 0.35rem;
}

.pr-bid-list__submit:hover {
  background: #003366;
  color: #fff;
}

.pr-bid-list__items {
  border-top: 1px solid #212529;
}

.pr-bid-list__item {
  border-bottom: 1px solid #e4e9ef;
}

.pr-bid-list__link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem 1.25rem;
  padding: 1.15rem 0.35rem;
  color: inherit;
  transition: background-color 0.15s ease;
}

.pr-bid-list__link:hover {
  background-color: rgba(0, 64, 128, 0.04);
}

@media (max-width: 575.98px) {
  .pr-bid-list__link {
    grid-template-columns: 1fr;
    gap: 0.65rem;
  }
}

.pr-bid-list__dday {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.25rem;
  height: 2rem;
  padding: 0 0.5rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #004080;
  background: #e8f1fa;
  border-radius: 0.25rem;
  flex-shrink: 0;
}

.pr-bid-list__dday--closed {
  color: #5c6775;
  background: #eef1f4;
}

.pr-bid-list__item-title {
  display: block;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.45;
  color: #0f1419;
  margin-bottom: 0.65rem;
}

.pr-bid-list__link:hover .pr-bid-list__item-title {
  color: #004080;
}

.pr-bid-list__meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.pr-bid-list__meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  font-size: 0.88rem;
  line-height: 1.45;
}

.pr-bid-list__meta-label {
  font-weight: 600;
  color: #5c6775;
  flex-shrink: 0;
}

.pr-bid-list__meta-label::after {
  content: ":";
  margin-left: 0.1rem;
}

.pr-bid-list__meta-value {
  color: #1a2332;
}

.pr-bid-list__empty {
  padding: 2rem 0;
  text-align: center;
  color: #5c6775;
}

.pr-bid-list__pager {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem;
  margin-top: 2rem;
}

.pr-bid-list__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #5c6775;
  text-decoration: none;
  border: 1px solid #e4e9ef;
  border-radius: 0.25rem;
}

.pr-bid-list__page:hover {
  border-color: #004080;
  color: #004080;
}

.pr-bid-list__page--active {
  color: #fff;
  background: #004080;
  border-color: #004080;
}

.pr-bid-detail__toolbar {
  margin-bottom: 1rem;
}

.pr-bid-detail__back {
  font-size: 0.92rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.pr-bid-detail__back:hover {
  text-decoration: underline;
}

.pr-bid-detail__head {
  padding-bottom: 1.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-bid-detail__badges {
  margin-bottom: 0.75rem;
}

.pr-bid-detail__title {
  margin: 0 0 1rem;
  font-size: clamp(1.25rem, 2.2vw, 1.6rem);
  font-weight: 800;
  line-height: 1.4;
  color: #0f1419;
}

.pr-bid-detail__facts {
  display: grid;
  gap: 0.65rem;
}

.pr-bid-detail__fact {
  display: grid;
  grid-template-columns: minmax(5.5rem, 7rem) minmax(0, 1fr);
  gap: 0.5rem 1rem;
  font-size: 0.92rem;
}

.pr-bid-detail__fact dt {
  margin: 0;
  font-weight: 600;
  color: #5c6775;
}

.pr-bid-detail__fact dd {
  margin: 0;
  color: #1a2332;
}

.pr-bid-detail__content {
  margin-bottom: 1.5rem;
  font-size: 1rem;
  line-height: 1.75;
  color: #1a2332;
}

.pr-bid-detail__actions {
  padding-top: 0.5rem;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.pr-bid-detail__apply {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 9.5rem;
  padding: 0.75rem 1.5rem;
  border-radius: 0.375rem;
  background: #004282;
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.15s ease;
}

.pr-bid-detail__apply:hover {
  background: #003666;
  color: #fff;
}

.pr-bid-detail__apply-note {
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: #64748b;
}

.pr-notices-general__title {
  margin: 0 0 0.75rem;
  font-size: 1.35rem;
  font-weight: 800;
}

.pr-notices-general__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1.25rem;
}

.pr-notices-general__count {
  font-size: 0.92rem;
  color: #64748b;
}

.pr-notices-general__items {
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.pr-notices-general__item {
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.pr-notices-general__link {
  display: block;
  padding: 1.1rem 0.25rem;
  color: inherit;
  transition: background-color 0.15s ease;
}

.pr-notices-general__link:hover {
  background: rgba(0, 64, 128, 0.04);
}

.pr-notices-general__body {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.pr-notices-general__item-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.45;
}

.pr-notices-general__link:hover .pr-notices-general__item-title {
  color: #004080;
}

.pr-notices-general__date {
  font-size: 0.9rem;
  color: #64748b;
}

.pr-notices-general__empty {
  color: #5c6775;
  line-height: 1.65;
}

.pr-general-notice-detail__toolbar {
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-general-notice-detail__back {
  font-size: 0.92rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.pr-general-notice-detail__back:hover {
  text-decoration: underline;
}

.pr-general-notice-detail__date {
  font-size: 0.92rem;
  color: #64748b;
}

.pr-general-notice-detail__title {
  margin: 0;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  font-weight: 800;
  line-height: 1.35;
  color: #0f172a;
}

.pr-general-notice-detail__content {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  color: #334155;
  line-height: 1.75;
}

.pr-notices-general__message {
  color: #5c6775;
  line-height: 1.65;
}

.pr-notices-general__cta {
  font-weight: 600;
  color: #fff;
  background: #004080;
  border: none;
  border-radius: 0.35rem;
  padding: 0.55rem 1.25rem;
}

.pr-notices-general__cta:hover {
  background: #003366;
  color: #fff;
}

@media (min-width: 1100px) {
  .pr-news-more {
    display: none;
  }
}

.pr-news-article__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e4e9ef;
}

.pr-news-article__back {
  font-size: 0.92rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.pr-news-article__back:hover {
  text-decoration: underline;
}

.pr-news-article__date {
  font-size: 0.88rem;
  color: #5c6775;
}

.pr-news-article__para {
  font-size: 1rem;
  line-height: 1.75;
  color: #1a2332;
  white-space: pre-line;
}

.pr-news-article__figure {
  margin: 0;
  text-align: center;
}

.pr-news-article__img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
  border-radius: 0.35rem;
  border: 1px solid #e4e9ef;
  box-shadow: 0 6px 20px rgba(15, 20, 25, 0.06);
}

.pr-news-article__nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e4e9ef;
}

@media (max-width: 575.98px) {
  .pr-news-article__nav {
    grid-template-columns: 1fr;
  }
}

.pr-news-article__nav-link {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.85rem 1rem;
  color: inherit;
  text-decoration: none;
  background: #f7f9fb;
  border: 1px solid #e4e9ef;
  border-radius: 0.35rem;
  min-height: 4.5rem;
}

.pr-news-article__nav-link--next {
  text-align: right;
}

.pr-news-article__nav-link:hover {
  border-color: #b8c5d4;
  background: #fff;
}

.pr-news-article__nav-link--empty {
  visibility: hidden;
  border: none;
  background: transparent;
}

.pr-news-article__nav-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #5c6775;
}

.pr-news-article__nav-title {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.45;
  color: #0f1419;
}

/* ----- 재무하이라이트: HD현대마린솔루션 invest/financial-information/highlights 계열 ----- */
body.content-subpage .content-subpage-main--marine-fin-highlights {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.fin-highlights-marine__layout {
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

@media (max-width: 991.98px) {
  .fin-highlights-marine__layout {
    grid-template-columns: 1fr;
  }

  .fin-highlights-marine__lnb {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.75rem 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e8ecf0;
  }
}

.fin-highlights-marine__lnb-cap {
  margin: 0 0 0.75rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6b7582;
}

body.content-subpage :lang(ko) .fin-highlights-marine__lnb-cap {
  text-transform: none;
  letter-spacing: 0.1em;
}

.fin-highlights-marine__lnb-link {
  display: block;
  padding: 0.45rem 0;
  font-size: 0.98rem;
  font-weight: 600;
  color: #0f1419;
  border-left: 3px solid transparent;
  padding-left: 0.85rem;
  margin-left: -0.85rem;
  text-decoration: none;
}

a.fin-highlights-marine__lnb-link:hover {
  color: #004080;
}

.fin-highlights-marine__lnb-link--active {
  border-left-color: #004080;
  color: #004080;
}

.fin-highlights-marine__eyebrow {
  margin: 0 0 0.5rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: #6b7582;
  text-transform: uppercase;
}

.fin-highlights-marine__title {
  margin: 0 0 1.75rem;
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f1419;
}

.fin-highlights-marine__tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  margin-bottom: 1.75rem;
  border-bottom: 1px solid #e4e9ef;
}

.fin-highlights-marine__tab {
  margin: 0 0 -1px;
  padding: 0.65rem 1.1rem;
  cursor: pointer;
  font-size: 0.95rem;
  font-weight: 600;
  color: #5c6775;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 0.35rem 0.35rem 0 0;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
}

.fin-highlights-marine__tab:hover {
  color: #0f1419;
}

.fin-highlights-marine__kpi-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
}

.fin-highlights-marine__kpi-head-title {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6b7582;
}

body.content-subpage :lang(ko) .fin-highlights-marine__kpi-head-title {
  text-transform: none;
  letter-spacing: 0.08em;
}

.fin-highlights-marine__kpi-head-year {
  font-size: 0.9rem;
  font-weight: 700;
  color: #004080;
}

.fin-highlights-marine__kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.75rem, 2vw, 1.25rem);
  list-style: none;
  padding: 0;
  margin: 0 0 2.25rem;
}

@media (min-width: 768px) {
  .fin-highlights-marine__kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.fin-highlights-marine__kpi {
  background: #f8fafc;
  border: 1px solid #e8ecf0;
  border-radius: 0.5rem;
  padding: clamp(1rem, 2vw, 1.35rem);
}

.fin-highlights-marine__kpi-label {
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: #5c6775;
}

.fin-highlights-marine__kpi-value {
  margin: 0;
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f1419;
}

.fin-highlights-marine__kpi-sub {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  color: #004080;
  font-weight: 600;
}

.fin-highlights-marine__table-wrap {
  margin-bottom: 2.5rem;
}

.fin-highlights-marine__table-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 0.85rem;
}

.fin-highlights-marine__table-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f1419;
}

.fin-highlights-marine__table-unit {
  margin: 0;
  font-size: 0.8rem;
  color: #6b7582;
}

.fin-highlights-marine__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.fin-highlights-marine__table th,
.fin-highlights-marine__table td {
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid #e8ecf0;
  text-align: right;
}

.fin-highlights-marine__table th {
  text-align: left;
  font-weight: 600;
  color: #3d4a5a;
  width: 52%;
}

.fin-highlights-marine__table td {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #0f1419;
}

.fin-highlights-marine__chart {
  padding-top: 0.5rem;
  border-top: 1px solid #e8ecf0;
  margin-bottom: 1.75rem;
}

.fin-highlights-marine__chart-head {
  margin-bottom: 1.25rem;
}

.fin-highlights-marine__chart-title {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f1419;
}

.fin-highlights-marine__chart-unit {
  font-size: 0.8rem;
  color: #6b7582;
}

.fin-highlights-marine__bars {
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  gap: clamp(1rem, 4vw, 3rem);
  min-height: 260px;
  padding: clamp(1.25rem, 2.5vw, 1.75rem) clamp(0.75rem, 2vw, 1.25rem)
    clamp(1rem, 2vw, 1.35rem);
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e8ecf0;
  border-radius: 0.5rem;
  overflow: visible;
}

.fin-highlights-marine__bar {
  flex: 1;
  max-width: 140px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.fin-highlights-marine__bar-track {
  width: min(72px, 100%);
  height: 168px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  background: linear-gradient(180deg, #eef2f6 0%, #f8fafc 100%);
  border-radius: 0.35rem;
  border: 1px solid #e4e9ef;
}

.fin-highlights-marine__bar-stick {
  display: block;
  width: 100%;
  min-height: 6%;
  background: linear-gradient(180deg, #0a5cad 0%, #004080 100%);
  border-radius: 0.25rem 0.25rem 0 0;
  transition: height 0.25s ease;
}

.fin-highlights-marine__bar-value {
  display: block;
  min-height: 1.35em;
  margin: 0;
  padding: 0 0.15rem;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
  color: #0f1419;
  white-space: nowrap;
}

.fin-highlights-marine__bar-year {
  margin: 0;
  padding: 0.15rem 0 0;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.3;
  color: #5c6775;
}

/* ----- IR 정보: invest/ir 주식 캔들 차트 ----- */
body.content-subpage .content-subpage-main--marine-invest-ir {
  max-width: min(1240px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.25rem, 2.2vh, 1.75rem) !important;
  padding-bottom: clamp(3rem, 8vh, 5rem) !important;
}

.invest-ir-marine__quote {
  margin-bottom: 2rem;
  padding: clamp(1rem, 2vw, 1.35rem);
  background: #f8fafc;
  border: 1px solid #e8ecf0;
  border-radius: 0.5rem;
}

.invest-ir-marine__quote-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  margin-bottom: 1.25rem;
}

.invest-ir-marine__company {
  margin: 0 0 0.5rem;
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  font-weight: 800;
  color: #0f1419;
}

.invest-ir-marine__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

.invest-ir-marine__status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #004080;
  background: #e8f0fa;
  border: 1px solid #c5d9ef;
}

.invest-ir-marine__status-note {
  font-size: 0.82rem;
  line-height: 1.45;
  color: #5c6775;
}

.invest-ir-marine__as-of {
  font-size: 0.82rem;
  font-weight: 600;
  color: #6b7582;
  white-space: nowrap;
}

.invest-ir-marine__metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

@media (min-width: 768px) {
  .invest-ir-marine__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .invest-ir-marine__metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.invest-ir-marine__metric {
  padding: 0.65rem 0.75rem;
  background: #fff;
  border: 1px solid #e8ecf0;
  border-radius: 0.35rem;
}

.invest-ir-marine__metric--primary {
  grid-column: 1 / -1;
}

@media (min-width: 768px) {
  .invest-ir-marine__metric--primary {
    grid-column: auto;
  }
}

.invest-ir-marine__metric-label {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #5c6775;
}

.invest-ir-marine__metric-value {
  display: block;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: #0f1419;
}

.invest-ir-marine__metric--primary .invest-ir-marine__metric-value {
  font-size: clamp(1.35rem, 2.2vw, 1.75rem);
}

.invest-ir-marine__metric-value--up {
  color: #c62828;
}

.invest-ir-marine__metric-value--down {
  color: #1565c0;
}

.invest-ir-marine__chart-section {
  margin-bottom: 2.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #e8ecf0;
}

.invest-ir-marine__chart-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.invest-ir-marine__chart-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f1419;
}

.invest-ir-marine__periods {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.invest-ir-marine__period {
  padding: 0.4rem 0.75rem;
  border: 1px solid #dce3ea;
  border-radius: 999px;
  background: #fff;
  font-size: 0.82rem;
  font-weight: 700;
  color: #5c6775;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.invest-ir-marine__period:hover {
  color: #004080;
  border-color: #9eb8d4;
}

.invest-ir-marine__period--active {
  color: #fff;
  background: #004080;
  border-color: #004080;
}

.invest-ir-marine__chart-wrap {
  border: 1px solid #e4e9ef;
  border-radius: 0.5rem;
  overflow: hidden;
  background: #fff;
}

.invest-ir-marine__chart {
  width: 100%;
  min-height: 420px;
}

.invest-ir-marine__disclosures {
  margin-bottom: 1.75rem;
  padding-top: 0.5rem;
  border-top: 1px solid #e8ecf0;
}

.invest-ir-marine__disclosures-title {
  margin: 0 0 1rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f1419;
}

.invest-ir-marine__disclosure-list {
  border: 1px solid #e8ecf0;
  border-radius: 0.5rem;
  overflow: hidden;
}

.invest-ir-marine__disclosure-item + .invest-ir-marine__disclosure-item {
  border-top: 1px solid #e8ecf0;
}

.invest-ir-marine__disclosure-link {
  display: grid;
  grid-template-columns: 6.5rem 5.5rem minmax(0, 1fr);
  gap: 0.75rem 1rem;
  align-items: center;
  padding: 0.85rem 1rem;
  text-decoration: none;
  color: inherit;
  background: #fff;
  transition: background 0.15s ease;
}

.invest-ir-marine__disclosure-link:hover {
  background: #f8fafc;
}

.invest-ir-marine__disclosure-link--static {
  cursor: default;
}

.invest-ir-marine__disclosure-date {
  font-size: 0.82rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #5c6775;
}

.invest-ir-marine__disclosure-cat {
  font-size: 0.75rem;
  font-weight: 700;
  color: #004080;
}

.invest-ir-marine__disclosure-title {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.45;
  color: #0f1419;
}

@media (max-width: 767.98px) {
  .invest-ir-marine__disclosure-link {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }
}

.invest-ir-marine__foot {
  line-height: 1.55;
}

.home-marine-global {
  position: relative;
  background: #f3f5f7;
  overflow: hidden;
}

.home-marine-global::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: min(1600px, 100%);
  height: 490px;
  max-height: 42vh;
  background: url("/images/rt-bg-pack03.png") no-repeat center top / contain;
  opacity: 0.5;
  pointer-events: none;
  z-index: 0;
}

.home-marine-global .home-marine-container {
  position: relative;
  z-index: 1;
}

.home-marine-global-layout {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(2rem, 4vw, 4rem);
}

.home-marine-global-aside {
  flex: 1 1 320px;
  max-width: 640px;
}

.home-marine-global-gallery {
  flex: 1 1 360px;
  min-width: 0;
}

.home-marine-global-stats .home-marine-global-num {
  font-size: 2rem;
  font-weight: 800;
  color: #111;
  line-height: 1.1;
}

.home-marine-global-cap {
  font-size: 0.8125rem;
}

.home-marine-text-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.55rem 0;
  font-weight: 700;
  font-size: 0.9rem;
  color: #004080;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 64, 128, 0.35);
  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.home-marine-text-btn:hover {
  color: #002a55;
  border-color: rgba(0, 42, 85, 0.55);
}

.home-marine-text-btn::after {
  content: "";
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: rgba(0, 64, 128, 0.12)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23004080' d='M4 1.5 9.5 6 4 10.5z'/%3E%3C/svg%3E")
    no-repeat center / 0.45rem auto;
}

.home-marine-global-track {
  display: flex;
  gap: clamp(0.65rem, 1.2vw, 1rem);
  overflow-x: auto;
  padding-bottom: 0.35rem;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.home-marine-global-track--three {
  flex-wrap: nowrap;
}

@media (min-width: 992px) {
  .home-marine-global-track--three {
    overflow-x: visible;
    justify-content: stretch;
    gap: clamp(0.75rem, 1.4vw, 1.15rem);
  }

  .home-marine-global-track--three .home-marine-global-tile {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
  }
}

.home-marine-global-tile {
  position: relative;
  flex: 0 0 clamp(220px, 58vw, 280px);
  scroll-snap-align: start;
  min-height: clamp(300px, 52vw, 380px);
  border-radius: clamp(1.1rem, 1.8vw, 1.35rem);
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 0.45rem 1.65rem rgba(0, 0, 0, 0.14);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.home-marine-global-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 0.65rem 2rem rgba(0, 0, 0, 0.2);
  color: #fff;
}

.home-marine-global-tile__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-color: #1171b2;
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
  transition: transform 0.35s ease;
}

.home-marine-global-tile:hover .home-marine-global-tile__bg {
  transform: scale(1.08);
}

/* Global Network 파트너 카드: Danfoss·YOKOGAWA·Skarpenord 공식 로고 */
.home-marine-global-tile__bg--1 {
  background-color: #eef2f6;
  background-image: url("/images/global-partner-danfoss.svg");
  background-size: 78% auto;
  background-repeat: no-repeat;
  background-position: center;
}

.home-marine-global-tile__bg--2 {
  background-color: #004244;
  background-image: url("/images/skarpenord/logo-white.png");
  background-size: 72% auto;
  background-repeat: no-repeat;
  background-position: center;
}

.home-marine-global-tile__bg--3 {
  background-color: #eef2f6;
  background-image: url("/images/global-partner-yokogawa.svg");
  background-size: 88% auto;
  background-repeat: no-repeat;
  background-position: center;
}

.home-marine-global-tile__bg--4 {
  background-image: url("/images/hm-hms-global-04.jpg");
}

.home-marine-global-tile__body {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: inherit;
  padding: clamp(1.75rem, 3vw, 2.35rem) clamp(1.35rem, 2.5vw, 1.85rem)
    clamp(1.35rem, 2.5vw, 1.75rem);
  box-sizing: border-box;
  background: linear-gradient(
    185deg,
    rgba(4, 8, 14, 0.05) 0%,
    rgba(4, 8, 14, 0.35) 45%,
    rgba(4, 8, 14, 0.82) 100%
  );
}

.home-marine-global-tile__cap {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.92;
}

.home-marine-global-tile__tit {
  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin-top: 0.35rem;
}

.home-marine-global-tile__sub {
  font-size: 0.82rem;
  opacity: 0.88;
  line-height: 1.45;
  margin-top: auto;
  padding-top: 1rem;
}

.home-marine-media {
  position: relative;
  background: #fff;
  overflow: hidden;
}

.home-marine-media::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: min(1600px, 100%);
  height: 420px;
  max-height: 38vh;
  background: url("/images/rt-bg-pack01.png") no-repeat center top / contain;
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;
}

.home-marine-media .home-marine-container {
  position: relative;
  z-index: 1;
}

.home-marine-media-layout {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: clamp(1.75rem, 3.5vw, 2.75rem);
}

@media (min-width: 992px) {
  .home-marine-media-layout {
    /* HD 마린 메인 미디어허브: 좌측 라벨·탭 영역을 더 넓게(약 40~44% 트랙) */
    grid-template-columns: minmax(300px, 0.44fr) minmax(0, 1fr);
    gap: clamp(2.25rem, 5vw, 5.25rem);
  }
}

.home-marine-media-left {
  min-width: 0;
}

.home-marine-media-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1.25rem;
}

.home-marine-media-head__nav {
  flex: 1 1 14rem;
  min-width: 0;
}

.home-marine-media-main-tabs {
  display: flex;
}

.home-marine-media-right {
  min-width: 0;
}

.home-marine-media-layout--with-side-nav {
  gap: clamp(1.25rem, 2.5vw, 2rem);
}

@media (min-width: 992px) {
  .home-marine-media-layout--with-side-nav {
    grid-template-columns:
      minmax(260px, 0.36fr)
      minmax(0, 1fr)
      minmax(108px, 0.17fr);
    align-items: start;
  }

  .home-marine-media-layout--with-side-nav .home-marine-media-left {
    grid-column: 1;
    grid-row: 1;
  }

  .home-marine-media-layout--with-side-nav .home-marine-media-right {
    grid-column: 2;
    grid-row: 1;
  }

  .home-marine-media-layout--with-side-nav .home-marine-media-aside {
    grid-column: 3;
    grid-row: 1;
    position: sticky;
    top: calc(var(--site-header-height, 4.5rem) + 0.75rem);
  }
}

.home-marine-media-aside {
  min-width: 0;
}

.media-hub-side-nav {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.home-marine-media-aside .media-hub-side-nav--industry {
  display: none;
}

.home-marine-media-layout--industry .home-marine-media-aside .media-hub-side-nav--main {
  display: none;
}

.home-marine-media-layout--industry .home-marine-media-aside .media-hub-side-nav--industry {
  display: flex;
}

.media-hub-side-box {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  min-height: 3.35rem;
  padding: 0.5rem 0.6rem;
  border: none;
  border-radius: 0.75rem;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  color: #fff;
  background-color: #0b1220;
  box-shadow: 0 0.2rem 0.65rem rgba(0, 0, 0, 0.12);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.media-hub-side-box::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: var(--media-hub-box-bg);
  background-size: cover;
  background-position: center;
  transform: scale(1.04);
  transition: transform 0.32s ease;
}

.media-hub-side-box::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(11, 18, 32, 0.08) 0%,
    rgba(11, 18, 32, 0.72) 100%
  );
  transition: background 0.2s ease;
}

.media-hub-side-box.is-active::after {
  background: linear-gradient(
    180deg,
    rgba(0, 64, 128, 0.22) 0%,
    rgba(0, 64, 128, 0.86) 100%
  );
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.88);
}

.media-hub-side-box:hover,
.media-hub-side-box:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 0.45rem 1.1rem rgba(0, 0, 0, 0.2);
}

.media-hub-side-box:hover::before,
.media-hub-side-box:focus-visible::before {
  transform: scale(1.1);
}

.media-hub-side-box__label {
  position: relative;
  z-index: 2;
  font-size: clamp(0.68rem, 0.78vw, 0.74rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 0.35rem rgba(0, 0, 0, 0.45);
  word-break: keep-all;
}

.floating-now-col--cards .media-hub-side-nav {
  margin-bottom: 0.15rem;
}

.floating-now-col--cards .media-hub-side-box {
  min-height: 2.85rem;
}

.floating-now-promo-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.floating-now-card--hasimg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.home-marine-media-lead {
  margin: 0.75rem 0 0;
  font-size: clamp(1rem, 1.22vw, 1.14rem);
  line-height: 1.58;
  color: #4a5562;
  word-break: keep-all;
}

.home-marine-tablist--media {
  margin-top: 0;
}

.home-marine-media-empty {
  font-size: 0.9rem;
  color: #868e96;
}

.home-marine-tablist--underline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}

.home-marine-tablist--underline .home-marine-tab {
  padding: 0.35rem 0 0.6rem;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent !important;
  color: #868e96;
  font-weight: 600;
  font-size: clamp(0.95rem, 1.05vw, 1.06rem);
  border-bottom: 2px solid transparent;
  transition:
    color 0.25s ease,
    border-color 0.25s ease;
}

.home-marine-tablist--underline .home-marine-tab:hover {
  color: #495057;
}

.home-marine-tablist--underline .home-marine-tab.is-active {
  color: #111;
  font-weight: 800;
  border-bottom-color: #111;
}

.home-marine-tab-panel[hidden] {
  display: none !important;
}

.home-marine-industry-panel:not(.is-active) {
  display: none;
}

.home-marine-industry-subtabs {
  display: none;
  gap: 0.35rem 0.75rem;
}

.home-marine-media-layout--industry .home-marine-media-main-tabs {
  display: none;
}

.home-marine-media-layout--industry .home-marine-industry-subtabs {
  display: flex;
}

.home-marine-industry-subtabs .home-marine-industry-tab {
  font-size: clamp(0.78rem, 0.9vw, 0.875rem);
  padding-bottom: 0.35rem;
}

.home-marine-industry-updated {
  font-size: 0.75rem;
  letter-spacing: 0.01em;
}

.home-marine-procurement-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
}

.home-marine-procurement-subpanel:not(.is-active) {
  display: none;
}

.home-marine-procurement-tab {
  font-size: clamp(0.74rem, 0.85vw, 0.82rem);
  padding-bottom: 0.3rem;
}

.home-marine-media-empty-wrap {
  grid-column: 1 / -1;
}

.home-marine-media-badge {
  font-size: clamp(0.78rem, 0.88vw, 0.875rem);
  font-weight: 600;
  color: #868e96;
  text-transform: none;
  letter-spacing: 0;
}

.home-marine-media-date {
  font-size: clamp(0.78rem, 0.88vw, 0.875rem);
  font-weight: 500;
  color: #868e96;
}

.home-marine-yt-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
  gap: clamp(0.5rem, 1vw, 0.85rem);
}

.home-marine-yt-grid .yt-card__title {
  font-size: clamp(0.88rem, 1vw, 0.95rem);
}

.yt-card--static {
  cursor: default;
  pointer-events: none;
}

.yt-card--static:hover {
  background-color: transparent;
}

.home-marine-yt-card__media--social {
  background: #0b1220 url("/images/hm-hms-global-04.jpg") center / cover no-repeat;
}

.home-marine-media-card {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  height: 100%;
  color: inherit;
}

.home-marine-media-card--static {
  cursor: default;
}

.home-marine-media-card__thumb {
  display: block;
  width: 100%;
  aspect-ratio: 445 / 260;
  max-height: 248px;
  border-radius: clamp(0.85rem, 1.5vw, 1.1rem);
  overflow: hidden;
  background-color: #0b1220;
  background-size: cover;
  background-position: center;
}

.home-marine-media-card__thumb--1 {
  background-image: url("/images/hm-hms-global-01.jpg");
}

.home-marine-media-card__thumb--2 {
  background-image: url("/images/hm-hms-global-02.jpg");
}

.home-marine-media-card__thumb--3 {
  background-image: url("/images/hm-hms-global-03.jpg");
}

.home-marine-media-card__thumb--4 {
  background-image: url("/images/hm-hms-global-04.jpg");
}

.home-marine-media-card__thumb--photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-marine-media-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.home-marine-media-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
}

.home-marine-media-card__meta .home-marine-media-date {
  border-left: 1px solid #ced4da;
  padding-left: 0.75rem;
  margin-left: 0.15rem;
}

.home-marine-media-card__title {
  font-weight: 800;
  font-size: clamp(1.02rem, 1.18vw, 1.16rem);
  line-height: 1.42;
  letter-spacing: -0.02em;
  color: #111;
}

a.home-marine-media-card:hover .home-marine-media-card__title {
  color: #004080;
}

.home-marine-media-hero {
  width: 100%;
  min-height: clamp(10rem, 28vw, 16rem);
  border-radius: clamp(1.1rem, 1.8vw, 1.45rem);
  overflow: hidden;
  background: #0b1220 url("/images/home-marine-media-hero.jpg") center / cover no-repeat;
  box-shadow: 0 0.45rem 1.65rem rgba(0, 0, 0, 0.1);
}

.home-marine-invest {
  position: relative;
  background: #fafbfc;
}

.home-marine-invest .home-marine-container {
  position: relative;
  z-index: 1;
}

/* HD 마린 메인 투자정보: 좌측 상단 제목 + 우측 리드, 2×2 그리드 + 우측 통합(공시) 카드 */
.home-marine-invest-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem 2.5rem;
  margin-bottom: clamp(1.35rem, 2.8vw, 2rem);
}

.home-marine-invest-header .home-marine-section-title.home-marine-section-title--primary {
  margin-bottom: 0;
}

.home-marine-invest-lead {
  flex: 1 1 280px;
  max-width: 42rem;
  margin: 0;
  font-size: clamp(1rem, 1.22vw, 1.14rem);
  line-height: 1.58;
  color: #4a5562;
  text-align: right;
}

@media (max-width: 767.98px) {
  .home-marine-invest-lead {
    flex-basis: 100%;
    max-width: none;
    text-align: left;
  }
}

.home-marine-invest-grid {
  display: flex;
  flex-direction: column;
  gap: clamp(0.65rem, 1.4vw, 0.9rem);
}

@media (min-width: 992px) {
  .home-marine-invest-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(12.5rem, 1fr) minmax(12.5rem, 1fr);
    gap: clamp(0.65rem, 1.2vw, 0.95rem);
    align-items: stretch;
    min-height: min(28rem, 52vw);
  }

  .home-marine-invest-tile--financial {
    grid-column: 1 / span 2;
    grid-row: 1;
  }

  .home-marine-invest-tile--quote {
    grid-column: 3;
    grid-row: 1 / span 2;
    min-height: 0;
  }

  .home-marine-invest-tile--ir {
    grid-column: 1;
    grid-row: 2;
  }

  .home-marine-invest-tile--gov {
    grid-column: 2;
    grid-row: 2;
  }

  .home-marine-invest-tile--disclosure {
    grid-column: 4;
    grid-row: 1 / span 2;
    min-height: 0;
  }
}

.home-marine-invest-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: clamp(10.5rem, 26vw, 13.5rem);
  padding: 1.2rem 1.15rem 1.1rem;
  border-radius: clamp(1.2rem, 2.2vw, 1.75rem);
  overflow: hidden;
  text-decoration: none;
  box-sizing: border-box;
  isolation: isolate;
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease;
}

.home-marine-invest-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 0.55rem 1.75rem rgba(0, 0, 0, 0.12);
}

/* 사진형 카드(재무정보, 공시/공고) */
.home-marine-invest-tile--photo {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff;
  box-shadow: 0 0.35rem 1.2rem rgba(0, 0, 0, 0.14);
}

.home-marine-invest-tile--photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-color: #0b1220;
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
  transition: transform 0.35s ease;
}

.home-marine-invest-tile--photo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    185deg,
    rgba(4, 8, 14, 0.06) 0%,
    rgba(4, 8, 14, 0.42) 48%,
    rgba(4, 8, 14, 0.84) 100%
  );
}

.home-marine-invest-tile--photo:hover::before {
  transform: scale(1.06);
}

.home-marine-invest-tile--financial::before {
  background-image: url("/images/home-marine-invest-financial-bg.png");
  background-position: center 42%;
}

.home-marine-invest-tile--disclosure::before {
  background-image: url("/images/home-marine-invest-industrial-aerial.png");
  background-position: center 62%;
}

.home-marine-invest-tile__title {
  position: relative;
  z-index: 2;
  font-weight: 800;
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.home-marine-invest-tile--photo .home-marine-invest-tile__title {
  text-shadow: 0 1px 14px rgba(0, 0, 0, 0.4);
}

.home-marine-invest-tile__desc {
  position: relative;
  z-index: 2;
  margin-top: auto;
  padding-top: 1rem;
  font-size: 0.82rem;
  line-height: 1.45;
  max-width: 28rem;
}

.home-marine-invest-tile--photo .home-marine-invest-tile__desc {
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35);
}

/* 밝은 패널(IR, 지배구조, 시세형 Investors) */
.home-marine-invest-tile--panel {
  background: #eef2f6;
  border: 1px solid rgba(15, 20, 28, 0.07);
  color: #101820;
  box-shadow: 0 0.12rem 0.55rem rgba(0, 0, 0, 0.04);
}

.home-marine-invest-tile--panel .home-marine-invest-tile__title {
  font-size: clamp(1rem, 1.35vw, 1.12rem);
}

.home-marine-invest-tile--panel .home-marine-invest-tile__desc {
  color: #5c6570;
  padding-top: 0.75rem;
}

.home-marine-invest-tile--quote {
  justify-content: space-between;
}

.home-marine-invest-quote {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  width: 100%;
  flex: 1;
  min-height: 0;
  justify-content: space-between;
}

.home-marine-invest-quote__brand {
  font-weight: 800;
  font-size: clamp(1rem, 1.25vw, 1.1rem);
  letter-spacing: -0.02em;
}

.home-marine-invest-quote__num {
  flex: 1;
  display: flex;
  align-items: center;
  font-weight: 800;
  font-size: clamp(1.65rem, 3.5vw, 2.35rem);
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: #0f1419;
}

.home-marine-invest-quote__chg {
  font-size: 0.88rem;
  font-weight: 700;
  color: #004080;
}

.home-marine-invest-quote__chg--muted {
  color: #6b7785;
  font-weight: 600;
}

.home-marine-invest-quote__foot {
  padding-top: 0.85rem;
  font-size: 0.72rem;
  color: #868e96;
  line-height: 1.4;
}

.home-marine-contact {
  padding-block: clamp(2.75rem, 5.5vw, 4.5rem) clamp(2.5rem, 5vw, 4rem);
  background: #f4f7fa;
}

.home-marine-contact-box {
  display: flex;
  flex-direction: column;
  gap: clamp(1.75rem, 3.5vw, 2.75rem);
}

/* Contact us 안에 포함되는 News Letter 하위 랜드마크 */
.home-marine-contact-newsletter {
  margin: 0;
  padding: 0;
}

.home-marine-contact-top {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  align-items: center;
  gap: clamp(1.5rem, 3.5vw, 3.25rem);
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-sizing: border-box;
}

.home-marine-contact-visual--single {
  position: relative;
  min-height: clamp(220px, 34vw, 440px);
  border-radius: 0.2rem;
  overflow: hidden;
  background: #eef2f6;
  border: 1px solid #e4e9f0;
  box-sizing: border-box;
}

.home-marine-contact-visual__img {
  position: absolute;
  inset: 0;
  background-color: transparent;
  background-image: var(--rt-contact-hero);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

@media (min-width: 992px) {
  .home-marine-contact-top {
    grid-template-columns: minmax(300px, 0.48fr) minmax(0, 1fr);
    gap: clamp(2rem, 4.5vw, 3.75rem);
  }
}

.home-marine-contact-top__col {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: clamp(1.35rem, 2.5vw, 2rem);
  min-width: 0;
}

.home-marine-contact-top__intro {
  width: 100%;
  max-width: none;
  text-align: left;
}

.home-marine-contact-lead {
  margin-top: 0.85rem;
  font-size: clamp(0.88rem, 1.1vw, 1rem);
  font-weight: 400;
  line-height: 1.55;
  color: #5a6778;
}

.home-marine-contact-lead--tight {
  margin-top: 0.2rem;
}

.home-marine-contact-linkgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem 0.75rem;
  width: 100%;
  max-width: none;
}

.home-marine-contact-linkgrid a,
.home-marine-contact-linkgrid__disabled {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 3.5rem;
  padding: 1rem 1.15rem;
  border-radius: 0.2rem;
  background: #fff;
  border: 1px solid #e8ecf0;
  box-sizing: border-box;
  text-decoration: none;
  color: #111;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: -0.02em;
  box-shadow: 0 1px 3px rgba(15, 20, 25, 0.06);
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}

.home-marine-contact-linkgrid a:hover {
  border-color: #dde3ea;
  background: #fafbfc;
  color: #111;
  box-shadow: 0 4px 14px rgba(15, 20, 25, 0.08);
}

.home-marine-contact-linkgrid__disabled {
  color: #868e96;
  cursor: default;
}

.home-marine-contact-linkgrid__ico {
  flex-shrink: 0;
  width: 0.45rem;
  height: 0.45rem;
  margin-right: 0.2rem;
  border: 0;
  border-radius: 0;
  background: none;
  border-right: 2px solid #ced4da;
  border-bottom: 2px solid #ced4da;
  transform: rotate(-45deg);
}

.home-marine-contact-linkgrid__ico--muted {
  opacity: 0.45;
}

/* ----- News Letter: HD현대마린솔루션 메인 배너형(어두운 오버레이 + 좌 카피 / 우 폼 한 줄) ----- */
.home-marine-newsletter-banner {
  --home-nl-banner-radius: clamp(1.05rem, 2.2vw, 1.65rem);
  position: relative;
  overflow: hidden;
  border-radius: var(--home-nl-banner-radius);
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 0.65rem 2.25rem rgba(8, 12, 20, 0.22);
}

.home-marine-newsletter-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: var(--home-nl-banner-radius);
  clip-path: inset(0 round var(--home-nl-banner-radius));
  background: url("/images/home-marine-media-hero.jpg") no-repeat center / cover;
  pointer-events: none;
}

.home-marine-newsletter-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: var(--home-nl-banner-radius);
  clip-path: inset(0 round var(--home-nl-banner-radius));
  background: linear-gradient(
    105deg,
    rgba(0, 8, 18, 0.78) 0%,
    rgba(0, 12, 28, 0.62) 42%,
    rgba(0, 18, 36, 0.52) 100%
  );
  pointer-events: none;
}

.home-marine-newsletter-banner__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1.5rem, 3.5vw, 3rem);
  padding: clamp(1.75rem, 3.8vw, 3.15rem) clamp(1.35rem, 3.2vw, 4.25rem);
}

.home-marine-newsletter-banner__copy {
  flex: 1 1 260px;
  max-width: min(34rem, 100%);
  color: #fff;
}

.home-marine-newsletter-banner__title {
  margin: 0 0 clamp(0.65rem, 1.4vw, 0.95rem);
  font-size: clamp(1.65rem, 3.1vw, 2.35rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.12;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.home-marine-newsletter-banner__lead {
  margin: 0;
  font-size: clamp(0.95rem, 1.25vw, 1.08rem);
  font-weight: 400;
  line-height: 1.58;
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}

.home-marine-newsletter-banner__form {
  flex: 1 1 320px;
  max-width: min(36rem, 100%);
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.home-marine-newsletter-banner__fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.65rem;
}

.home-marine-newsletter-banner__input {
  flex: 1 1 9.5rem;
  min-width: 0;
  box-sizing: border-box;
  height: 2.65rem;
  min-height: 2.65rem;
  max-height: 2.65rem;
  padding: 0 1.1rem;
  border: none !important;
  border-radius: 999px;
  background: #fff;
  color: #111;
  font-size: 0.92rem;
  line-height: 2.65rem;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65);
}

.home-marine-newsletter-banner__input::placeholder {
  color: #8b95a3;
}

.home-marine-newsletter-banner__input:focus {
  outline: none;
  box-shadow:
    0 0 0 2px rgba(0, 128, 255, 0.45),
    0 1px 0 rgba(255, 255, 255, 0.65);
}

.home-marine-newsletter-banner__submit {
  flex: 0 1 auto;
  box-sizing: border-box;
  height: 2.65rem;
  min-height: 2.65rem;
  max-height: 2.65rem;
  padding: 0 clamp(1.1rem, 2.5vw, 1.65rem);
  border: none;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: -0.02em;
  background: #004080;
  color: #fff;
  white-space: nowrap;
  transition:
    background 0.2s ease,
    transform 0.15s ease;
}

.home-marine-newsletter-banner__submit:hover {
  background: #003066;
  color: #fff;
}

.home-marine-newsletter-banner__note {
  font-size: 0.78rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.72);
}

@media (max-width: 767.98px) {
  .home-marine-contact-top {
    grid-template-columns: 1fr;
    align-items: stretch;
    padding-left: 0;
    padding-right: 0;
  }

  .home-marine-contact-top__col {
    align-items: stretch;
  }

  .home-marine-contact-top__intro {
    text-align: left;
    max-width: none;
  }

  .home-marine-contact-visual--single {
    min-height: clamp(200px, 52vw, 300px);
  }

  .home-marine-contact-linkgrid {
    max-width: none;
  }

  .home-marine-newsletter-banner__inner {
    flex-direction: column;
    align-items: stretch;
  }

  .home-marine-newsletter-banner__fields {
    flex-direction: column;
    align-items: stretch;
  }

  .home-marine-newsletter-banner__input {
    flex: 0 0 auto;
    width: 100%;
    height: 2.75rem;
    min-height: 2.75rem;
    max-height: 2.75rem;
    line-height: 2.75rem;
    font-size: 16px;
  }

  .home-marine-newsletter-banner__submit {
    width: 100%;
    height: 2.75rem;
    min-height: 2.75rem;
    max-height: 2.75rem;
  }
}

@media (max-width: 575.98px) {
  .home-marine-contact-linkgrid {
    grid-template-columns: 1fr;
  }
}

/* 메인 하단: 가족친화기업 인증 띠 */
.home-marine-greeting-cert {
  background: #fff;
  border-top: 1px solid #e8ecf0;
}

@media (max-width: 991.98px) {
  .home-marine-business {
    min-height: 0;
  }

  .home-marine-biz-row {
    flex-direction: column;
    flex: none;
    min-height: 0;
    gap: 0.75rem;
  }

  .home-marine-biz-slot {
    width: 100%;
  }

  .home-marine-biz-card,
  .home-marine-biz-row .home-marine-biz-card.is-biz-expanded {
    flex: none !important;
    width: 100% !important;
    max-width: none !important;
    min-height: clamp(17rem, 42vw, 22rem);
    filter: none !important;
  }

  .home-marine-biz-card__content {
    padding: 1.35rem 1rem 3.25rem;
  }

  .home-marine-biz-card__actions {
    opacity: 1;
    transform: none;
    pointer-events: auto;
    margin-top: 0.85rem;
  }

  .home-marine-biz-card__label {
    font-size: clamp(1.1rem, 3vw, 1.45rem) !important;
  }
}

@media (max-width: 575.98px) {
  .home-marine-biz-card__btn {
    font-size: 0.72rem;
    padding: 0.32rem 0.6rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-marine-biz-card,
  .home-marine-biz-card__media,
  .home-marine-biz-card__actions,
  .home-marine-biz-card__label {
    transition: none !important;
  }

  @media (min-width: 992px) {
    .home-marine-biz-card,
    .home-marine-biz-row .home-marine-biz-card.is-biz-expanded {
      width: 100% !important;
      max-width: none !important;
      filter: none !important;
    }
  }

  .home-marine-biz-card.is-biz-expanded .home-marine-biz-card__media {
    transform: scale(1.03);
  }

  [data-home-marine-motion] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

.footer-below-hero {
  flex-shrink: 0;
}

/* ----- 푸터: HD 마린 계열 밝은 배경 · 인증 띠 (맨 위로는 고정 FAB) ----- */
.site-footer-xite {
  position: relative;
  flex-shrink: 0;
  margin-top: 0;
  padding: 2rem 0 0;
  background-color: #ffffff;
  color: #3d454f;
  border: none;
  border-top: 1px solid #e8ecf0;
}

.site-footer-xite__inner {
  padding-bottom: 2.25rem;
}

.site-footer-xite__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.65rem;
  margin-bottom: 1.65rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  min-width: 0;
}

.site-footer-xite__link {
  color: #3d454f;
  text-decoration: none;
  white-space: nowrap;
}

.site-footer-xite__link:hover {
  color: #0f1419;
  text-decoration: underline;
}

.site-footer-xite__link--primary {
  color: #003087;
  font-weight: 600;
}

.site-footer-xite__link--primary:hover {
  color: #0d6efd;
}

.site-footer-xite__meta {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: #5c6775;
  margin-bottom: 1.35rem;
}

.site-footer-xite__meta p {
  margin: 0 0 0.35rem;
}

.site-footer-xite__meta p:last-child {
  margin-bottom: 0;
}

.site-footer-xite__copy {
  font-size: 0.75rem;
  color: #6b7582;
  letter-spacing: 0.02em;
}

/* 회사소개 하단 인증 띠: HD현대마린솔루션 footer .certi (style.css) — padding 16px 0, gap 24px, 아이콘 48px */
.company-page-certi {
  padding: 1rem 0;
  background-color: #ffffff;
}

.company-page-certi--prefooter {
  border-top: 1px solid #e8ecf0;
  border-bottom: 1px solid #e8ecf0;
}

.content-subpage-main-shell:has(.company-page-certi--prefooter) + footer.site-footer-xite {
  border-top: none;
}

.company-page-certi__inner {
  display: flex;
  justify-content: flex-end;
  padding-left: 0;
  padding-right: 0;
}

.company-page-certi__list {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.5rem;
}

.company-page-certi__link {
  display: block;
  text-decoration: none;
}

.company-page-certi__link:focus-visible {
  outline: 2px solid #0d6efd;
  outline-offset: 3px;
  border-radius: 0.25rem;
}

.company-page-certi__img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* FFSB 제공 img_ci_v2.png: 원형 인증표시, 캔버스 정사각형 기준으로 동그랗게 표시 */
.company-page-certi__img-wrap--ffsb-ci {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #ffffff;
}

.company-page-certi__img-wrap--ffsb-ci .company-page-certi__img--ffsb-ci {
  width: 100%;
  height: 100%;
  flex: none;
  object-fit: cover;
}

.company-page-certi__img {
  display: block;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  object-fit: contain;
}

@media (max-width: 600px) {
  .company-page-certi__list {
    justify-content: flex-end;
  }
}

.site-surface:not(.hero-mode-layout) {
  min-height: auto;
}

.hero-copy {
  max-width: 100%;
}

/* 히어로 문구: 좁은 max-width 제거, 넓게 사용 */
.hero-copy--wide {
  max-width: 100%;
}

/* 설정의 TitleFontSize를 상한으로, 작은 화면에서는 자동 축소 — 배경은 항상 투명 */
.hero-title-lines {
  font-size: clamp(0.95rem, 0.42rem + 1.65vw, var(--hero-title-fs, 2.35rem));
  line-height: 1.12;
  color: var(--hero-title-color, #fff);
  background-color: transparent;
}

/* 두 번째 줄: 위 줄과 간격 (메인 타이틀 라인 간) */
.hero-title-lines .hero-title-line + .hero-title-line {
  margin-top: 0.12rem !important;
}

.hero-subtitle {
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.22;
}

.hero-subtitle .hero-subtitle-line + .hero-subtitle-line {
  margin-top: 0.08rem;
}

/* ----- 홈: 상단 메뉴 고정 + 기본 투명, 마우스 호버 시 흰 배경 ----- */
header.hero-header-sticky {
  z-index: 1030;
}

/* ----- 스크롤 방향: 아래로 내리면 GNB 위로 숨김, 위로 올리면 다시 표시 ----- */
header.site-header {
  transform: translateY(0);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
  header.site-header {
    transition-duration: 0.01ms;
  }
}

body.site-header--scroll-hidden header.site-header {
  transform: translateY(-102%);
  pointer-events: none;
}

/* 개인정보 등 밝은 GNB: sticky로 두어 숨김 시 레이아웃이 자연스럽게 */
header.site-header:not(.hero-header-sticky) {
  position: sticky;
  top: 0;
  z-index: 1030;
}

.hero-navbar-transparent {
  background-color: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
  transition:
    background-color 0.2s ease,
    box-shadow 0.2s ease;
}

/*
 * 고체 GNB: 히어로 하단 통과 후(site-header--gnb-solid-scroll), 또는
 * 히어로 없는 벤더 PDP(content-subpage--solid-gnb) — 흰 본문 위 흰 글씨 방지.
 */
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent.navbar {
  background-color: #fff !important;
  border-bottom: none !important;
  box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.08);
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .navbar-brand,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .navbar-brand:visited {
  color: #212529 !important;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent a.nav-link.hero-nav-on-video,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent a.nav-link.hero-nav-on-video:visited,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent button.main-nav-dd-toggle.hero-nav-on-video {
  color: #212529 !important;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .main-nav-section--skarpenord > .nav-link.hero-nav-on-video {
  color: var(--skarpenord-brand-text, #007678) !important;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .main-nav-lang {
  color: #212529;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .main-nav-lang-item--muted {
  opacity: 0.55;
  color: #6c757d;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .main-nav-lang-sep {
  color: #adb5bd !important;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .navbar-toggler {
  border-color: rgba(0, 0, 0, 0.18);
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
) .hero-navbar-transparent .navbar-toggler-icon {
  filter: invert(1) brightness(0.22);
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent:has(.navbar-brand-logo-pair)
  .navbar-brand-logo-pair
  .navbar-brand-logo-img--base {
  opacity: 0;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent:has(.navbar-brand-logo-pair)
  .navbar-brand-logo-pair
  .navbar-brand-logo-img--hover {
  opacity: 1;
  pointer-events: none;
}

/* HD 마린솔루션형: 탑바 상하 여백 (전체 폭은 유지, 안쪽만 캡) */
@media (min-width: 992px) {
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent.navbar {
    padding-top: 1.05rem;
    padding-bottom: 1.05rem;
  }

  .navbar .main-nav-container {
    max-width: min(1580px, 100%);
    margin-left: auto;
    margin-right: auto;
  }
}

.navbar-light.navbar:not(.hero-navbar-transparent) {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* _Layout.cshtml.css 의 전역 a 색 등보다 우선 — 영상 위: 로고·GNB 기본 굵은 흰색 */
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .navbar-brand,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .navbar-brand:visited {
  color: #fff !important;
  font-weight: 700;
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent a.nav-link.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent a.nav-link.hero-nav-on-video:visited,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent button.main-nav-dd-toggle.hero-nav-on-video {
  color: #fff !important;
  font-weight: 700 !important;
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .main-nav-section--skarpenord > .nav-link.hero-nav-on-video {
  color: var(--skarpenord-accent, #57babe) !important;
}

/* ----- 콘텐츠 서브페이지: 상단 히어로(배경 + 제목) — HD Xite 계열 레이아웃 ----- */
/* HD 서브 히어로 대비: 짧은 문서도 동일한 세로 리듬(공통 min-height + clamp) */
.content-page-hero {
  position: relative;
  min-height: clamp(15rem, 36vw, 22rem);
  background-color: #0b1220;
  overflow: hidden;
}

@media (min-width: 768px) {
  .content-page-hero {
    min-height: clamp(17.5rem, 30vw, 26rem);
  }
}

@media (min-width: 1200px) {
  .content-page-hero {
    min-height: clamp(19rem, 26vw, 28rem);
  }
}

.content-page-hero--gradient {
  background-image:
    radial-gradient(ellipse 120% 80% at 20% 20%, rgba(93, 173, 226, 0.22), transparent 55%),
    radial-gradient(ellipse 90% 70% at 85% 60%, rgba(0, 64, 128, 0.35), transparent 50%),
    linear-gradient(115deg, #070d18 0%, #0f1c2e 38%, #152a45 62%, #0b1220 100%);
  background-size: cover;
  background-position: center;
}

.content-page-hero--photo {
  background-color: #0b1220;
  background-image:
    linear-gradient(to bottom, rgba(6, 12, 24, 0.55), rgba(6, 12, 24, 0.82)),
    var(--content-hero-photo);
  background-size: cover;
  background-position: center;
}

.content-page-hero__scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.25), transparent 45%);
}

.content-page-hero__inner {
  z-index: 1;
}

.content-page-hero__eyebrow {
  letter-spacing: 0.06em;
}

.content-page-hero__title {
  font-size: clamp(1.65rem, 1.2rem + 2.2vw, 2.35rem);
  line-height: 1.2;
  text-shadow: 0 0.1rem 0.45rem rgba(0, 0, 0, 0.35);
}

/* HD 마린솔루션형: 풀폭 사진 히어로 + 중앙 타이포 + 하단 물결 + 녹색 포인트 */
.content-page-hero--marine {
  position: relative;
  min-height: clamp(22rem, 52vh, 40rem);
  overflow: visible;
  --content-hero-wave-navy: #2a6eb8;
  --content-hero-wave-white: #fff;
}

.content-page-hero--marine.content-page-hero--photo {
  background-position: center center;
}

.content-page-hero__scrim--marine {
  background: linear-gradient(
    to bottom,
    rgba(14, 20, 36, 0.38) 0%,
    rgba(10, 16, 30, 0.55) 42%,
    rgba(6, 12, 24, 0.82) 100%
  );
}

body.content-subpage .content-page-hero--marine {
  padding-bottom: 0;
}

body.content-subpage .content-page-hero__inner--marine {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: clamp(1.75rem, 5vh, 3rem);
  padding-bottom: clamp(4rem, 12vh, 6.5rem);
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
}

.content-page-hero__marine-kicker {
  letter-spacing: 0.14em;
  font-size: 0.78rem;
}

.content-page-hero__marine-headline {
  font-size: clamp(1.45rem, 0.85rem + 2.6vw, 2.75rem);
  line-height: 1.22;
  letter-spacing: -0.04em;
  text-shadow: 0 0.2rem 1.35rem rgba(0, 0, 0, 0.5);
}

.content-page-hero__marine-headline-line + .content-page-hero__marine-headline-line {
  margin-top: 0.35rem;
}

.content-page-hero__marine-headline--single {
  font-size: clamp(1.55rem, 1rem + 2.4vw, 2.5rem);
  line-height: 1.22;
  letter-spacing: -0.035em;
}

.content-page-hero__marine-sub {
  max-width: 40rem;
}

.content-page-hero__marine-sub-p {
  font-size: clamp(0.88rem, 0.82rem + 0.35vw, 1.05rem);
  line-height: 1.7;
}

.content-page-hero__marine-sub-p:last-child {
  margin-bottom: 0 !important;
}

.content-page-hero__wave-wrap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  line-height: 0;
  pointer-events: none;
  overflow: hidden;
}

.content-page-hero__wave-svg {
  display: block;
  width: 100%;
  height: clamp(4.25rem, 11vw, 7.75rem);
  vertical-align: bottom;
}

.content-page-hero__wave-layer--navy {
  fill: var(--content-hero-wave-navy);
}

.content-page-hero__wave-layer--white {
  fill: var(--content-hero-wave-white);
  filter: drop-shadow(0 -0.12rem 0.55rem rgba(18, 72, 130, 0.16));
}

/* 구버전 단일 path 호환(다른 뷰에서 쓸 경우) */
.content-page-hero__wave-fill {
  fill: var(--content-hero-wave-navy);
}

.content-page-hero__wave-pluses {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(3.35rem, 8.5vw, 6rem);
  display: flex;
  justify-content: space-between;
  padding: 0 5%;
  z-index: 3;
}

.content-page-hero__wave-plus {
  color: #12f0a8;
  font-size: clamp(0.8rem, 0.7rem + 0.45vw, 1.1rem);
  font-weight: 800;
  line-height: 1;
  text-shadow: 0 0.06rem 0.4rem rgba(0, 0, 0, 0.45);
  user-select: none;
}

body.content-subpage .site-surface {
  background-color: #fff;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

/* 서브페이지 본문: HD 마린솔루션 등 참고 사이트에 가깝게 한글 웹폰트 */
body.content-subpage {
  font-family:
    "Noto Sans KR",
    system-ui,
    -apple-system,
    "Segoe UI",
    "Apple SD Gothic Neo",
    "Malgun Gothic",
    sans-serif;
}

/* 고정 GNB 아래로 히어로·제목이 가리지 않게(배경은 뷰포트 상단까지 유지) */
body.content-subpage .content-page-hero {
  box-sizing: border-box;
  padding-top: var(--site-header-h);
}

body.content-subpage .content-subpage-main-shell {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  overflow-anchor: none;
}

/*
 * 고정 GNB(content-subpage): 히어로가 없으면 본문 크롬이 헤더 아래에서 시작.
 * Danfoss 품목 상세 등 — page-nav-rail·섹션 탭이 탑 메뉴와 겹치지 않게.
 */
body.content-subpage .content-subpage-main-shell:not(:has(> .content-page-hero)) {
  padding-top: var(--site-header-h);
  box-sizing: border-box;
}

/* 브레드크럼(홈·대메뉴) — GNB 바로 아래 층, 스크롤 시 sticky */
body.content-subpage .content-subpage-page-chrome {
  position: relative;
  z-index: 1025;
  flex-shrink: 0;
  background-color: #fff;
}

body.content-subpage .content-subpage-page-chrome .page-nav-rail--fullbleed {
  position: sticky;
  top: var(--site-header-h);
  z-index: 1025;
  margin-bottom: 0;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}

/* 히어로 다음 브레드크럼: 히어로와 겹치지 않게(히어로가 이미 GNB 패딩 포함) */
body.content-subpage .content-page-hero + .content-subpage-page-chrome .page-nav-rail--fullbleed {
  top: var(--site-header-h);
}

body.content-subpage .content-page-hero__inner:not(.content-page-hero__inner--marine) {
  padding-top: 2.35rem;
  padding-bottom: 3.15rem;
}

@media (min-width: 768px) {
  body.content-subpage .content-page-hero__inner:not(.content-page-hero__inner--marine) {
    padding-top: 2.85rem;
    padding-bottom: 3.85rem;
  }
}

@media (min-width: 1200px) {
  body.content-subpage .content-page-hero__inner:not(.content-page-hero__inner--marine) {
    padding-top: 3.15rem;
    padding-bottom: 4.35rem;
  }
}

body.content-subpage .content-subpage-main {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding-top: 1.75rem !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

/*
 * 인사말: HD 마린처럼 본문 블록을 뷰포트 가운데에 모음(과도한 좌우 퍼짐 방지).
 * 전체 폭을 한 덩어리로 제한 + 좌우 여백은 바깥에 둠.
 */
body.content-subpage .content-subpage-main--ceo-greeting {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .content-page-body {
  flex: 1 1 auto;
  min-height: clamp(16rem, 38vh, 32rem);
}

/*
 * 인사말: 좌열 사진 + 하단 직함·이름 / 우열 인사·본문 + 하단 대표 서명
 * 상위 main이 이미 max 1180px이므로 본문은 가득 채우되, 열 간격은 좁혀 한 덩어리로.
 */
body.content-subpage .ceo-greeting.content-page-body {
  max-width: 100%;
  margin-inline: auto;
  width: 100%;
}

body.content-subpage .ceo-greeting__grid {
  display: grid;
  gap: clamp(1.75rem, 3.5vw, 2.75rem);
  align-items: start;
}

@media (min-width: 992px) {
  body.content-subpage .ceo-greeting__grid {
    grid-template-columns: minmax(16.5rem, 21.5rem) minmax(0, 1fr);
    gap: clamp(2.5rem, 4.5vw, 4rem);
  }
}

body.content-subpage .ceo-greeting__portrait-col {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: clamp(1.15rem, 2.8vw, 1.6rem);
  min-width: 0;
}

/* HD 마린 인사말형: 좌열 상단 페이지 타이틀 */
body.content-subpage .ceo-greeting__page-title {
  margin: 0 0 clamp(0.85rem, 2.2vw, 1.25rem);
  padding: 0;
  font-size: clamp(2rem, 3.6vw, 2.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f1419;
  line-height: 1.12;
}

body.content-subpage .ceo-greeting__caption {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

/* 인물 사진: 외곽선·그림자·베벨 없음 */
body.content-subpage .ceo-greeting__photo-frame {
  margin: 0;
  padding: 0;
  border: none;
  /* 흰 바탕 + 로버스텍 내비 로고의 원형 마커(추출 PNG) — HD 인사말 녹색 쉐브론 자리 */
  background-color: #fff;
  background-image: url("/images/robustech-logo-circle-marker.png");
  background-repeat: no-repeat;
  background-position: 86% 40%;
  background-size: clamp(9.5rem, 58%, 14.5rem) auto;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  max-width: 22rem;
  width: 100%;
}

@media (min-width: 992px) {
  body.content-subpage .ceo-greeting__photo-frame {
    max-width: none;
  }
}

body.content-subpage .ceo-greeting__photo-img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: top;
}

body.content-subpage .ceo-greeting__role {
  margin: 0;
  font-size: clamp(0.97rem, 1.15vw, 1.05rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #5c656f;
  line-height: 1.5;
}

body.content-subpage .ceo-greeting__caption .ceo-greeting__name {
  margin: 0;
}

body.content-subpage .ceo-greeting__name {
  font-size: clamp(1.65rem, 2.85vw, 2.1rem);
  font-weight: 700;
  color: #1a1f26;
  line-height: 1.25;
}

body.content-subpage .ceo-greeting__copy {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

body.content-subpage .ceo-greeting__body {
  flex: 1 1 auto;
}

body.content-subpage .ceo-greeting__opening {
  margin: 0;
  font-size: clamp(1.45rem, 2.75vw, 2.05rem);
  font-weight: 700;
  color: #1a1f26;
  line-height: 1.36;
  letter-spacing: -0.025em;
}

body.content-subpage .ceo-greeting__opening + .ceo-greeting__opening {
  margin-top: 0.15rem;
}

body.content-subpage .ceo-greeting__opening + .ceo-greeting__tagline {
  margin-top: clamp(1.35rem, 2.8vw, 1.85rem);
}

body.content-subpage .ceo-greeting__tagline {
  margin: 0;
  font-size: clamp(1.12rem, 1.65vw, 1.38rem);
  font-weight: 700;
  color: #1a1f26;
  line-height: 1.52;
  letter-spacing: -0.02em;
}

body.content-subpage .ceo-greeting__tagline + .ceo-greeting__tagline {
  margin-top: 0.12rem;
}

body.content-subpage .ceo-greeting__tagline + .ceo-greeting__body-p {
  margin-top: clamp(1.85rem, 3.8vw, 2.65rem);
}

body.content-subpage .ceo-greeting__body-p {
  margin: 0 0 1.05rem;
  font-size: clamp(1.03rem, 1.2vw, 1.125rem);
  font-weight: 400;
  color: #3d454f;
  line-height: 1.92;
}

/* HD 마린 인사말형: 본문을 읽을수록 약간 더 밝은 회색 톤으로 전환 */
body.content-subpage .ceo-greeting__body-p--tone-1 {
  color: #454d57;
}

body.content-subpage .ceo-greeting__body-p--tone-2 {
  color: #4d5560;
}

body.content-subpage .ceo-greeting__body-p--tone-3 {
  color: #565e68;
}

body.content-subpage .ceo-greeting__body-p--tone-4 {
  color: #5f6771;
}

body.content-subpage .ceo-greeting__signature {
  margin: clamp(2.25rem, 5.5vh, 3.25rem) 0 0;
  padding-top: clamp(0.5rem, 2vh, 1rem);
  font-size: clamp(1.03rem, 1.2vw, 1.125rem);
  font-weight: 700;
  color: #1a1f26;
  line-height: 1.65;
  text-align: left;
}

/* ----- 가치체계: HD 마린 value-system (MISSION → VISION → CORE VALUE) -----
 * 참고: https://www.hd-marinesolution.com/kr/company/about/value-system/contents
 */
body.content-subpage .content-subpage-main--value-system-marine {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .value-system-marine.content-page-body {
  max-width: 100%;
}

body.content-subpage .value-system-marine__mission {
  background: linear-gradient(180deg, #f5f7fa 0%, #eef1f5 100%);
  margin-inline: calc(-1 * clamp(0.85rem, 2.2vw, 1.5rem));
  padding: clamp(2.25rem, 5vh, 3.5rem) clamp(1.25rem, 4vw, 2.5rem);
  text-align: center;
}

body.content-subpage .value-system-marine__eyebrow {
  margin: 0 0 0.85rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  color: #5c6775;
  text-transform: uppercase;
}

body.content-subpage .value-system-marine__mission-headline {
  margin: 0 auto;
  max-width: 42rem;
  font-size: clamp(1.5rem, 3.2vw, 2.35rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.35;
  color: #0f1419;
}

body.content-subpage .value-system-marine__vision {
  padding: clamp(2.75rem, 6vh, 4rem) 0 clamp(0.5rem, 2vh, 1rem);
}

body.content-subpage .value-system-marine__vision .value-system-marine__eyebrow {
  text-align: center;
}

body.content-subpage .value-system-marine__vision-lead {
  margin: 0 auto 2.25rem;
  max-width: 36rem;
  text-align: center;
  font-size: clamp(1.2rem, 2.4vw, 1.65rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.45;
  color: #1a1f26;
}

body.content-subpage .value-system-marine__pillar-grid {
  display: grid;
  gap: clamp(1.35rem, 3vw, 2.25rem);
}

@media (min-width: 992px) {
  body.content-subpage .value-system-marine__pillar-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.content-subpage .value-system-marine__pillar {
  border-top: 2px solid #0d6efd;
  padding-top: 1.25rem;
}

body.content-subpage .value-system-marine__pillar-title {
  margin: 0 0 0.75rem;
  font-size: clamp(1.05rem, 1.35vw, 1.2rem);
  font-weight: 700;
  color: #141a22;
  line-height: 1.35;
}

body.content-subpage .value-system-marine__pillar-body {
  margin: 0;
  font-size: clamp(0.98rem, 1.1vw, 1.05rem);
  font-weight: 400;
  color: #4a5360;
  line-height: 1.82;
}

body.content-subpage .value-system-marine__core {
  padding: clamp(2.5rem, 5.5vh, 3.75rem) 0 0;
  border-top: 1px solid #e2e6eb;
}

body.content-subpage .value-system-marine__core .value-system-marine__eyebrow {
  margin-bottom: 1.75rem;
}

body.content-subpage .value-system-marine__core-grid {
  display: grid;
  gap: clamp(1.5rem, 3.2vw, 2.25rem);
}

@media (min-width: 768px) {
  body.content-subpage .value-system-marine__core-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body.content-subpage .value-system-marine__core-title {
  margin: 0 0 0.6rem;
  font-size: clamp(1.08rem, 1.4vw, 1.22rem);
  font-weight: 700;
  color: #141a22;
  line-height: 1.35;
}

body.content-subpage .value-system-marine__core-body {
  margin: 0;
  font-size: clamp(0.97rem, 1.1vw, 1.04rem);
  color: #4a5360;
  line-height: 1.8;
}

/* ----- CI: HD 마린 company/about/ci 형 (리드 → 다운로드 → 컬러 → 여백 → 로고형 → 원칙 → 서체) -----
 * 참고: https://www.hd-marinesolution.com/kr/company/about/ci/contents
 */
body.content-subpage .content-subpage-main--marine-ci {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .ci-marine.content-page-body {
  max-width: 100%;
}

body.content-subpage .ci-marine__intro {
  padding-bottom: clamp(1.75rem, 4vh, 2.5rem);
  border-bottom: 1px solid #e8ecf0;
}

body.content-subpage .ci-marine__kicker {
  margin: 0 0 1rem;
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.3;
  color: #0f1419;
}

body.content-subpage .ci-marine__intro-p {
  margin: 0 0 1rem;
  max-width: 52rem;
  font-size: clamp(1.02rem, 1.2vw, 1.12rem);
  line-height: 1.85;
  color: #3d454f;
}

body.content-subpage .ci-marine__intro-p:last-child {
  margin-bottom: 0;
}

body.content-subpage .ci-marine__key {
  padding: clamp(2.25rem, 5vh, 3.25rem) 0;
}

body.content-subpage .ci-marine__key-lines {
  margin-bottom: clamp(1.5rem, 3vh, 2rem);
}

body.content-subpage .ci-marine__key-line {
  margin: 0;
  font-size: clamp(1.85rem, 4.5vw, 3.1rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: #0f1419;
}

body.content-subpage .ci-marine__downloads {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
}

body.content-subpage .ci-marine__downloads--font {
  margin-top: 1rem;
}

body.content-subpage .ci-marine__download-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1.15rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #0f1419;
  text-decoration: none;
  border: 1px solid #c5ccd4;
  border-radius: 2px;
  background: #fff;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

body.content-subpage .ci-marine__download-btn:hover {
  background: #f4f7fa;
  border-color: #0d6efd;
  color: #0b5ed7;
}

body.content-subpage .ci-marine__section-title {
  margin: 0 0 0.65rem;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f1419;
}

body.content-subpage .ci-marine__section-lead,
body.content-subpage .ci-marine__font-lead {
  margin: 0 0 1.5rem;
  max-width: 48rem;
  font-size: clamp(0.98rem, 1.15vw, 1.06rem);
  line-height: 1.82;
  color: #4a5360;
}

body.content-subpage .ci-marine__colors {
  padding: clamp(2rem, 4.5vh, 2.75rem) 0;
  border-top: 1px solid #e8ecf0;
}

body.content-subpage .ci-marine__chip-grid {
  display: grid;
  gap: clamp(1.25rem, 2.5vw, 1.75rem);
  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
}

body.content-subpage .ci-marine__chip {
  border: 1px solid #e2e6eb;
  border-radius: 4px;
  padding: 1rem 1rem 1.1rem;
  background: #fff;
}

body.content-subpage .ci-marine__swatch {
  height: 4.25rem;
  border-radius: 3px;
  margin-bottom: 0.85rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

body.content-subpage .ci-marine__chip-name {
  margin: 0 0 0.65rem;
  font-size: 1rem;
  font-weight: 700;
  color: #141a22;
}

body.content-subpage .ci-marine__chip-spec {
  margin: 0;
  font-size: 0.78rem;
  color: #4a5360;
}

body.content-subpage .ci-marine__chip-row {
  display: grid;
  grid-template-columns: 4.2rem 1fr;
  gap: 0.15rem 0.5rem;
  margin-bottom: 0.25rem;
}

body.content-subpage .ci-marine__chip-row dt {
  margin: 0;
  font-weight: 600;
  color: #5c6670;
}

body.content-subpage .ci-marine__chip-row dd {
  margin: 0;
}

body.content-subpage .ci-marine__clearspace {
  padding: clamp(2rem, 4.5vh, 2.75rem) 0;
  border-top: 1px solid #e8ecf0;
}

body.content-subpage .ci-marine__clear-body {
  margin: 0;
  max-width: 48rem;
  font-size: clamp(0.98rem, 1.12vw, 1.05rem);
  line-height: 1.82;
  color: #4a5360;
}

body.content-subpage .ci-marine__variants {
  padding: clamp(2rem, 4.5vh, 2.75rem) 0;
  border-top: 1px solid #e8ecf0;
}

body.content-subpage .ci-marine__variant-grid {
  display: grid;
  gap: clamp(1.25rem, 3vw, 2rem);
}

@media (min-width: 768px) {
  body.content-subpage .ci-marine__variant-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body.content-subpage .ci-marine__variant-card {
  margin: 0;
}

body.content-subpage .ci-marine__variant-title {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #141a22;
}

body.content-subpage .ci-marine__variant-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 10rem;
  padding: 1.5rem;
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f6 100%);
  border: 1px solid #e2e6eb;
  border-radius: 4px;
}

body.content-subpage .ci-marine__variant-img {
  max-width: 100%;
  max-height: 6rem;
  width: auto;
  height: auto;
  object-fit: contain;
}

body.content-subpage .ci-marine__principles {
  padding: clamp(2rem, 4.5vh, 2.75rem) 0;
  border-top: 1px solid #e8ecf0;
}

body.content-subpage .ci-marine__principle-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: clamp(1.5rem, 3vw, 2rem);
}

@media (min-width: 992px) {
  body.content-subpage .ci-marine__principle-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.content-subpage .ci-marine__principle {
  display: flex;
  gap: 1rem;
  margin: 0;
}

body.content-subpage .ci-marine__principle-num {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  font-weight: 800;
  color: #fff;
  background: #0d6efd;
  border-radius: 50%;
}

body.content-subpage .ci-marine__principle-body {
  min-width: 0;
}

body.content-subpage .ci-marine__principle-title {
  margin: 0 0 0.25rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f1419;
}

body.content-subpage .ci-marine__principle-sub {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5c6775;
}

body.content-subpage .ci-marine__principle-text {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.75;
  color: #4a5360;
}

body.content-subpage .ci-marine__font {
  padding: clamp(2rem, 4.5vh, 2.75rem) 0 0;
  border-top: 1px solid #e8ecf0;
}

/* ----- 조직도: HD 마린형(박스·라인·전원 배지) -----
 * 레퍼런스: 제공 조직도(대표이사 — QA/QC·R&D — CS — 4본부 — 하위팀).
 */
body.content-subpage .content-subpage-main--marine-organization {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .org-chart-marine.content-page-body {
  max-width: 100%;
  --org-fs-xs: 0.76rem;
  --org-fs-sm: 0.86rem;
  --org-fs-md: 0.94rem;
  --org-fs-lg: 1.02rem;
  --org-fs-xl: 1.12rem;
  --org-fs-2xl: 1.22rem;
}

body.content-subpage .org-chart-marine__canvas {
  --org-line: #003087;
  --org-line-width: 2px;
  --org-parent-bg: #e3ebf7;
  --org-parent-border: rgba(0, 48, 135, 0.22);
  --org-child-bg: #f4f7fb;
  --org-child-border: rgba(0, 48, 135, 0.1);
  position: relative;
  padding-top: clamp(2.5rem, 5vh, 3.25rem);
  padding-bottom: clamp(1rem, 2vh, 1.5rem);
  overflow: visible;
}

body.content-subpage .org-chart-marine__guide {
  margin-bottom: clamp(1rem, 2vh, 1.35rem);
  padding: 0.75rem 1rem;
  font-size: clamp(0.9rem, 1.04vw, 0.98rem);
  line-height: 1.55;
  color: #4a5564;
  background: #f7f9fc;
  border-left: 3px solid #003087;
}

body.content-subpage .org-chart-marine__badge {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0.45rem 1.1rem;
  font-size: clamp(0.9rem, 1.08vw, 1rem);
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #003087;
  background: #fff;
  border: 1px solid #d8dee6;
  border-radius: 999px;
  box-shadow: 0 1px 0 rgba(15, 20, 25, 0.04);
}

body.content-subpage .org-chart-marine__tier {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: clamp(0.5rem, 1.5vw, 1rem);
}

body.content-subpage .org-chart-marine__tier--ceo .org-chart-marine__box {
  min-width: min(100%, 14rem);
}

body.content-subpage .org-chart-marine__vbar {
  width: var(--org-line-width);
  margin-inline: auto;
  background: var(--org-line);
  border-radius: 1px;
  flex-shrink: 0;
}

body.content-subpage .org-chart-marine__vbar--short {
  height: clamp(0.85rem, 1.8vh, 1.15rem);
}

body.content-subpage .org-chart-marine__vbar--mid {
  height: clamp(1rem, 2.2vh, 1.35rem);
}

body.content-subpage .org-chart-marine__vbar--rnd {
  height: clamp(1.35rem, 2.8vh, 1.85rem);
}

body.content-subpage .org-chart-marine__tier--qa-rd {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(1.5rem, 4vw, 2.25rem) minmax(0, 1fr);
  align-items: stretch;
  gap: clamp(0.35rem, 1.2vw, 0.65rem);
  margin-top: 0;
}

body.content-subpage .org-chart-marine__joiner {
  position: relative;
  min-height: clamp(3.5rem, 8vh, 4.75rem);
}

body.content-subpage .org-chart-marine__joiner-cap {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  background: var(--org-line);
  border-radius: 1px;
}

body.content-subpage .org-chart-marine__joiner-stem {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  transform: translateX(-50%);
  background: var(--org-line);
  border-radius: 1px;
}

body.content-subpage .org-chart-marine__tier--cs .org-chart-marine__box {
  min-width: min(100%, 12rem);
}

body.content-subpage .org-chart-marine__layer {
  width: 100%;
  padding: clamp(0.65rem, 1.5vw, 0.85rem);
  border: 1px solid rgba(0, 48, 135, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

body.content-subpage .org-chart-marine__layer--face {
  background: rgba(227, 235, 247, 0.35);
}

body.content-subpage .org-chart-marine__layer--spine {
  background: rgba(0, 48, 135, 0.05);
  border-color: rgba(0, 48, 135, 0.14);
}

body.content-subpage .org-chart-marine__layer--tech {
  background: rgba(244, 247, 251, 0.85);
}

body.content-subpage .org-chart-marine__layer--rnd {
  background: rgba(244, 247, 251, 0.55);
  border-color: rgba(0, 48, 135, 0.12);
  margin-top: 0;
}

body.content-subpage .org-chart-marine__layer-label {
  margin: 0 0 clamp(0.55rem, 1.2vw, 0.75rem);
  padding: 0.35rem 0.75rem;
  font-size: clamp(0.8rem, 0.98vw, 0.88rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  color: #003087;
  background: rgba(0, 48, 135, 0.06);
  border-radius: 999px;
}

body.content-subpage .org-chart-marine__layer--spine .org-chart-marine__layer-label {
  background: rgba(0, 48, 135, 0.1);
}

body.content-subpage .org-chart-marine__layer--tech .org-chart-marine__layer-label {
  background: rgba(0, 48, 135, 0.04);
}

body.content-subpage .org-chart-marine__tier--face {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.85rem, 2vw, 1.25rem);
  align-items: stretch;
}

body.content-subpage .org-chart-marine__tier--face > .org-chart-marine__dept-col {
  height: 100%;
}

body.content-subpage .org-chart-marine__tier--face > .org-chart-marine__dept-col .org-chart-marine__branch {
  flex: 1;
  min-height: 100%;
}

body.content-subpage .org-chart-marine__tier--face > .org-chart-marine__dept-col .org-chart-marine__branch-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

body.content-subpage .org-chart-marine__tier--face > .org-chart-marine__dept-col .org-chart-marine__children-grid {
  flex: 1;
  align-content: start;
}

body.content-subpage .org-chart-marine__tier--spine {
  display: flex;
  justify-content: center;
  align-items: stretch;
  max-width: min(100%, 42rem);
  margin-inline: auto;
}

body.content-subpage .org-chart-marine__tier--spine > .org-chart-marine__dept-col {
  width: 100%;
  max-width: 42rem;
}

body.content-subpage .org-chart-marine__tier--spine > .org-chart-marine__dept-col .org-chart-marine__branch {
  flex: 1;
  min-height: 100%;
}

body.content-subpage .org-chart-marine__tier--spine > .org-chart-marine__dept-col .org-chart-marine__branch-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

body.content-subpage .org-chart-marine__tier--spine > .org-chart-marine__dept-col .org-chart-marine__children-grid {
  flex: 1;
  align-content: start;
}

body.content-subpage .org-chart-marine__tier--tech {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.85rem, 2vw, 1.25rem);
  align-items: stretch;
}

@media (min-width: 992px) {
  body.content-subpage .org-chart-marine__tier--tech {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.content-subpage .org-chart-marine__tier--tech > .org-chart-marine__dept-col:not(.org-chart-marine__dept-col--rnd) {
  height: 100%;
}

body.content-subpage .org-chart-marine__tier--tech > .org-chart-marine__dept-col:not(.org-chart-marine__dept-col--rnd) .org-chart-marine__branch {
  flex: 1;
  min-height: 100%;
}

body.content-subpage .org-chart-marine__tier--tech > .org-chart-marine__dept-col:not(.org-chart-marine__dept-col--rnd) .org-chart-marine__branch-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

body.content-subpage .org-chart-marine__tier--tech > .org-chart-marine__dept-col:not(.org-chart-marine__dept-col--rnd) .org-chart-marine__children-grid {
  flex: 1;
  align-content: start;
}

body.content-subpage .org-chart-marine__dept-col--rnd {
  width: 100%;
  align-self: stretch;
}

body.content-subpage .org-chart-marine__tier--rnd {
  width: 100%;
  margin-top: 0;
}

body.content-subpage .org-chart-marine__branch--rnd {
  width: 100%;
  position: relative;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__branch-head {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__unit {
  width: 100%;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__branch-head .org-chart-marine__roster {
  min-height: 3.55rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__branch-head .org-chart-marine__member-entry--head {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__branch-head .org-chart-marine__member-chip--head {
  min-height: 2.85rem;
  box-sizing: border-box;
}

body.content-subpage .org-chart-marine__branch-body--rnd {
  padding: 0.85rem 0.55rem 0.6rem;
}

body.content-subpage .org-chart-marine__branch--rnd .org-chart-marine__roster--team {
  margin-top: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

body.content-subpage .org-chart-marine__dept-col {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
}

body.content-subpage .org-chart-marine__branch {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border: 1px solid var(--org-parent-border);
  border-radius: 8px;
  overflow: visible;
  box-shadow: 0 2px 8px rgba(0, 48, 135, 0.06);
  min-height: 0;
}

body.content-subpage .org-chart-marine__branch-head {
  padding: 0.55rem 0.55rem 0.65rem;
  background: linear-gradient(180deg, var(--org-parent-bg) 0%, #d7e2f2 100%);
  border-radius: 8px 8px 0 0;
}

body.content-subpage .org-chart-marine__branch-connector {
  display: none;
}

body.content-subpage .org-chart-marine__branch-connector[data-child-count="2"] {
  --org-child-cols: 2;
}

body.content-subpage .org-chart-marine__branch-connector-stem {
  position: absolute;
  left: 50%;
  top: 0;
  width: var(--org-line-width);
  height: 100%;
  background: var(--org-line);
  transform: translateX(-50%);
}

body.content-subpage .org-chart-marine__branch-connector-rail {
  position: absolute;
  left: calc(100% / (2 * var(--org-child-cols, 3)));
  right: calc(100% / (2 * var(--org-child-cols, 3)));
  bottom: 0;
  height: var(--org-line-width);
  background: var(--org-line);
}

body.content-subpage .org-chart-marine__branch-body {
  --org-child-cols: 3;
  padding: 0.85rem 0.55rem 0.6rem;
  background: var(--org-child-bg);
  border-top: 1px solid var(--org-child-border);
  border-radius: 0 0 8px 8px;
}

body.content-subpage .org-chart-marine__branch-body[data-child-count="2"] {
  --org-child-cols: 2;
}

body.content-subpage .org-chart-marine__children-grid {
  display: grid;
  grid-template-columns: repeat(var(--org-child-cols, 3), minmax(0, 1fr));
  gap: 0.6rem;
  align-items: start;
}

body.content-subpage .org-chart-marine__node--child > .org-chart-marine__unit {
  height: 100%;
  display: flex;
  flex-direction: column;
}

body.content-subpage .org-chart-marine__node--child > .org-chart-marine__unit > .org-chart-marine__box--child {
  flex: 0 0 auto;
}

body.content-subpage .org-chart-marine__node--child {
  position: relative;
  padding-top: 0;
  height: 100%;
}

body.content-subpage .org-chart-marine__unit.org-chart-marine__node--child {
  height: 100%;
  min-height: 100%;
}

body.content-subpage .org-chart-marine__unit.org-chart-marine__node--child .org-chart-marine__roster {
  flex: 1;
  display: flex;
  flex-direction: column;
}

body.content-subpage .org-chart-marine__unit.org-chart-marine__node--child .org-chart-marine__roster-list {
  flex: 1;
}

body.content-subpage .org-chart-marine__node--child::before {
  display: none;
}

body.content-subpage .org-chart-marine__unit {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.45rem;
  width: 100%;
  min-width: 0;
}

body.content-subpage .org-chart-marine__tier--ceo,
body.content-subpage .org-chart-marine__tier--cs {
  flex-direction: column;
  align-items: center;
}

body.content-subpage .org-chart-marine__tier--ceo .org-chart-marine__unit,
body.content-subpage .org-chart-marine__tier--cs .org-chart-marine__unit {
  width: min(100%, 18rem);
}

body.content-subpage .org-chart-marine__qa-cell,
body.content-subpage .org-chart-marine__rd-cell {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
}

body.content-subpage .org-chart-marine__qa-cell {
  justify-content: flex-start;
}

body.content-subpage .org-chart-marine__rd-cell {
  justify-content: flex-start;
}

body.content-subpage .org-chart-marine__box {
  position: relative;
  width: 100%;
  max-width: 100%;
  padding: clamp(0.85rem, 1.6vw, 1.1rem) clamp(0.75rem, 1.4vw, 1rem) clamp(1.35rem, 2.2vw, 1.65rem);
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e6eb;
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(15, 20, 25, 0.04);
}

body.content-subpage .org-chart-marine__box--ceo {
  background: linear-gradient(180deg, #fff 0%, #eef3fa 100%);
  border-color: rgba(0, 48, 135, 0.28);
  box-shadow: 0 4px 14px rgba(0, 48, 135, 0.1);
}

body.content-subpage .org-chart-marine__box--parent {
  background: transparent;
  border: 1px solid rgba(0, 48, 135, 0.18);
  box-shadow: none;
}

body.content-subpage .org-chart-marine__box--parent.org-chart-marine__box--title-only {
  min-height: 2.95rem;
}

body.content-subpage .org-chart-marine__box--parent.org-chart-marine__box--title-only .org-chart-marine__box-inner {
  justify-content: center;
  min-height: 2rem;
}

body.content-subpage .org-chart-marine__branch-head .org-chart-marine__box--parent {
  border-color: rgba(0, 48, 135, 0.24);
}

body.content-subpage .org-chart-marine__box--child {
  background: #fff;
  border-color: rgba(0, 48, 135, 0.12);
  box-shadow: 0 1px 4px rgba(15, 20, 25, 0.04);
  min-height: 3.55rem;
  padding: 0.5rem 0.45rem 0.65rem;
}

body.content-subpage .org-chart-marine__box--child .org-chart-marine__box-inner {
  min-height: 2rem;
  max-height: 2rem;
  justify-content: center;
}

body.content-subpage .org-chart-marine__box--child .org-chart-marine__sub {
  display: none;
  min-height: 0;
}

body.content-subpage .org-chart-marine__box--child .org-chart-marine__sub:not(:empty) {
  display: block;
  min-height: 1.1em;
}

body.content-subpage .org-chart-marine__box--child .org-chart-marine__sub:empty::before {
  content: none;
}

body.content-subpage .org-chart-marine__tier--spine .org-chart-marine__box--parent {
  background: linear-gradient(180deg, #edf2fa 0%, #e3ebf7 100%);
  border-color: rgba(0, 48, 135, 0.22);
}

body.content-subpage .org-chart-marine__branch--leaf .org-chart-marine__branch-head {
  border-radius: 8px;
}

body.content-subpage .org-chart-marine__tier--spine .org-chart-marine__branch {
  width: 100%;
}

body.content-subpage .org-chart-marine__box::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 28%;
  height: 3px;
  background: linear-gradient(90deg, transparent, #0d6efd);
  border-radius: 0 0 3px 0;
  opacity: 0.85;
  pointer-events: none;
}

body.content-subpage .org-chart-marine__box-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.2rem;
  padding-inline: 0.25rem;
}

body.content-subpage .org-chart-marine__title {
  font-size: clamp(1.02rem, 1.24vw, 1.14rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: #003087;
}

body.content-subpage .org-chart-marine__box--ceo .org-chart-marine__title {
  font-size: clamp(1.14rem, 1.46vw, 1.28rem);
  font-weight: 900;
  letter-spacing: -0.03em;
}

body.content-subpage .org-chart-marine__ceo-person {
  width: 100%;
  margin-top: 0.15rem;
  text-align: center;
}

body.content-subpage .org-chart-marine__ceo-name {
  font-size: var(--org-fs-md);
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #003087;
  line-height: 1.35;
}

body.content-subpage .org-chart-marine__member-entry--in-box {
  width: 100%;
}

body.content-subpage .org-chart-marine__member-chip--in-box {
  justify-content: center;
  padding: 0.12rem 0.35rem;
  text-align: center;
}

body.content-subpage .org-chart-marine__member-chip--in-box .org-chart-marine__member-chip-name {
  font-size: var(--org-fs-md);
  font-weight: 900;
  letter-spacing: -0.02em;
}

body.content-subpage .org-chart-marine__member-entry--in-box .org-chart-marine__member-popup {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

body.content-subpage .org-chart-marine__member-entry--in-box .org-chart-marine__member-popup.is-align-right {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

body.content-subpage .org-chart-marine__box--parent .org-chart-marine__title {
  font-size: clamp(0.96rem, 1.12vw, 1.06rem);
  font-weight: 900;
  letter-spacing: -0.03em;
  text-transform: none;
  line-height: 1.2;
  white-space: nowrap;
}

body.content-subpage .org-chart-marine__box--child .org-chart-marine__title {
  font-size: clamp(0.78rem, 0.92vw, 0.88rem);
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
}

body.content-subpage .org-chart-marine__sub {
  font-size: clamp(0.78rem, 1.02vw, 0.88rem);
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: none;
  color: #5c6775;
  line-height: 1.35;
}

body.content-subpage .org-chart-marine__count {
  position: absolute;
  right: clamp(0.45rem, 1vw, 0.65rem);
  bottom: clamp(0.35rem, 0.8vw, 0.5rem);
  font-size: clamp(0.74rem, 0.92vw, 0.84rem);
  font-weight: 700;
  color: #6b7582;
  letter-spacing: 0.02em;
}

body.content-subpage .org-chart-marine__roster {
  width: 100%;
  margin-top: 0.25rem;
  padding: 0.35rem 0.4rem 0.45rem;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(0, 48, 135, 0.1);
  border-radius: 4px;
}

body.content-subpage .org-chart-marine__roster-list {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

body.content-subpage .org-chart-marine__roster-list.org-chart-marine__roster-list--rnd-team {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.35rem 1.25rem;
}

body.content-subpage .org-chart-marine__roster-list.org-chart-marine__roster-list--rnd-team .org-chart-marine__member-entry {
  flex: 0 0 auto;
  width: auto;
}

body.content-subpage .org-chart-marine__roster-list.org-chart-marine__roster-list--rnd-team .org-chart-marine__member-chip {
  width: auto;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

body.content-subpage .org-chart-marine__member-entry {
  position: relative;
  z-index: 1;
}

body.content-subpage .org-chart-marine__member-entry.is-open {
  z-index: 40;
}

body.content-subpage .org-chart-marine__member-chip {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.45rem;
  width: 100%;
  padding: 0.16rem 0.28rem;
  border: 0;
  background: transparent;
  text-align: left;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

body.content-subpage .org-chart-marine__member-chip:hover,
body.content-subpage .org-chart-marine__member-entry.is-open .org-chart-marine__member-chip,
body.content-subpage .org-chart-marine__member-chip:focus-visible {
  background: rgba(0, 48, 135, 0.08);
  outline: none;
}

body.content-subpage .org-chart-marine__member-chip:focus-visible {
  box-shadow: 0 0 0 2px rgba(0, 48, 135, 0.25);
}

body.content-subpage .org-chart-marine__member-chip-name {
  font-size: var(--org-fs-sm);
  font-weight: 700;
  color: #003087;
  line-height: 1.35;
}

body.content-subpage .org-chart-marine__member-chip-title {
  font-size: var(--org-fs-xs);
  font-weight: 500;
  color: #5c6775;
  line-height: 1.35;
}

body.content-subpage .org-chart-marine__member-entry--head:not(:only-child) {
  margin-bottom: 0.2rem;
  padding-bottom: 0.28rem;
  border-bottom: 1px solid rgba(0, 48, 135, 0.12);
}

body.content-subpage .org-chart-marine__member-chip--head {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
  padding: 0.28rem 0.35rem 0.22rem;
  text-align: center;
}

body.content-subpage .org-chart-marine__member-chip--head .org-chart-marine__member-chip-name {
  font-size: var(--org-fs-md);
  font-weight: 900;
  letter-spacing: -0.02em;
}

body.content-subpage .org-chart-marine__member-chip--head .org-chart-marine__member-chip-title {
  font-size: var(--org-fs-sm);
  font-weight: 700;
  color: #003087;
}

body.content-subpage .org-chart-marine__member-chip--plain {
  cursor: default;
}

body.content-subpage .org-chart-marine__member-entry--placeholder {
  pointer-events: none;
}

body.content-subpage .org-chart-marine__member-chip--placeholder {
  visibility: hidden;
}

body.content-subpage .org-chart-marine__tier--face .org-chart-marine__branch-head .org-chart-marine__roster {
  min-height: 3.55rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

body.content-subpage .org-chart-marine__tier--face .org-chart-marine__member-entry--head {
  min-height: 3.1rem;
}

body.content-subpage .org-chart-marine__tier--face .org-chart-marine__member-chip--head {
  min-height: 2.85rem;
  box-sizing: border-box;
}

body.content-subpage .org-chart-marine__member-entry--head .org-chart-marine__member-popup {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

body.content-subpage .org-chart-marine__member-entry--head .org-chart-marine__member-popup.is-align-right {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

body.content-subpage .org-chart-marine__member-popup {
  position: absolute;
  left: 0;
  top: calc(100% + 0.3rem);
  z-index: 45;
  width: min(21rem, 92vw);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

body.content-subpage .org-chart-marine__member-popup.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

body.content-subpage .org-chart-marine__member-popup.is-flip-up {
  top: auto;
  bottom: calc(100% + 0.3rem);
}

body.content-subpage .org-chart-marine__member-popup.is-align-right {
  left: auto;
  right: 0;
}

body.content-subpage .org-chart-marine__member-card {
  display: grid;
  grid-template-columns: 5rem 1fr;
  align-items: stretch;
  min-height: 6.1rem;
  background: #fff;
  border: 1px solid rgba(0, 48, 135, 0.12);
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 20, 25, 0.14);
}

body.content-subpage .org-chart-marine__member-photo-pane {
  position: relative;
  align-self: stretch;
  min-height: 6.1rem;
  background: linear-gradient(180deg, #eef1f5 0%, #dde2e8 100%);
  overflow: hidden;
}

body.content-subpage .org-chart-marine__member-photo {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% 18%;
}

body.content-subpage .org-chart-marine__member-photo[src*="park-ji-cheol"] {
  object-position: center 18%;
}

body.content-subpage .org-chart-marine__member-info {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-width: 0;
  padding: 0.55rem 0.75rem 0.65rem;
  background: #fff;
}

body.content-subpage .org-chart-marine__member-brand {
  position: absolute;
  top: 0.45rem;
  right: 0.5rem;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(0, 48, 135, 0.08);
}

body.content-subpage .org-chart-marine__member-text {
  padding-top: 1.25rem;
  min-width: 0;
}

body.content-subpage .org-chart-marine__member-name {
  font-size: var(--org-fs-md);
  font-weight: 800;
  color: #111827;
  line-height: 1.35;
  letter-spacing: -0.02em;
}

body.content-subpage .org-chart-marine__member-title {
  margin-top: 0.15rem;
  font-size: var(--org-fs-sm);
  font-weight: 600;
  color: #5c6775;
  line-height: 1.4;
}

body.content-subpage .org-chart-marine__member-contact {
  margin-top: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px solid rgba(0, 48, 135, 0.08);
}

body.content-subpage .org-chart-marine__member-phone,
body.content-subpage .org-chart-marine__member-email {
  font-size: var(--org-fs-xs);
  line-height: 1.4;
  color: #003087;
}

body.content-subpage .org-chart-marine__member-phone a,
body.content-subpage .org-chart-marine__member-email a {
  color: inherit;
  text-decoration: none;
  overflow-wrap: anywhere;
}

body.content-subpage .org-chart-marine__member-phone a:hover,
body.content-subpage .org-chart-marine__member-email a:hover {
  text-decoration: underline;
}

@media (max-width: 767.98px) {
  body.content-subpage .org-chart-marine__tier--face,
  body.content-subpage .org-chart-marine__tier--spine,
  body.content-subpage .org-chart-marine__tier--tech {
    grid-template-columns: 1fr;
  }

  body.content-subpage .org-chart-marine__box--parent .org-chart-marine__title,
  body.content-subpage .org-chart-marine__box--child .org-chart-marine__title {
    font-size: clamp(0.74rem, 3.4vw, 0.86rem);
  }

  body.content-subpage .org-chart-marine__tier--spine {
    max-width: none;
  }

  body.content-subpage .org-chart-marine__branch-body,
  body.content-subpage .org-chart-marine__branch-body[data-child-count="2"] {
    --org-child-cols: 1;
  }

  body.content-subpage .org-chart-marine__branch-connector-rail {
    display: none;
  }

  body.content-subpage .org-chart-marine__node--child::before {
    display: none;
  }

  body.content-subpage .org-chart-marine__node--child {
    padding-top: 0;
  }
}

@media (max-width: 767.98px) {
  body.content-subpage .org-chart-marine__tier--qa-rd {
    display: flex;
    flex-direction: column;
    gap: clamp(0.5rem, 2vw, 0.75rem);
  }

  body.content-subpage .org-chart-marine__joiner {
    display: none;
  }

  body.content-subpage .org-chart-marine__qa-cell,
  body.content-subpage .org-chart-marine__rd-cell {
    justify-content: center;
  }
}

/* ----- 주요 고객: HD 마린형(가치체계·CI와 톤 맞춘 리드 + 로고 그리드) ----- */
body.content-subpage .content-subpage-main--marine-major-customers {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .customers-marine.content-page-body {
  max-width: 100%;
}

body.content-subpage .customers-marine__intro {
  padding-bottom: clamp(1.75rem, 4vh, 2.5rem);
  border-bottom: 1px solid #e8ecf0;
}

body.content-subpage .customers-marine__eyebrow {
  margin: 0 0 0.65rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: #5c6775;
  text-transform: uppercase;
}

body.content-subpage :lang(ko) .customers-marine__eyebrow {
  text-transform: none;
  letter-spacing: 0.14em;
}

body.content-subpage .customers-marine__kicker {
  margin: 0 0 1rem;
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.3;
  color: #0f1419;
}

body.content-subpage .customers-marine__intro-p {
  margin: 0 0 1rem;
  max-width: 52rem;
  font-size: clamp(1.02rem, 1.2vw, 1.12rem);
  line-height: 1.85;
  color: #3d454f;
}

body.content-subpage .customers-marine__intro-p:last-child {
  margin-bottom: 0;
}

body.content-subpage .customers-marine__logos {
  margin-top: clamp(1.75rem, 4vh, 2.5rem);
}

body.content-subpage .customers-marine__logo-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.65rem, 1.8vw, 1rem);
}

@media (min-width: 576px) {
  body.content-subpage .customers-marine__logo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  body.content-subpage .customers-marine__logo-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

body.content-subpage .customers-marine__logo-item {
  margin: 0;
}

body.content-subpage .customers-marine__logo-card {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(5.5rem, 12vw, 6.75rem);
  padding: clamp(0.85rem, 2vw, 1.25rem) clamp(0.75rem, 1.8vw, 1.1rem);
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e6eb;
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(15, 20, 25, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.content-subpage .customers-marine__logo-card:hover {
  border-color: #c5d0e0;
  box-shadow: 0 2px 8px rgba(0, 48, 135, 0.08);
}

body.content-subpage .customers-marine__logo-card::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 32%;
  height: 3px;
  background: linear-gradient(90deg, transparent, #0d6efd);
  border-radius: 0 0 3px 0;
  opacity: 0.75;
  pointer-events: none;
}

body.content-subpage .customers-marine__logo-card-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: clamp(2.5rem, 6vw, 3.25rem);
}

body.content-subpage .customers-marine__logo-img {
  max-width: 100%;
  max-height: clamp(2.75rem, 6vw, 3.5rem);
  width: auto;
  height: auto;
  object-fit: contain;
}

/* ----- 찾아오시는 길: HD 마린형(주요 고객·CI와 동일 리드 톤 + 연락처 카드 + 지도) ----- */
body.content-subpage .content-subpage-main--marine-directions {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(0.85rem, 2.2vw, 1.5rem) !important;
  padding-top: clamp(1.35rem, 2.5vh, 2rem) !important;
  padding-bottom: clamp(3.5rem, 9vh, 5.75rem) !important;
}

body.content-subpage .directions-marine.content-page-body {
  max-width: 100%;
}

body.content-subpage .directions-marine__intro {
  padding-bottom: clamp(1.75rem, 4vh, 2.5rem);
  border-bottom: 1px solid #e8ecf0;
}

body.content-subpage .directions-marine__eyebrow {
  margin: 0 0 0.65rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: #5c6775;
  text-transform: uppercase;
}

body.content-subpage :lang(ko) .directions-marine__eyebrow {
  text-transform: none;
  letter-spacing: 0.14em;
}

body.content-subpage .directions-marine__kicker {
  margin: 0 0 1rem;
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.3;
  color: #0f1419;
}

body.content-subpage .directions-marine__intro-p {
  margin: 0 0 1rem;
  max-width: 52rem;
  font-size: clamp(1.02rem, 1.2vw, 1.12rem);
  line-height: 1.85;
  color: #3d454f;
}

body.content-subpage .directions-marine__intro-p:last-child {
  margin-bottom: 0;
}

body.content-subpage .directions-marine__section-title {
  margin: 0 0 clamp(1rem, 2.5vw, 1.35rem);
  font-size: clamp(1.05rem, 1.35vw, 1.2rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f1419;
}

body.content-subpage .directions-marine__contact {
  margin-top: clamp(1.75rem, 4vh, 2.35rem);
}

body.content-subpage .directions-marine__contact-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.65rem, 1.8vw, 1rem);
}

@media (min-width: 768px) {
  body.content-subpage .directions-marine__contact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body.content-subpage .directions-marine__contact-item {
  margin: 0;
}

body.content-subpage .directions-marine__contact-card {
  position: relative;
  height: 100%;
  min-height: clamp(6.5rem, 14vw, 7.5rem);
  padding: clamp(1rem, 2.2vw, 1.35rem) clamp(0.9rem, 2vw, 1.2rem);
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e6eb;
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(15, 20, 25, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.content-subpage .directions-marine__contact-card:hover {
  border-color: #c5d0e0;
  box-shadow: 0 2px 8px rgba(0, 48, 135, 0.08);
}

body.content-subpage .directions-marine__contact-card::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 32%;
  height: 3px;
  background: linear-gradient(90deg, transparent, #0d6efd);
  border-radius: 0 0 3px 0;
  opacity: 0.75;
  pointer-events: none;
}

body.content-subpage .directions-marine__contact-label {
  margin: 0 0 0.45rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #5c6775;
}

body.content-subpage :lang(ko) .directions-marine__contact-label {
  text-transform: none;
  letter-spacing: 0.06em;
}

body.content-subpage .directions-marine__contact-value {
  margin: 0;
  font-size: clamp(0.98rem, 1.15vw, 1.08rem);
  font-weight: 600;
  line-height: 1.5;
  color: #0f1419;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

body.content-subpage .directions-marine__contact-link {
  color: #0d6efd;
  text-decoration: none;
}

body.content-subpage .directions-marine__contact-link:hover {
  text-decoration: underline;
}

body.content-subpage .directions-marine__locations {
  margin-top: clamp(2.25rem, 5vh, 3rem);
}

body.content-subpage .directions-marine__map-block + .directions-marine__map-block {
  margin-top: clamp(2rem, 4.5vh, 2.75rem);
  padding-top: clamp(2rem, 4.5vh, 2.75rem);
  border-top: 1px solid #e8ecf0;
}

body.content-subpage .directions-marine__location-heading {
  margin: 0 0 clamp(0.85rem, 2vw, 1.1rem);
  font-size: clamp(1rem, 1.25vw, 1.12rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.35;
  color: #0f1419;
}

body.content-subpage .directions-marine__map-block:has(.directions-marine__location-caption) .directions-marine__location-heading {
  margin-bottom: 0.35rem;
}

body.content-subpage .directions-marine__location-caption {
  margin: 0 0 clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #003087;
}

body.content-subpage .directions-marine__map-frame {
  position: relative;
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #e2e6eb;
  box-shadow: 0 1px 2px rgba(15, 20, 25, 0.04);
  aspect-ratio: 16 / 10;
  min-height: clamp(220px, 38vw, 420px);
  background: #e8ecf0;
}

body.content-subpage .directions-marine__map-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

body.content-subpage .directions-marine__map-foot {
  font-size: 0.92rem;
}

body.content-subpage .directions-marine__map-open {
  font-weight: 600;
  text-decoration: none;
  color: #0d6efd;
}

body.content-subpage .directions-marine__map-open:hover {
  text-decoration: underline;
}

/* ----- 회사 개요: HD현대마린솔루션 개요(리드 → 기업개요·탭 → 본문+요약·브로슈어) -----
 * 그리드는 마린 `/kr/company/about/overview/contents` 와 동일한 수치:
 * inner max 1220px, `.half-layout` gap 100rem, `.overview.half-layout .title` max-width 365rem.
 */
body.content-subpage .company-overview-stack {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: clamp(14rem, 32vh, 26rem);
  padding-bottom: clamp(2.5rem, 6vh, 4.5rem);
  background-color: #fff;
}

.company-overview-marine {
  flex: 1 1 auto;
  min-width: 0;
}

/* 마린 inner-1220(최대 1220) + half-layout: 좌열 최대 365px, 열 간격 100px */
.company-overview-marine__container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 992px) {
  body.content-subpage .company-overview-marine__container.container {
    max-width: 1220px;
  }

  .company-overview-marine__container {
    display: grid;
    grid-template-columns: minmax(0, 365px) minmax(0, 1fr);
    column-gap: 100px;
    align-items: start;
  }

  .company-overview-marine__main {
    min-width: 0;
  }
}

.company-overview-marine__rail {
  min-width: 0;
}

.company-overview-marine__kicker {
  letter-spacing: 0.12em;
  font-size: 0.7rem;
  font-weight: 500;
}

/* 좌측 레일: 큰 섹션 제목(개요) */
.company-overview-marine__rail-title {
  font-size: clamp(2rem, 1.35rem + 2.2vw, 2.65rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: #111;
}

@media (min-width: 992px) {
  .company-overview-marine__rail-title {
    position: sticky;
    top: calc(var(--site-header-h) + 1.25rem);
  }
}

.company-overview-marine__tagline {
  font-size: clamp(1.05rem, 0.88rem + 0.55vw, 1.32rem);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.025em;
  color: #1e3a5f;
}

.company-overview-marine__tagline-line + .company-overview-marine__tagline-line {
  margin-top: 0.2rem;
}

.company-overview-marine__lead {
  font-size: clamp(0.9375rem, 0.88rem + 0.22vw, 1.0625rem);
  line-height: 1.78;
  color: #111;
}

.company-overview-marine__corp-title {
  font-size: clamp(1.15rem, 1rem + 0.55vw, 1.4rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #111;
  margin-bottom: 1rem;
}

.company-overview-marine__tab-panel {
  margin-bottom: clamp(1.35rem, 3.5vw, 2rem);
}

.company-overview-marine__tab-p {
  font-size: clamp(0.9375rem, 0.88rem + 0.18vw, 1.03rem);
  line-height: 1.78;
  margin-bottom: 1.1rem;
  color: #111;
}

.company-overview-marine__tab-p:last-child {
  margin-bottom: 0;
}

.company-overview-marine__facts {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding-top: 0.65rem;
}

.company-overview-marine__social-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ref-hd-marine-sns-pill-gap);
  box-sizing: border-box;
  min-height: var(--ref-hd-marine-sns-pill-height);
  min-width: var(--ref-hd-marine-sns-pill-height);
  padding: var(--ref-hd-marine-sns-pill-padding-y) var(--ref-hd-marine-sns-pill-padding-x-end)
    var(--ref-hd-marine-sns-pill-padding-y) var(--ref-hd-marine-sns-pill-padding-x-start);
  font-size: clamp(0.875rem, 0.82rem + 0.18vw, 0.9375rem);
  font-weight: 500;
  line-height: 1.2;
  color: #fff !important;
  text-decoration: none;
  border-radius: 999px;
  background-color: var(--ref-hd-marine-blue-primary);
  border: 1px solid var(--ref-hd-marine-blue-primary);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.company-overview-marine__social-pill:hover {
  background-color: var(--ref-hd-marine-blue-primary-hover);
  border-color: var(--ref-hd-marine-blue-primary-hover);
  color: #fff !important;
}

.company-overview-marine__social-pill-icon {
  flex-shrink: 0;
  width: var(--ref-hd-marine-sns-icon);
  height: var(--ref-hd-marine-sns-icon);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.company-overview-marine__social-pill-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* 블로그: stroke 기반 N — 소형에서도 윤곽이 뚜렷하게 */
.company-overview-marine__social-pill-svg--naver-n {
  shape-rendering: geometricPrecision;
  overflow: visible;
}

.company-overview-marine__social-pill-label {
  white-space: nowrap;
}


.company-overview-marine__figure {
  margin: 0;
  max-width: 56rem;
}

.company-overview-marine__figure-img {
  max-height: min(48vh, 26rem);
  object-fit: cover;
  object-position: center;
}

.company-overview-marine__caption {
  line-height: 1.5;
}

/* HD 마린: 세그먼트 탭 — 비활성 연한 배경, 활성 네이비 배경+흰 글자 */
.company-overview-tabs--segmented {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: none;
}

.company-overview-tabs--segmented .company-overview-tabs__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1.65rem;
  margin: 0;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  border: none;
  border-radius: 0;
  background-color: #e4ebf5;
  color: #1e293b;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}

.company-overview-tabs--segmented .company-overview-tabs__item:hover {
  color: #0a1f45;
  background-color: #d5e0f2;
}

.company-overview-tabs--segmented .company-overview-tabs__item--active {
  background-color: #2563a8;
  color: #fff !important;
  cursor: default;
}

.company-overview-tabs--segmented .company-overview-tabs__item--active:hover {
  color: #fff !important;
  background-color: #1f5694;
}

.company-overview-facts__row {
  display: grid;
  grid-template-columns: minmax(6.75rem, 9.25rem) 1fr;
  gap: 0.35rem 1.35rem;
  padding: 0.9rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.company-overview-facts__row:first-child {
  padding-top: 0.65rem;
}

.company-overview-facts__dt {
  margin: 0;
  font-weight: 700;
  font-size: 0.9rem;
  color: #111;
  letter-spacing: -0.02em;
}

.company-overview-facts__dd {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #111;
}

/* facts: 마린 80px 기준에서 한 단계 넓히고 글자·행간 확대 */
body.content-subpage .company-overview-marine .company-overview-facts__row {
  grid-template-columns: minmax(104px, 7.5rem) 1fr;
  align-items: start;
  gap: 0.45rem 2rem;
  padding: 1.15rem 0;
}

body.content-subpage .company-overview-marine .company-overview-facts__row:first-child {
  padding-top: 0.85rem;
}

body.content-subpage .company-overview-marine .company-overview-facts__dt {
  font-size: clamp(1rem, 0.94rem + 0.2vw, 1.125rem);
  line-height: 1.55;
  padding-top: 0.1rem;
}

body.content-subpage .company-overview-marine .company-overview-facts__dd {
  font-size: clamp(1.0625rem, 0.98rem + 0.28vw, 1.1875rem);
  line-height: 1.68;
}

/* 마린 개요: 마지막 행「사이트」— SNS pill을 dt/dd 그리드 오른쪽에 정렬 */
.company-overview-facts__row--site {
  align-items: center;
}

.company-overview-facts__dd--site {
  padding-top: 0.15rem;
}

body.content-subpage .company-overview-marine .company-overview-facts__row--site {
  align-items: center;
}

body.content-subpage .company-overview-marine .company-overview-marine__social-list {
  gap: var(--ref-hd-marine-sns-row-gap) var(--ref-hd-marine-sns-row-gap) !important;
}

.company-overview-social__label {
  letter-spacing: 0.12em;
}

.company-overview-social__link {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.85rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #0d6efd;
  text-decoration: none;
  border: 1px solid rgba(13, 110, 253, 0.35);
  border-radius: 999px;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}

.company-overview-social__link:hover {
  background-color: rgba(13, 110, 253, 0.08);
  color: #0a58ca;
}

.company-overview-brochure {
  margin-top: clamp(2.5rem, 6vw, 3.5rem);
}

.company-overview-marine .company-overview-brochure {
  margin-top: clamp(2rem, 5vw, 2.75rem);
}

/* HD 마린 개요형 브로슈어: 좌 큰 제목 · 우 연한 회색 스테이지 + 원 아이콘 다운로드 링크 */
.company-overview-brochure__grid {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
}

@media (min-width: 992px) {
  .company-overview-brochure--marine-split .company-overview-brochure__grid {
    display: grid;
    grid-template-columns: minmax(0, 365px) minmax(0, 1fr);
    column-gap: 100px;
    align-items: start;
  }
}

.company-overview-brochure__rail {
  min-width: 0;
}

.company-overview-brochure__rail-title {
  font-size: clamp(2rem, 1.35rem + 2.2vw, 2.65rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: #111;
}

@media (min-width: 992px) {
  .company-overview-brochure__rail-title {
    position: sticky;
    top: calc(var(--site-header-h) + 1.25rem);
  }
}

.company-overview-brochure__main {
  min-width: 0;
}

.company-overview-brochure__stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(14rem, 38vw, 22rem);
  padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 3vw, 2rem);
  background-color: #f5f5f5;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.company-overview-brochure__cover {
  display: block;
  width: auto;
  max-width: min(100%, 15.5rem);
  height: auto;
  max-height: min(52vh, 26rem);
  box-shadow: 0 0.35rem 1.25rem rgba(0, 0, 0, 0.14);
  border-radius: 2px;
}

.company-overview-brochure__stage-placeholder {
  text-align: center;
  max-width: 20rem;
}

.company-overview-brochure__download-block {
  margin-top: 1.15rem;
}

.company-overview-brochure__download {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: #111;
  font-weight: 500;
  font-size: clamp(0.9375rem, 0.88rem + 0.2vw, 1.05rem);
  text-decoration: none;
  letter-spacing: -0.02em;
}

.company-overview-brochure__download:hover {
  color: #0d47a1;
}

.company-overview-brochure__download--disabled {
  opacity: 0.45;
  pointer-events: none;
}

.company-overview-brochure__download-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  border: 1px solid rgba(0, 0, 0, 0.22);
  border-radius: 50%;
  color: #333;
  background-color: #fff;
}

.company-overview-brochure__download:hover .company-overview-brochure__download-icon {
  border-color: rgba(13, 71, 161, 0.45);
  color: #0d47a1;
}

.company-overview-brochure__download-text {
  line-height: 1.35;
}

.company-overview-brochure__note {
  max-width: 36rem;
  line-height: 1.65;
}

/* ----- 콘텐츠 페이지: 홈 + 대메뉴 + 형제 페이지 드롭다운 ----- */
.page-nav-rail--fullbleed .page-nav-rail__inner {
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.page-nav-rail__inner {
  min-height: 2.75rem;
}

.page-nav-rail__stack {
  width: 100%;
}

.page-nav-rail__tabs-row .main-nav-container {
  max-width: 100%;
}

.company-overview-tabs--page-nav-rail {
  width: 100%;
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--yokogawa .company-overview-tabs__item--active {
  color: var(--yokogawa-text, #111);
  background-color: var(--yokogawa-yellow, #ffd100);
  border-color: var(--yokogawa-yellow-border, #e6bc00);
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--yokogawa-pressure .company-overview-tabs__item {
  font-size: 0.8125rem;
  padding: 0.45rem 0.65rem;
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--yokogawa-pressure .company-overview-tabs__item--active {
  color: var(--yokogawa-text, #111);
  border-color: var(--yokogawa-yellow-border, #e6bc00);
  background-color: var(--yokogawa-yellow, #ffd100);
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--skarpenord .company-overview-tabs__item--active {
  color: #fff;
  background-color: var(--skarpenord-brand, #00a2a4);
  border-color: var(--skarpenord-brand-border, #009a9c);
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--agency .company-overview-tabs__item {
  font-size: 0.8125rem;
  padding: 0.45rem 0.65rem;
}

.company-overview-tabs--page-nav-rail.company-overview-tabs--agency .company-overview-tabs__item--active {
  color: #fff;
  background-color: var(--danfoss-red, #e2000f);
  border-color: var(--danfoss-red, #e2000f);
}

.page-nav-rail__home {
  flex: 0 0 auto;
  min-width: 2.75rem;
}

.page-nav-rail__home:hover {
  background-color: rgba(0, 0, 0, 0.04);
}

.page-nav-rail__home-icon {
  display: block;
}

.page-nav-rail__sep {
  width: 1px;
  flex: 0 0 1px;
  align-self: stretch;
  background-color: rgba(0, 0, 0, 0.12);
}

.page-nav-rail__dropdown {
  position: relative;
}

.page-nav-rail__toggle {
  font-weight: 600;
  white-space: nowrap;
  padding-left: 1rem;
  padding-right: 1.75rem;
}

.page-nav-rail__toggle::after {
  margin-left: 0.35rem;
  vertical-align: 0.15em;
}

.page-nav-rail__dropdown .dropdown-menu {
  min-width: 12rem;
}

.page-nav-rail__dropdown .dropdown-item.active {
  font-weight: 600;
  color: var(--bs-body-color);
  background-color: rgba(13, 110, 253, 0.08);
}

.page-nav-rail__dropdown .dropdown-item.page-nav-rail__item--nested {
  padding-left: 1.5rem;
  font-size: 0.925rem;
}

.page-nav-rail__dropdown .dropdown-item.page-nav-rail__item--nested2 {
  padding-left: 2.25rem;
  font-size: 0.9rem;
}

.page-nav-rail__section-label {
  min-height: 2.75rem;
  font-size: 0.95rem;
}

.page-nav-rail__tabs-row {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}

.page-nav-rail__tabs-row--nested {
  background-color: #f7f9fb;
}

.page-nav-rail__tabs-row .page-nav-rail__tabs {
  margin-bottom: 0;
}

/* 내부 페이지(밝은 네비): logo-1 단독 — 흰 배경에서 logo-2가 묻히는 경우 방지 */
.navbar-brand.navbar-brand--inner-nav-logo {
  line-height: 0;
}

/* 히어로: 기본 logo-2 — 탑바(메뉴 영역) 호버·포커스 시 logo-1 */
.navbar-brand.navbar-brand--with-logo {
  line-height: 0;
  overflow: visible;
}

.navbar-brand-logo-pair {
  position: relative;
  display: inline-grid;
  line-height: 0;
  vertical-align: middle;
}

.navbar-brand-logo-pair .navbar-brand-logo-img {
  grid-area: 1 / 1;
  height: var(--brand-logo-h, 2.25rem);
  width: auto;
  max-width: none;
  display: block;
  transition: opacity 0.18s ease;
}

.navbar-brand-logo-pair .navbar-brand-logo-img--hover {
  opacity: 0;
  pointer-events: none;
}

.hero-navbar-brand-logo {
  display: block;
  max-height: none;
}

.site-header-brand-cluster {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  max-width: min(100%, 32rem);
}

.site-header-brand-cluster .navbar-brand {
  margin-right: 0;
}

.site-header-brand-sep {
  color: rgba(100, 116, 139, 0.75);
  font-size: 1.1rem;
  font-weight: 300;
  line-height: 1;
  user-select: none;
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .site-header-brand-sep {
  color: rgba(255, 255, 255, 0.45);
}

.site-header-labs-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  text-decoration: none;
  line-height: 1.15;
  flex-shrink: 1;
  min-width: 0;
}

.site-header-labs-brand__img {
  display: block;
  flex-shrink: 0;
  height: 1.15rem;
  width: auto;
  max-width: min(7.5rem, 24vw);
  object-fit: contain;
}

.site-header-labs-brand__tag {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  white-space: nowrap;
  line-height: 1.2;
}

.site-header-labs-brand__tag--light {
  color: rgba(255, 255, 255, 0.92);
}

.site-header-labs-brand__tag--dark {
  display: none;
  color: var(--labs-brand-accent);
}

.site-header-labs-brand__img--dark {
  display: none;
}

.navbar-light .site-header-labs-brand__img--light,
body:not(.hero-video-page):not(.content-subpage) .site-header-labs-brand__img--light,
.navbar-light .site-header-labs-brand__tag--light,
body:not(.hero-video-page):not(.content-subpage) .site-header-labs-brand__tag--light {
  display: none;
}

.navbar-light .site-header-labs-brand__img--dark,
body:not(.hero-video-page):not(.content-subpage) .site-header-labs-brand__img--dark,
.navbar-light .site-header-labs-brand__tag--dark,
body:not(.hero-video-page):not(.content-subpage) .site-header-labs-brand__tag--dark {
  display: block;
}

.site-header-labs-brand:hover .site-header-labs-brand__img,
.site-header-labs-brand:hover .site-header-labs-brand__tag {
  opacity: 0.88;
}

/* 히어로 GNB: 스크롤 후 흰 배경·메뉴 호버 시 LABS 검은 로고 + accent 태그라인 */
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-labs-brand__img--light,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-labs-brand__tag--light {
  display: none;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-labs-brand__img--dark,
:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-labs-brand__tag--dark {
  display: block;
}

@media (min-width: 992px) {
  .site-header-labs-brand__img {
    height: 1.35rem;
    max-width: 8rem;
  }

  .site-header-labs-brand__tag {
    font-size: 0.8rem;
  }
}

@media (max-width: 575.98px) {
  .site-header-labs-brand__tag {
    display: none !important;
  }
}

/* Agency·글로벌 파트너 브랜드 로고 (GNB 우측 상단) */
.site-header-partner-brand {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  z-index: 5;
  display: flex;
  align-items: center;
  max-height: calc(var(--site-header-h) - 0.75rem);
  padding: 0.15rem 0;
  text-decoration: none;
  transform: translateY(-50%);
}

.site-header-partner-brand__img {
  display: block;
  width: auto;
  height: 1.75rem;
  max-width: min(9.5rem, 28vw);
  object-fit: contain;
  object-position: right center;
}

/* YOKOGAWA 워드마크는 가로 비율이 커서 Danfoss와 같은 우측 슬롯 크기로 제한 */
.site-header-partner-brand__img--yokogawa {
  width: min(4.5rem, 20vw);
  height: auto;
  max-height: 1.75rem;
}

.site-header-partner-brand__img--skarpenord {
  width: min(4.75rem, 18vw);
  height: auto;
  max-height: 1.75rem;
  max-width: min(4.75rem, 18vw);
  filter: none;
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .site-header-partner-brand__img--skarpenord {
  filter: none;
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-partner-brand__img--skarpenord {
  filter: brightness(0) saturate(100%);
}

@media (min-width: 992px) {
  .site-header-partner-brand__img--yokogawa {
    width: 4.75rem;
    max-height: 2rem;
  }
}

.navbar--has-partner-brand .navbar-toggler {
  margin-right: clamp(5.5rem, 18vw, 8.5rem);
}

@media (min-width: 992px) {
  .site-header-partner-brand {
    right: 1.25rem;
  }

  .site-header-partner-brand__img {
    height: 2rem;
    max-width: 10.5rem;
  }

  .site-header-partner-brand__img--skarpenord {
    width: 5.25rem;
    height: auto;
    max-width: 5.25rem;
    max-height: 2rem;
  }

  .navbar--has-partner-brand .main-nav-trailing {
    margin-right: clamp(6.5rem, 10vw, 9.5rem);
  }

  .navbar--has-partner-brand .navbar-toggler {
    margin-right: 0;
  }
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .site-header-partner-brand__img--on-dark-nav {
  filter: brightness(0) invert(1);
}

:is(
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll,
  body.content-subpage--solid-gnb
)
  .hero-navbar-transparent
  .site-header-partner-brand__img--on-dark-nav {
  filter: none;
}

@media (prefers-reduced-motion: reduce) {
  .navbar-brand-logo-pair .navbar-brand-logo-img {
    transition: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  /* 브랜드 링크만이 아니라 탑바(메뉴·로고 영역) 어디에나 올리면 logo-1 */
  nav.navbar:has(.navbar-brand-logo-pair):hover .navbar-brand-logo-pair .navbar-brand-logo-img--base,
  nav.navbar:has(.navbar-brand-logo-pair):focus-within .navbar-brand-logo-pair .navbar-brand-logo-img--base {
    opacity: 0;
  }

  nav.navbar:has(.navbar-brand-logo-pair):hover .navbar-brand-logo-pair .navbar-brand-logo-img--hover,
  nav.navbar:has(.navbar-brand-logo-pair):focus-within .navbar-brand-logo-pair .navbar-brand-logo-img--hover {
    opacity: 1;
  }

  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):hover
    .site-header-labs-brand__img--light,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):focus-within
    .site-header-labs-brand__img--light,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):hover
    .site-header-labs-brand__tag--light,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):focus-within
    .site-header-labs-brand__tag--light {
    display: none;
  }

  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):hover
    .site-header-labs-brand__img--dark,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):focus-within
    .site-header-labs-brand__img--dark,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):hover
    .site-header-labs-brand__tag--dark,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):focus-within
    .site-header-labs-brand__tag--dark {
    display: block;
  }

  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):hover
    .site-header-brand-sep,
  :is(body.hero-video-page, body.content-subpage)
    nav.navbar.hero-navbar-transparent:has(.navbar-brand-logo-pair):focus-within
    .site-header-brand-sep {
    color: rgba(100, 116, 139, 0.75);
  }
}

/* 모바일: 펼친 메뉴 배경이 투명·영상 위면 흰 글씨가 안 보임 → 어두운 패널 (576px~991px 구간 포함) */
@media (max-width: 991.98px) {
  :is(body.hero-video-page, body.content-subpage):not(.site-header--gnb-solid-scroll)
    .hero-navbar-transparent
    .navbar-collapse.show,
  :is(body.hero-video-page, body.content-subpage):not(.site-header--gnb-solid-scroll)
    .hero-navbar-transparent
    .navbar-collapse.collapsing {
    margin-top: 0.35rem;
    padding: 0.5rem 0.75rem;
    background-color: rgba(11, 18, 32, 0.94) !important;
    border-radius: 0.35rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
  }

  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .hero-navbar-transparent
    .navbar-collapse.show,
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .hero-navbar-transparent
    .navbar-collapse.collapsing {
    margin-top: 0.35rem;
    padding: 0.5rem 0.75rem;
    background-color: #fff !important;
    border-radius: 0.35rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.08);
  }

  /* 사업분야 등 하위 메뉴까지 포함하면 매우 길어짐 — 화면 아래 고정 패널 + 스크롤 (iOS WebKit) */
  body.mobile-nav-open header.site-header .navbar-collapse.main-nav-collapse-inner.show {
    --mobile-nav-panel-h: calc(
      100dvh - var(--site-header-bar-h, var(--site-header-h, 5rem)) - 1rem - env(safe-area-inset-bottom, 0px)
    );
    position: fixed;
    left: max(0.5rem, env(safe-area-inset-left, 0px));
    right: max(0.5rem, env(safe-area-inset-right, 0px));
    top: calc(var(--site-header-bar-h, var(--site-header-h, 5rem)) + 0.25rem);
    z-index: 1045;
    flex-basis: auto;
    width: auto !important;
    height: var(--mobile-nav-panel-h);
    max-height: var(--mobile-nav-panel-h);
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    transform: translateZ(0);
  }

  html.mobile-nav-open,
  body.mobile-nav-open {
    overflow: hidden;
    height: 100%;
  }
}

.hero-navbar-transparent .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.35);
}

/* 히어로: 탑바 전체를 하위 메뉴와 같은 흰 배경으로 (호버·드롭다운 열림 시 :has 로 유지) */
@media (min-width: 992px) and (hover: hover) and (pointer: fine) {
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.navbar-brand:hover),
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover),
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover),
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover),
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) {
    background-color: #fff !important;
    border-bottom: none !important;
    box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.08);
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .navbar-brand:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.navbar-brand:hover) .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.navbar-brand:hover) .navbar-brand:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .navbar-brand:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .navbar-brand:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .navbar-brand:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .navbar-brand,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .navbar-brand:visited {
    color: #212529 !important;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover a.nav-link.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover a.nav-link.hero-nav-on-video:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover button.main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) a.nav-link.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) a.nav-link.hero-nav-on-video:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) button.main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) a.nav-link.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) a.nav-link.hero-nav-on-video:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) button.main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) a.nav-link.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) a.nav-link.hero-nav-on-video:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) button.main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) a.nav-link.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) a.nav-link.hero-nav-on-video:visited,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) button.main-nav-dd-toggle.hero-nav-on-video {
    color: #212529 !important;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.navbar-brand:hover) .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video {
    color: var(--skarpenord-brand-text, #007678) !important;
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-section--active > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
  :is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video {
    color: var(--skarpenord-brand, #00a2a4) !important;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-lang,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.navbar-brand:hover) .main-nav-lang,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .main-nav-lang,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .main-nav-lang,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-lang,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-lang {
    color: #212529;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-lang-item--muted,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .main-nav-lang-item--muted,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .main-nav-lang-item--muted,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-lang-item--muted,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-lang-item--muted {
    opacity: 0.55;
    color: #6c757d;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-lang-sep,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .main-nav-lang-sep,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .main-nav-lang-sep,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-lang-sep,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-lang-sep {
    color: #adb5bd !important;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .navbar-toggler,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .navbar-toggler,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .navbar-toggler,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .navbar-toggler {
    border-color: rgba(0, 0, 0, 0.18);
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .navbar-toggler-icon,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-links > .nav-item:hover) .navbar-toggler-icon,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .navbar-toggler-icon,
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .navbar-toggler-icon {
    filter: invert(1) brightness(0.22);
  }
}

/* ----- HD 마린솔루션형: 메인 링크 가운데 정렬, 호버 시 흰 드롭다운 슬라이드 + 상위 메뉴 글자 강조색 ----- */
:root {
  --main-nav-accent: #0a9189;
  /* HD 마린솔루션형 상단 GNB 간격 (항목 사이 + 링크 안쪽 여백) — 조금 좁힌 버전 */
  --main-nav-item-gap: clamp(0.85rem, 1.35vw, 1.5rem);
  --main-nav-link-pad-x: clamp(0.65rem, 1.05vw, 1.05rem);
}

.main-nav-links .nav-link {
  font-weight: 500;
  font-size: 0.95rem;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-links .nav-link.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .main-nav-links button.main-nav-dd-toggle.hero-nav-on-video {
  font-weight: 700;
}

@media (min-width: 992px) {
  .main-nav-row {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    min-height: 3.35rem;
    overflow: visible;
  }

  .main-nav-links {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: var(--main-nav-item-gap);
    row-gap: 0.35rem;
    overflow: visible;
  }

  .main-nav-links > .nav-item > .nav-link,
  .main-nav-links > .nav-item > .main-nav-dd-toggle {
    padding-left: var(--main-nav-link-pad-x);
    padding-right: var(--main-nav-link-pad-x);
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
  }

  .main-nav-trailing {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(0.65rem, 1.2vw, 1.1rem);
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  .main-nav-lang-outer {
    position: static;
    transform: none;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  .main-nav-shop-outer {
    display: flex;
    align-items: center;
  }
}

/* 드롭다운: 흰 배경 + 아래로 슬라이드 (display 전환 없이 opacity/transform) */
.main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
  display: block !important;
  margin-top: 0 !important;
  top: 100%;
  padding: 0.55rem 0;
  min-width: 12rem;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0 0 0.45rem 0.45rem;
  box-shadow: 0 0.65rem 1.35rem rgba(0, 0, 0, 0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  pointer-events: none;
  transition:
    opacity 0.22s ease,
    transform 0.26s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.22s ease;
}

.main-nav-dropdown-hover:hover > .dropdown-menu.main-nav-dropdown,
.main-nav-dropdown-hover:focus-within > .dropdown-menu.main-nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

/* GNB·페이지 레일 플라이아웃 하위 링크 — 제품/파트너 원형 썸네일 */
.main-nav-sub-link {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.15rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}

.main-nav-sub-link__thumb-img {
  flex: 0 0 auto;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  object-fit: cover;
  object-position: center;
  background-color: #eef2f6;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.main-nav-sub-link__thumb-img--logo {
  object-fit: contain;
  padding: 0.28rem;
}

.main-nav-sub-link__thumb-img--danfoss {
  padding: 0.34rem 0.24rem;
}

.main-nav-sub-link__thumb-img--yokogawa {
  padding: 0.36rem 0.18rem;
}

.main-nav-sub-link__thumb-img--skarpenord {
  padding: 0.34rem 0.16rem;
}

.main-nav-sub-link__thumb-img--photo {
  object-fit: cover;
  padding: 0;
}

.main-nav-sub-link__label {
  flex: 1 1 auto;
  min-width: 0;
}

.page-nav-rail__dropdown .main-nav-sub-link {
  gap: 0.5rem;
}

/* 데스크톱: 부모(li) 폭에 맞춤 + 왼쪽 정렬, 메인 흰 바와 테두리 이질감 제거 */
@media (min-width: 992px) {
  .main-nav-links .main-nav-dropdown-hover {
    position: relative;
  }

  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
    left: 0 !important;
    right: auto !important;
    min-width: 100%;
    width: max-content;
    max-width: min(22rem, 85vw);
    padding: 0.35rem 0 0.65rem;
    border: none;
    border-radius: 0 0 0.5rem 0.5rem;
    box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.08);
    overflow: visible;
  }

  /* HD 마린솔루션형: 기본 1열(좁음) → 기업 개요·우측 패널 호버 시 2열로 확장 */
  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown.main-nav-mega {
    /* Emergency Shut Down System, Aircraft Nozzle Controller Test Equipment 등 최장 라벨 수용 */
    --main-nav-mega-expanded: min(38rem, calc(100vw - 2rem));
    /* 1열 + 좌→우 호버 브리지(0.65rem)까지 포함 */
    --main-nav-mega-collapsed: 14.5rem;
    width: var(--main-nav-mega-collapsed);
    min-width: var(--main-nav-mega-collapsed);
    max-width: min(42rem, 96vw);
    padding: 0;
    overflow: hidden;
    box-sizing: border-box;
    transition:
      width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
      min-width 0.28s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown.main-nav-mega:has(.main-nav-mega__primary-row--has-sub:hover),
  .main-nav-dropdown-hover
    > .dropdown-menu.main-nav-dropdown.main-nav-mega:has(.main-nav-mega__primary-row--has-sub:focus-within),
  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown.main-nav-mega:has(.main-nav-mega__col--secondary:hover),
  .main-nav-dropdown-hover
    > .dropdown-menu.main-nav-dropdown.main-nav-mega:has(.main-nav-mega__col--secondary:focus-within) {
    width: max-content;
    min-width: var(--main-nav-mega-expanded);
    max-width: min(42rem, calc(100vw - 2rem));
    /* 하위가 많을 때 높이는 내용만큼 늘어남. 뷰포트를 넘을 때만 패널 전체 스크롤 */
    max-height: min(88vh, calc(100dvh - 4.5rem));
    overflow-x: visible;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .main-nav-mega__layout {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 10.25rem;
  }

  .main-nav-mega__col--primary {
    flex: 0 0 13.75rem;
    padding: 0.4rem 0 0.55rem;
    background: #fff;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0;
    transition: border-radius 0.2s ease;
  }

  .main-nav-dropdown-hover
    > .dropdown-menu.main-nav-dropdown.main-nav-mega:not(:has(.main-nav-mega__primary-row--has-sub:hover)):not(
      :has(.main-nav-mega__primary-row--has-sub:focus-within)
    ):not(:has(.main-nav-mega__col--secondary:hover)):not(:has(.main-nav-mega__col--secondary:focus-within))
    .main-nav-mega__col--primary {
    border-bottom-right-radius: 0.5rem;
  }

  .main-nav-mega__primary-row--has-sub {
    position: relative;
  }

  /* 좌→우 이동 시 호버가 끊기지 않도록 투명 브리지 */
  .main-nav-mega__primary-row--has-sub::after {
    content: "";
    position: absolute;
    left: 100%;
    top: 0;
    width: 0.65rem;
    height: 100%;
    z-index: 6;
  }

  .main-nav-mega__divider {
    flex: 0 0 0;
    width: 0;
    align-self: stretch;
    margin: 0;
    background: rgba(0, 0, 0, 0.08);
    opacity: 0;
    overflow: hidden;
    transition:
      flex-basis 0.26s cubic-bezier(0.22, 1, 0.36, 1),
      opacity 0.2s ease,
      width 0.26s cubic-bezier(0.22, 1, 0.36, 1),
      margin 0.22s ease;
  }

  .main-nav-mega__col--secondary {
    position: relative;
    flex: 0 0 0;
    max-width: 0;
    min-width: 0;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border-bottom-right-radius: 0.5rem;
    pointer-events: none;
    /* max-width는 0↔수치만 보간됨(none 불가). 패널 너비 애니메이션은 상위 .main-nav-mega width가 담당 */
    transition:
      max-width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
      background-color 0.2s ease;
  }

  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub:hover) .main-nav-mega__divider,
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub:focus-within) .main-nav-mega__divider,
  .main-nav-mega__layout:has(.main-nav-mega__col--secondary:hover) .main-nav-mega__divider,
  .main-nav-mega__layout:has(.main-nav-mega__col--secondary:focus-within) .main-nav-mega__divider {
    flex: 0 0 1px;
    width: 1px;
    opacity: 1;
    margin: 0.35rem 0;
  }

  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub:hover) .main-nav-mega__col--secondary,
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub:focus-within) .main-nav-mega__col--secondary,
  .main-nav-mega__layout:has(.main-nav-mega__col--secondary:hover) .main-nav-mega__col--secondary,
  .main-nav-mega__layout:has(.main-nav-mega__col--secondary:focus-within) .main-nav-mega__col--secondary {
    flex: 1 1 auto;
    max-width: none;
    min-width: 0;
    background: #f3f6f8;
    overflow: visible;
    pointer-events: auto;
  }

  /* 절대배치+inset:0이면 우측 높이가 좌열에만 맞물려 내부 스크롤로 잘림 → 비표시는 display:none, 표시만 흐름에 올려 높이 가변 */
  .main-nav-mega__secondary-panel {
    display: none;
    position: relative;
    width: 100%;
    z-index: 0;
    box-sizing: border-box;
  }

  /* 자식에 visibility:visible을 두면 부모 hidden이 무시되어 모든 패널이 겹쳐 보임 — 반드시 inherit */
  .main-nav-mega__secondary-inner {
    position: relative;
    inset: auto;
    height: auto;
    min-height: 0;
    padding: 0.65rem 0.5rem 0.65rem 0.15rem;
    opacity: 1;
    visibility: inherit;
    pointer-events: inherit;
    overflow: visible;
    box-sizing: border-box;
    min-width: max-content;
  }

  .main-nav-mega__sub-list .dropdown-item,
  .main-nav-mega__sub-link {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  /* 다중 플라이아웃: data-mega 행 ↔ data-mega-panel 우측 패널 매칭 (GNB 섹션당 최대 ~20행) */
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="0"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="0"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="0"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="0"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="0"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="0"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="0"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="0"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="1"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="1"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="1"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="1"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="1"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="1"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="1"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="1"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="2"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="2"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="2"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="2"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="2"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="2"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="2"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="2"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="3"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="3"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="3"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="3"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="3"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="3"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="3"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="3"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="4"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="4"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="4"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="4"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="4"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="4"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="4"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="4"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="5"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="5"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="5"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="5"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="5"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="5"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="5"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="5"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="6"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="6"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="6"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="6"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="6"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="6"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="6"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="6"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="7"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="7"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="7"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="7"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="7"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="7"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="7"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="7"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="8"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="8"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="8"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="8"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="8"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="8"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="8"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="8"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="9"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="9"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="9"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="9"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="9"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="9"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="9"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="9"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="10"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="10"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="10"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="10"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="10"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="10"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="10"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="10"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="11"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="11"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="11"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="11"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="11"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="11"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="11"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="11"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="12"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="12"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="12"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="12"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="12"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="12"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="12"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="12"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="13"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="13"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="13"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="13"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="13"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="13"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="13"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="13"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="14"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="14"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="14"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="14"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="14"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="14"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="14"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="14"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="15"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="15"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="15"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="15"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="15"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="15"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="15"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="15"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="16"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="16"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="16"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="16"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="16"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="16"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="16"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="16"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="17"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="17"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="17"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="17"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="17"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="17"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="17"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="17"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="18"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="18"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="18"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="18"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="18"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="18"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="18"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="18"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="19"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="19"],
  .main-nav-mega__layout:has(.main-nav-mega__primary-row--has-sub[data-mega="19"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="19"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="19"]:hover) .main-nav-mega__secondary-panel[data-mega-panel="19"],
  .main-nav-mega__layout:has(.main-nav-mega__secondary-panel[data-mega-panel="19"]:focus-within)
    .main-nav-mega__secondary-panel[data-mega-panel="19"] {
    display: block;
    z-index: 2;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .main-nav-mega__sub-kicker {
    margin: 0 0.85rem 0.35rem;
    padding: 0 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6c757d;
  }

  .main-nav-mega__primary-row:not(:last-child) .dropdown-item {
    border-radius: 0;
  }

  .main-nav-mega__col--primary .main-nav-mega__primary-row:last-child .dropdown-item {
    border-bottom-left-radius: 0.5rem;
  }

  .main-nav-mega__sub-list li:last-child .dropdown-item {
    border-bottom-right-radius: 0.5rem;
  }

  .main-nav-mega__primary-row--has-sub .main-nav-mega__primary-link {
    font-weight: 600;
  }

  .main-nav-mega__chevron {
    flex-shrink: 0;
    user-select: none;
    opacity: 0.55;
    font-size: 1.1rem;
    line-height: 1;
  }

  .main-nav-mega__primary-row--has-sub:hover,
  .main-nav-mega__primary-row--has-sub:focus-within {
    background-color: rgba(10, 145, 137, 0.06);
  }

  .main-nav-dropdown .dropdown-item {
    padding-left: var(--bs-nav-link-padding-x, 0.75rem);
    padding-right: var(--bs-nav-link-padding-x, 0.75rem);
  }
}

/* 호버 시 상위 메뉴 텍스트: 밝은 배경 대비 강조색(반전에 가깝게) — 흰 탑바 규칙보다 구체적으로 */
:is(body.hero-video-page, body.content-subpage) .main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video {
  color: var(--main-nav-accent) !important;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:hover) .main-nav-section--skarpenord.main-nav-dropdown-hover:hover > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-dropdown-hover:focus-within) .main-nav-section--skarpenord.main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.hero-nav-on-video {
  color: var(--skarpenord-brand, #00a2a4) !important;
}

.navbar-light .main-nav-dropdown-hover:hover > .main-nav-dd-toggle.text-dark,
.navbar-light .main-nav-dropdown-hover:focus-within > .main-nav-dd-toggle.text-dark {
  color: var(--main-nav-accent) !important;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-links > .nav-item:not(.dropdown) .nav-link.hero-nav-on-video:hover,
:is(body.hero-video-page, body.content-subpage) .main-nav-links > .nav-item:not(.dropdown) .nav-link.hero-nav-on-video:focus {
  color: var(--main-nav-accent) !important;
}

.navbar-light .main-nav-links > .nav-item:not(.dropdown) .nav-link.text-dark:hover,
.navbar-light .main-nav-links > .nav-item:not(.dropdown) .nav-link.text-dark:focus {
  color: var(--main-nav-accent) !important;
}

.main-nav-dropdown .dropdown-item {
  color: #212529;
  font-size: 0.9rem;
  padding: 0.45rem 1.15rem;
}

.main-nav-dropdown .dropdown-item.main-nav-dropdown-item--nested {
  padding-left: 1.85rem;
  font-size: 0.875rem;
}

.main-nav-dropdown .dropdown-item:hover,
.main-nav-dropdown .dropdown-item:focus {
  background-color: rgba(10, 145, 137, 0.1);
  color: var(--main-nav-accent);
}

/* GNB: 플라이아웃 2열(데스크톱에서 우측으로 확장) */
@media (min-width: 992px) {
  .navbar-collapse.main-nav-collapse-inner {
    overflow: visible;
  }

  .main-nav-dropdown > li.main-nav-flyout {
    position: relative;
  }

  .main-nav-flyout__panel {
    display: none;
    position: absolute;
    left: calc(100% - 1px);
    top: 0;
    z-index: 1085;
    width: max-content;
    min-width: 11.85rem;
    max-width: min(24rem, calc(100vw - 2rem));
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.4rem;
    box-shadow: 0 0.45rem 1.1rem rgba(0, 0, 0, 0.14);
    pointer-events: none;
  }

  .main-nav-flyout:hover > .main-nav-flyout__panel,
  .main-nav-flyout:focus-within > .main-nav-flyout__panel {
    display: block;
    pointer-events: auto;
  }

  .main-nav-flyout__panel .dropdown-item {
    color: #212529;
    font-size: 0.9rem;
    padding: 0.45rem 1.15rem;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  .main-nav-flyout__panel .dropdown-item:hover,
  .main-nav-flyout__panel .dropdown-item:focus {
    background-color: rgba(10, 145, 137, 0.1);
    color: var(--main-nav-accent);
  }

  .main-nav-flyout__chevron {
    user-select: none;
    opacity: 0.55;
    font-size: 1.15rem;
    line-height: 1;
  }
}

@media (max-width: 991.98px) {
  .main-nav-flyout__panel {
    display: block !important;
    position: static !important;
    width: 100%;
    margin: 0 0 0.2rem 0;
    padding: 0.1rem 0 0.4rem !important;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent !important;
    pointer-events: auto !important;
    border-left: 2px solid rgba(0, 0, 0, 0.08);
    margin-left: 0.5rem;
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-flyout__panel {
    border-left-color: rgba(255, 255, 255, 0.2);
  }

  .main-nav-flyout__chevron {
    display: none !important;
  }

  .main-nav-flyout__panel .dropdown-item {
    padding-left: 1.1rem;
    font-size: 0.875rem;
  }

  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown.main-nav-mega {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  .main-nav-mega__layout {
    flex-direction: column;
    min-height: 0;
  }

  .main-nav-mega__col--primary {
    flex: none;
    width: 100%;
    padding: 0.2rem 0 0.15rem;
    border-bottom-left-radius: 0;
  }

  .main-nav-mega__col--primary .main-nav-mega__primary-row:last-child .dropdown-item {
    border-bottom-left-radius: 0;
  }

  .main-nav-mega__col--secondary {
    flex: none;
    width: 100%;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    overflow: visible !important;
    background: transparent !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom-left-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
  }

  .main-nav-mega__secondary-inner {
    position: static !important;
    inset: auto !important;
    padding: 0.35rem 0 0.55rem !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    overflow: visible !important;
    transition: none !important;
    height: auto !important;
  }

  .main-nav-mega__secondary-panel {
    display: block !important;
    position: static !important;
    inset: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    height: auto !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    margin-top: 0.15rem;
    padding-top: 0.1rem;
  }

  .main-nav-mega__secondary-panel:first-of-type {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
  }

  .main-nav-mega__sub-list li:last-child .dropdown-item {
    border-bottom-left-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
  }

  .main-nav-mega__primary-row--has-sub::after {
    display: none;
  }

  .main-nav-mega__chevron {
    display: none !important;
  }

  .main-nav-mega__divider {
    width: 100% !important;
    height: 1px;
    flex: 0 0 auto !important;
    margin: 0.15rem 0 !important;
    opacity: 1 !important;
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-mega__col--secondary {
    border-top-color: rgba(255, 255, 255, 0.14);
  }

  .main-nav-mega__sub-kicker {
    margin-bottom: 0.2rem;
  }

  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
    position: static !important;
    float: none;
    width: 100%;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    margin-top: 0.25rem !important;
    margin-bottom: 0.35rem !important;
    box-shadow: none;
    border-radius: 0.3rem;
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(11, 18, 32, 0.55);
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-dropdown .dropdown-item {
    color: rgba(255, 255, 255, 0.95);
  }

  :is(body.hero-video-page, body.content-subpage) .main-nav-dropdown .dropdown-item:hover,
  :is(body.hero-video-page, body.content-subpage) .main-nav-dropdown .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
  }

  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .main-nav-dropdown-hover
    > .dropdown-menu.main-nav-dropdown {
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #f8f9fa;
  }

  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .main-nav-dropdown
    .dropdown-item {
    color: #212529;
  }

  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .main-nav-dropdown
    .dropdown-item:hover,
  :is(body.hero-video-page, body.content-subpage).site-header--gnb-solid-scroll
    .main-nav-dropdown
    .dropdown-item:focus {
    background-color: rgba(10, 145, 137, 0.1);
    color: var(--main-nav-accent);
  }

  body:not(.hero-video-page):not(.content-subpage) .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #f8f9fa;
  }

  body:not(.hero-video-page):not(.content-subpage) .main-nav-dropdown .dropdown-item {
    color: #212529;
  }

  body:not(.hero-video-page):not(.content-subpage) .main-nav-dropdown .dropdown-item:hover,
  body:not(.hero-video-page):not(.content-subpage) .main-nav-dropdown .dropdown-item:focus {
    background-color: rgba(10, 145, 137, 0.1);
    color: var(--main-nav-accent);
  }
}

button.main-nav-dd-toggle {
  cursor: pointer;
}

/* GNB — 공지사항 (Skarpenord 테마 강조) */
body.hero-video-page,
body.content-subpage {
  --skarpenord-brand: #00a2a4;
  --skarpenord-brand-text: #007678;
  --skarpenord-accent: #57babe;
}

.main-nav-section--skarpenord > .main-nav-dd-toggle.text-dark,
.main-nav-section--skarpenord > .nav-link.text-dark {
  color: var(--skarpenord-brand-text, #007678) !important;
  font-weight: 700;
}

.main-nav-section--skarpenord.main-nav-section--active > .main-nav-dd-toggle.text-dark,
.main-nav-section--skarpenord.main-nav-section--active > .nav-link.text-dark,
.main-nav-section--skarpenord > .main-nav-dd-toggle.text-dark:hover,
.main-nav-section--skarpenord > .nav-link.text-dark:hover,
.main-nav-section--skarpenord:hover > .main-nav-dd-toggle.text-dark,
.main-nav-section--skarpenord:focus-within > .main-nav-dd-toggle.text-dark {
  color: var(--skarpenord-brand, #00a2a4) !important;
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .main-nav-section--skarpenord > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent .main-nav-section--skarpenord > .nav-link.hero-nav-on-video {
  color: var(--skarpenord-accent, #57babe) !important;
  font-weight: 700 !important;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord.main-nav-section--active > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord:hover > .main-nav-dd-toggle.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .main-nav-section--skarpenord:focus-within > .main-nav-dd-toggle.hero-nav-on-video {
  color: var(--skarpenord-brand, #00a2a4) !important;
}

@media (prefers-reduced-motion: reduce) {
  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown {
    transition-duration: 0.01ms !important;
    transform: none !important;
  }

  .main-nav-dropdown-hover > .dropdown-menu.main-nav-dropdown.main-nav-mega,
  .main-nav-mega__divider,
  .main-nav-mega__col--secondary,
  .main-nav-mega__secondary-panel,
  .main-nav-mega__secondary-inner {
    transition-duration: 0.01ms !important;
  }
}

:is(body.hero-video-page, body.content-subpage) .main-nav-lang {
  color: rgba(255, 255, 255, 0.92);
}

:is(body.hero-video-page, body.content-subpage) .main-nav-lang-item {
  color: inherit;
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  padding: 0.15rem 0.1rem;
  opacity: 0.85;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-lang-item--active {
  opacity: 1;
  border-bottom: 2px solid currentColor;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-lang-item--muted {
  opacity: 0.45;
}

@media (hover: hover) and (pointer: fine) {
  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-lang {
    color: #212529;
  }

  :is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-lang-item--muted {
    opacity: 0.55;
    color: #6c757d;
  }
}

.navbar-light .main-nav-lang {
  color: #495057;
}

.navbar-light .main-nav-lang-item {
  color: inherit;
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.08em;
}

.navbar-light .main-nav-lang-item--active {
  color: #212529;
  border-bottom: 2px solid #0d6efd;
}

.navbar-light .main-nav-lang-item:hover {
  color: #0d6efd;
}

.main-nav-shop-link {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  color: inherit;
  border-bottom: 2px solid transparent;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
}

.main-nav-shop-link:hover {
  color: #004080;
  border-bottom-color: #004080;
}

.main-nav-shop-link--active {
  border-bottom-color: currentColor;
}

:is(body.hero-video-page, body.content-subpage) .main-nav-shop-link.hero-nav-on-video {
  color: rgba(255, 255, 255, 0.92);
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-shop-link.hero-nav-on-video,
:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:has(.main-nav-trailing:hover) .main-nav-shop-link.hero-nav-on-video {
  color: #212529;
}

.navbar-light .main-nav-shop-link {
  color: #495057;
}

.navbar-light .main-nav-shop-link:hover,
.navbar-light .main-nav-shop-link--active {
  color: #004080;
  border-bottom-color: #004080;
}

.hero-title-lines .hero-title-line {
  display: block;
}

/* 넓은 화면에서 논리적 한 줄씩 물리적 한 줄로(좁은 기기에서는 자동 줄바꿈 허용) */
@media (min-width: 992px) {
  .hero-title-lines .hero-title-line {
    white-space: nowrap;
  }
}

.text-shadow {
  text-shadow: 0 0.15rem 0.75rem rgba(0, 0, 0, 0.85);
}

.text-shadow-sm {
  text-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.75);
}

@media (prefers-reduced-motion: reduce) {
  .hero-viewport .hero-video-bg {
    display: none;
  }

  .hero-viewport .hero-video-root-inner {
    background: radial-gradient(circle at 30% 20%, #1a2a4a, #0b1220 55%);
  }

  .hero-video-controls {
    display: none !important;
  }
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* ----- + NOW 트리거 + 우측 슬라이드 화이트 패널 (뷰포트 고정, 스크롤 본문과 무관) ----- */
.floating-nav-root {
  position: fixed;
  inset: 0;
  z-index: 1080;
  pointer-events: none;
}

.floating-nav-root.is-open {
  pointer-events: auto;
}

.floating-nav-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.28s ease;
  pointer-events: none;
}

.floating-nav-root.is-open .floating-nav-backdrop {
  opacity: 1;
  pointer-events: auto;
}

.floating-now-panel {
  position: absolute;
  top: auto;
  right: max(0.65rem, env(safe-area-inset-right, 0px));
  bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
  left: auto;
  z-index: 1;
  pointer-events: auto;
  /* HD 마린 +NOW: 가로 넓게, 세로는 약 40~45vh — 외곽은 투명, 실제 박스는 .floating-now-panel-surface */
  width: min(1080px, 70vw, calc(100vw - 1.25rem));
  height: min(52vh, calc(100dvh - 5.5rem));
  max-height: min(52vh, calc(100dvh - 5.5rem));
  min-height: 16.5rem;
  display: flex;
  flex-direction: column;
  padding-top: 2.25rem;
  background: transparent;
  color: #1a1a1a;
  border: none;
  box-shadow: none;
  overflow: visible;
  transform: translateX(calc(100% + 1.25rem));
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.floating-nav-root.is-open .floating-now-panel {
  transform: translateX(0);
}

/* 흰 박스 밖·우상단 닫기 (어두운 배경 위에서 보이도록) */
.floating-now-close-outside {
  position: absolute;
  top: 0.1rem;
  right: 0.35rem;
  z-index: 2;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  margin: 0;
  opacity: 0.92;
  filter: invert(1) drop-shadow(0 0.06rem 0.2rem rgba(0, 0, 0, 0.5));
}

.floating-now-close-outside:hover {
  opacity: 1;
}

.floating-now-close-outside:focus-visible {
  opacity: 1;
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 3px;
}

/* HD 마린형: 둥근 사각 화이트 컨테이너 + 내부 3분할 */
.floating-now-panel-surface {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  color: #111;
  border-radius: 1.125rem;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow:
    0 0.35rem 1.5rem rgba(0, 0, 0, 0.1),
    0 1rem 2.5rem rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.floating-now-panel-body {
  display: grid;
  grid-template-columns: minmax(0, 1.85fr) minmax(160px, 0.9fr);
  gap: 1.1rem 1.25rem;
  padding: 1.2rem 1.35rem 1.35rem 1.45rem;
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.floating-now-panel-body--with-media {
  grid-template-columns: minmax(0, 1.35fr) minmax(100px, 0.95fr) minmax(148px, 1fr);
}

.floating-now-panel-body--news-wide .floating-now-col--news {
  min-width: 0;
}

.floating-now-panel-body--news-wide .floating-now-news-title {
  font-size: 0.98rem;
}

.floating-now-news-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 0.85rem;
  margin-bottom: 0.75rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.floating-now-industry-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 0.65rem;
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
  flex: 1 1 12rem;
  min-width: 0;
}

.floating-now-industry-tab {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0.2rem 0;
  font-size: 0.82rem;
  font-weight: 600;
  color: #868e96;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}

.floating-now-industry-tab.is-active {
  color: #111;
  border-bottom-color: #004080;
}

.floating-now-industry-tab:hover,
.floating-now-industry-tab:focus-visible {
  color: #004080;
}

.floating-now-industry-panel:not(.is-active) {
  display: none;
}

.floating-now-procurement-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
}

.floating-now-procurement-tab {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.15rem 0.35rem;
  border-bottom: 2px solid transparent;
}

.floating-now-procurement-tab.is-active {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.9);
}

.floating-now-procurement-subpanel:not(.is-active) {
  display: none;
}

.floating-now-industry-list-wrap {
  max-height: min(42vh, 20rem);
  overflow-y: auto;
  margin-right: -0.2rem;
  padding-right: 0.35rem;
}

.floating-now-industry-updated {
  font-size: 0.72rem;
}

.floating-now-industry-more__link {
  font-size: 0.82rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.floating-now-industry-more__link:hover,
.floating-now-industry-more__link:focus-visible {
  text-decoration: underline;
}

.floating-now-panel-body--news-wide {
  grid-template-columns: minmax(0, 2fr) minmax(150px, 0.82fr);
}

.floating-now-news-section-title {
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: none;
  color: #111;
  margin: 0;
  flex: 0 0 auto;
}

.floating-now-news-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.floating-now-news-item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.floating-now-news-item:last-child {
  border-bottom: none;
}

.floating-now-news-link,
.floating-now-news-static {
  padding: 0.85rem 0;
  text-decoration: none;
  color: inherit;
}

.floating-now-news-link.industry-news-list-item__link {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
}

.floating-now-news-link:hover .floating-now-news-title,
.floating-now-news-link:focus-visible .floating-now-news-title {
  color: #004080;
}

.floating-now-news-title {
  display: block;
  font-weight: 700;
  font-size: 0.95rem;
  line-height: 1.35;
}

.floating-now-news-source {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #4a5562;
}

.floating-now-news-date {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8rem;
  color: #868e96;
}

.floating-now-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.floating-now-quick-link {
  font-size: 0.85rem;
  font-weight: 600;
  color: #004080;
  text-decoration: none;
}

.floating-now-quick-link:hover,
.floating-now-quick-link:focus-visible {
  text-decoration: underline;
}

.floating-now-media-figure,
.floating-now-media-placeholder {
  height: 100%;
  min-height: clamp(6.5rem, 18vh, 9.5rem);
  border-radius: 0.875rem;
  overflow: hidden;
}

.floating-now-media-img {
  width: 100%;
  height: 100%;
  min-height: clamp(6.5rem, 18vh, 9.5rem);
  object-fit: cover;
  display: block;
}

.floating-now-media-placeholder {
  background: linear-gradient(145deg, #1e3a5f 0%, #0b1220 55%, #1a3050 100%);
}

.floating-now-col--cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-self: stretch;
}

.floating-now-panel-body--news-wide .floating-now-col--cards,
.floating-now-panel-body--with-media .floating-now-col--cards {
  min-height: 100%;
}

.floating-now-card {
  position: relative;
  flex: 1 1 0;
  min-height: 9rem;
  padding: 1.15rem 1.1rem 1.1rem;
  border-radius: 1rem;
  text-decoration: none;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  overflow: hidden;
  box-shadow: 0 0.25rem 0.85rem rgba(0, 0, 0, 0.14);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;
  background-size: cover;
  background-position: center;
}

.floating-now-card--esg,
.floating-now-card--contact {
  justify-content: space-between;
  min-height: 9.5rem;
}

.floating-now-card--esg .floating-now-card-lead,
.floating-now-card--contact .floating-now-card-lead {
  margin-top: auto;
  padding-top: 0.45rem;
}

.floating-now-card:hover,
.floating-now-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 0.5rem 1.25rem rgba(0, 0, 0, 0.22);
  color: #fff;
}

.floating-now-card--esg:not(.floating-now-card--esg-hasimg) {
  background-image: linear-gradient(135deg, #0a5f6e 0%, #004d5c 40%, #003a4a 100%);
}

.floating-now-card--esg-hasimg {
  background-blend-mode: multiply;
}

.floating-now-card-title {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.25;
  text-shadow: 0 1px 0.35rem rgba(0, 0, 0, 0.35);
}

.floating-now-card--contact .floating-now-card-title {
  margin-bottom: 0;
}

.floating-now-card-lead {
  font-size: 0.78rem;
  line-height: 1.45;
  font-weight: 500;
  opacity: 0.95;
  text-shadow: 0 1px 0.25rem rgba(0, 0, 0, 0.25);
}

/* 맨 위로: HD현대마린솔루션 .btn-top 스타일(56px·SVG 배경·호버 남색), +NOW와 겹침 시 상단 배치 */
.site-scroll-top-fab {
  --site-scroll-fab-size: 3.5rem;
  --site-scroll-fab-gap: 0.65rem;
  --floating-now-h: 3.125rem;
  position: fixed;
  z-index: 1085;
  bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
  right: max(1rem, env(safe-area-inset-right, 0px));
  width: var(--site-scroll-fab-size);
  height: var(--site-scroll-fab-size);
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(0.35rem);
  transition:
    opacity 0.4s ease,
    visibility 0.4s ease,
    transform 0.4s ease;
}

.site-scroll-top-fab--visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.site-scroll-top-fab__btn {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  background-color: transparent;
  background-image: url("/images/site-scroll-top-ms-default.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  box-shadow: 0 0.4rem 1.35rem rgba(0, 64, 128, 0.38);
  transition:
    background-image 0.22s ease,
    box-shadow 0.22s ease,
    transform 0.22s ease;
}

.site-scroll-top-fab__btn:hover {
  background-image: url("/images/site-scroll-top-ms-hover.svg");
  box-shadow: 0 0.5rem 1.5rem rgba(0, 64, 128, 0.48);
  transform: translateY(-1px);
}

.site-scroll-top-fab__btn:focus-visible {
  outline: 2px solid #004080;
  outline-offset: 3px;
}

body.content-subpage--yokogawa .site-scroll-top-fab__btn {
  position: relative;
  background-color: var(--yokogawa-yellow, #ffd100);
  background-image: none;
  border: 1px solid var(--yokogawa-yellow-border, #e6bc00);
  box-shadow: 0 0.25rem 0.85rem rgba(0, 0, 0, 0.14);
}

body.content-subpage--yokogawa .site-scroll-top-fab__btn::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.65rem;
  height: 0.65rem;
  border-left: 2px solid var(--yokogawa-text, #111);
  border-top: 2px solid var(--yokogawa-text, #111);
  transform: translate(-50%, -35%) rotate(45deg);
}

body.content-subpage--yokogawa .site-scroll-top-fab__btn:hover {
  background-color: var(--yokogawa-yellow-hover, #f5c400);
  background-image: none;
}

body.content-subpage--yokogawa .site-scroll-top-fab__btn:focus-visible {
  outline-color: var(--yokogawa-yellow, #ffd100);
}

body.has-floating-now .site-scroll-top-fab {
  bottom: calc(max(1.25rem, env(safe-area-inset-bottom, 0px)) + var(--floating-now-h) + var(--site-scroll-fab-gap));
}

body.floating-nav-open .site-scroll-top-fab {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.94);
}

@media (max-width: 1023.98px) {
  .site-scroll-top-fab {
    --site-scroll-fab-size: 3rem;
  }

  .site-scroll-top-fab__btn {
    transition: none;
  }

  .site-scroll-top-fab__btn:hover {
    background-image: url("/images/site-scroll-top-ms-default.svg");
  }

  body.content-subpage--yokogawa .site-scroll-top-fab__btn:hover {
    background-image: none;
    background-color: var(--yokogawa-yellow-hover, #f5c400);
  }
}

.floating-now-trigger {
  position: fixed;
  z-index: 1090;
  bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
  right: max(1rem, env(safe-area-inset-right, 0px));
  min-width: 7.5rem;
  height: 3.125rem;
  padding: 0 1.35rem;
  border: none;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  box-shadow: 0 0.4rem 1.35rem rgba(0, 0, 0, 0.38);
  transition:
    opacity 0.22s ease,
    visibility 0.22s ease,
    transform 0.22s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}

.floating-now-trigger:hover {
  filter: brightness(1.08);
  box-shadow: 0 0.45rem 1.5rem rgba(0, 0, 0, 0.42);
}

.floating-now-trigger-label {
  pointer-events: none;
}

body.floating-nav-open .floating-now-trigger {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.94);
}

body.floating-nav-open {
  overflow: hidden;
}

body.floating-nav-open .home-marine-float-nav,
body.floating-nav-open .home-marine-float-nav__box {
  pointer-events: none;
}

.floating-now-industry-more__link,
.floating-now-quick-link {
  position: relative;
  z-index: 2;
}

@media (max-width: 991.98px) {
  .floating-now-panel {
    width: calc(100vw - 1rem);
    height: min(78vh, calc(100dvh - 2.5rem));
    max-height: min(78vh, calc(100dvh - 2.5rem));
    padding-top: 2rem;
  }

  .floating-now-panel-surface {
    border-radius: 1rem;
  }

  .floating-now-panel-body {
    grid-template-columns: 1fr;
    padding-left: 1.25rem;
    padding-right: 1.1rem;
  }

  .floating-now-panel-body--with-media .floating-now-col--media {
    order: 2;
  }

  .floating-now-col--cards {
    flex-direction: row;
    order: 3;
  }

  .floating-now-card {
    min-height: 8.5rem;
  }

  .floating-now-card--esg,
  .floating-now-card--contact {
    min-height: 8.5rem;
  }
}

@media (max-width: 575.98px) {
  .floating-now-col--cards {
    flex-direction: column;
  }

  .floating-now-trigger {
    min-width: 6.75rem;
    height: 2.85rem;
    font-size: 0.85rem;
  }

  body.has-floating-now .site-scroll-top-fab {
    --floating-now-h: 2.85rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .floating-nav-backdrop,
  .floating-now-panel,
  .floating-now-panel-surface,
  .floating-now-close-outside,
  .floating-now-trigger,
  .floating-now-card,
  .site-scroll-top-fab,
  .site-scroll-top-fab__btn {
    transition-duration: 0.01ms !important;
  }
}

/* ----- 조선·해양 제품군 (구 robustech.co.kr sub05) ----- */
.company-overview-tabs--wrap {
  flex-wrap: wrap;
  row-gap: 0.35rem;
}

.content-subpage-main--shipbuilding-line {
  max-width: 72rem;
}

.shipbuilding-line__series + .shipbuilding-line__series {
  margin-top: clamp(2.5rem, 5vw, 3.75rem);
  padding-top: clamp(2rem, 4vw, 3rem);
  border-top: 1px solid rgba(0, 38, 62, 0.1);
}

.shipbuilding-line__series-title {
  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
  font-weight: 700;
  color: var(--ref-hd-marine-blue-primary, #003087);
  margin-bottom: 1.25rem;
  line-height: 1.35;
}

.shipbuilding-line__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
  gap: clamp(0.85rem, 2vw, 1.35rem);
  align-items: stretch;
}

.shipbuilding-line__card {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.shipbuilding-line__card-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
  min-height: 11.5rem;
  padding: 0.85rem 0.65rem 1rem;
  border-radius: 0.85rem;
  background: #fff;
  border: 1px solid rgba(0, 38, 62, 0.08);
  box-shadow: 0 0.35rem 1.1rem rgba(0, 38, 62, 0.06);
  overflow: hidden;
  transition:
    min-height 0.28s ease,
    transform 0.28s ease,
    border-color 0.2s ease,
    box-shadow 0.28s ease;
}

.shipbuilding-line__thumb {
  width: 100%;
  height: 6.75rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.65rem;
  overflow: hidden;
  transition: height 0.28s ease;
}

.shipbuilding-line__thumb img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.shipbuilding-line__thumb--placeholder {
  background: linear-gradient(145deg, #e8eef5 0%, #f4f6f8 100%);
}

.shipbuilding-line__model {
  font-weight: 700;
  font-size: 0.95rem;
  color: #00263e;
  width: 100%;
}

.shipbuilding-line__subtitle {
  font-size: 0.8rem;
  color: #63666a;
  margin-top: 0.25rem;
  width: 100%;
  min-height: 2.35rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.shipbuilding-line__spec-tooltip-source {
  display: none !important;
}

.shipbuilding-line__spec-tooltip--floating {
  position: fixed;
  z-index: 1080;
  max-width: min(18.5rem, calc(100vw - 1.5rem));
  padding: 0.7rem 0.8rem;
  border-radius: 0.6rem;
  background: #fff;
  border: 1px solid rgba(0, 38, 62, 0.12);
  box-shadow: 0 0.55rem 1.35rem rgba(0, 38, 62, 0.16);
  pointer-events: none;
  text-align: left;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: #0f1419;
}

.shipbuilding-line__spec-tooltip--floating.shipbuilding-line__spec-tooltip--media {
  max-width: min(31rem, calc(100vw - 1.5rem));
  padding: 0;
  overflow: hidden;
}

.shipbuilding-line__spec-tooltip-layout {
  display: grid;
  grid-template-columns: minmax(10rem, 12.5rem) minmax(0, 1fr);
  align-items: stretch;
  min-height: 100%;
}

.shipbuilding-line__spec-tooltip-figure {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 0.45rem;
  background: linear-gradient(165deg, #f4f7fc 0%, #e8eef8 100%);
  border-right: 1px solid rgba(0, 38, 62, 0.08);
}

.shipbuilding-line__spec-tooltip-image {
  display: block;
  width: 100%;
  max-height: 12.5rem;
  object-fit: contain;
  filter: drop-shadow(0 0.35rem 0.75rem rgba(0, 38, 62, 0.12));
}

.shipbuilding-line__spec-tooltip-content {
  padding: 0.72rem 0.82rem 0.78rem;
  min-width: 0;
}

.shipbuilding-line__spec-tooltip-summary {
  margin: 0 0 0.45rem;
  font-size: 0.75rem;
  line-height: 1.4;
  color: rgba(0, 38, 62, 0.72);
}

body.content-subpage .shipbuilding-line__spec-tooltip--floating.shipbuilding-line__spec-tooltip--media {
  border-color: rgba(0, 38, 106, 0.14);
  box-shadow: 0 0.65rem 1.5rem rgba(0, 38, 106, 0.18);
}

body.content-subpage .shipbuilding-line__spec-tooltip-figure {
  background: linear-gradient(165deg, #eef3fb 0%, #dce6f6 100%);
}

body.content-subpage .shipbuilding-line__spec-tooltip-content .shipbuilding-line__spec-tooltip-title {
  color: var(--bd-brand, var(--ref-hd-marine-blue-primary, #003087));
}

.shipbuilding-line__spec-tooltip-title {
  font-weight: 700;
  font-size: 0.875rem;
  color: var(--ref-hd-marine-blue-primary, #003087);
  margin: 0 0 0.45rem;
}

.shipbuilding-line__spec-tooltip-list {
  margin: 0;
}

.shipbuilding-line__spec-tooltip-row {
  display: grid;
  grid-template-columns: minmax(4.75rem, 38%) 1fr;
  gap: 0.35rem 0.55rem;
  margin-bottom: 0.28rem;
}

.shipbuilding-line__spec-tooltip-row:last-child {
  margin-bottom: 0;
}

.shipbuilding-line__spec-tooltip-row dt {
  font-weight: 600;
  color: rgba(0, 38, 62, 0.72);
  margin: 0;
}

.shipbuilding-line__spec-tooltip-row dd {
  margin: 0;
  color: #0f1419;
}

.shipbuilding-line__spec-tooltip-item--plain {
  margin: 0 0 0.28rem;
  padding-left: 0.4rem;
  border-left: 2px solid rgba(0, 48, 135, 0.28);
  color: #0f1419;
}

.shipbuilding-line__spec-tooltip-item--plain:last-child {
  margin-bottom: 0;
}

@media (max-width: 575.98px) {
  .shipbuilding-line__spec-tooltip--floating.shipbuilding-line__spec-tooltip--media {
    max-width: min(22rem, calc(100vw - 1rem));
  }

  .shipbuilding-line__spec-tooltip-layout {
    grid-template-columns: minmax(8rem, 9.5rem) minmax(0, 1fr);
  }

  .shipbuilding-line__spec-tooltip-image {
    max-height: 10rem;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .shipbuilding-line__spec-tooltip--floating[hidden="false"],
  .shipbuilding-line__spec-tooltip--floating:not([hidden]) {
    animation: shipbuilding-spec-tooltip-in 0.14s ease;
  }
}

@keyframes shipbuilding-spec-tooltip-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.shipbuilding-line__card-link {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
  .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
    min-height: 14.25rem;
    transform: translateY(-4px) scale(1.02);
    border-color: #0070c9;
    box-shadow: 0 0.65rem 1.35rem rgba(0, 38, 62, 0.14);
    position: relative;
    z-index: 2;
  }

  .shipbuilding-line__card-link:hover .shipbuilding-line__thumb,
  .shipbuilding-line__card:hover > .shipbuilding-line__card-inner .shipbuilding-line__thumb {
    height: 8.75rem;
  }
}

.shipbuilding-line__card-link:focus-visible .shipbuilding-line__card-inner,
.shipbuilding-line__card:focus-within > .shipbuilding-line__card-inner {
  border-color: #0070c9;
  box-shadow: 0 0.35rem 1rem rgba(0, 38, 62, 0.12);
  outline: none;
}

.shipbuilding-line__card-link:focus-visible {
  outline: 2px solid #0070c9;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .shipbuilding-line__card-inner,
  .shipbuilding-line__thumb {
    transition: none;
  }

  .shipbuilding-line__card-link:hover .shipbuilding-line__card-inner,
  .shipbuilding-line__card:hover > .shipbuilding-line__card-inner {
    transform: none;
  }
}

/* 사업부문·Agency 카탈로그: 시리즈·품목 수에 맞춘 적응형 카드 배치 */
.shipbuilding-line--adaptive {
  --shipbuilding-card-min-h: 11.5rem;
  --shipbuilding-thumb-h: 6.75rem;
}

.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2.5vw, 1.5rem);
}

@media (min-width: 768px) {
  .shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: clamp(1.25rem, 3vw, 2rem);
  }
}

@media (min-width: 992px) {
  .shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: clamp(1.25rem, 3vw, 2rem);
  }
}

.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__series + .shipbuilding-line__series,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__series + .shipbuilding-line__series {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__series,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__series {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__series-title,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__series-title {
  margin-bottom: 1rem;
}

.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__grid,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__grid {
  flex: 1 1 auto;
}

.shipbuilding-line--adaptive .shipbuilding-line__grid {
  margin-inline: auto;
  width: 100%;
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"] {
  grid-template-columns: 1fr;
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"],
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-cols="2"] {
  grid-template-columns: 1fr;
}

@media (min-width: 576px) {
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"],
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-cols="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"],
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-cols="3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-cols="4"] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .shipbuilding-line--adaptive.shipbuilding-line--series-cols-1 .shipbuilding-line__grid[data-product-count="5"] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"] .shipbuilding-line__card,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"] .shipbuilding-line__card-link,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"] .shipbuilding-line__card,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"] .shipbuilding-line__card-link,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"] .shipbuilding-line__card,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"] .shipbuilding-line__card-link,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__card,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__card-link,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__card,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__card-link {
  height: 100%;
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"] .shipbuilding-line__card-inner,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"] .shipbuilding-line__card-inner,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"] .shipbuilding-line__card-inner,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__card-inner,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__card-inner {
  min-height: var(--shipbuilding-card-min-h);
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"] .shipbuilding-line__thumb,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"] .shipbuilding-line__thumb,
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"] .shipbuilding-line__thumb,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__thumb,
.shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__thumb {
  height: var(--shipbuilding-thumb-h);
}

.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"],
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"],
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"],
.shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="4"] {
  --shipbuilding-card-min-h: clamp(14.5rem, 30vh, 19.5rem);
  --shipbuilding-thumb-h: clamp(8.25rem, 18vh, 11.5rem);
}

@media (min-width: 992px) {
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="1"],
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="2"],
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="3"],
  .shipbuilding-line--adaptive .shipbuilding-line__grid[data-product-count="4"],
  .shipbuilding-line--adaptive.shipbuilding-line--series-cols-2 .shipbuilding-line__card-inner,
  .shipbuilding-line--adaptive.shipbuilding-line--series-cols-3 .shipbuilding-line__card-inner {
    --shipbuilding-card-min-h: clamp(15.5rem, 34vh, 21rem);
    --shipbuilding-thumb-h: clamp(9rem, 20vh, 12.5rem);
  }
}

/* ----- Danfoss PDP (store.danfoss.com product page concept) ----- */
body.content-subpage .content-subpage-main--danfoss-pdp {
  max-width: min(1180px, 100%);
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 3vw, 2rem) !important;
  padding-top: clamp(1rem, 2vh, 1.5rem) !important;
  padding-bottom: clamp(2.5rem, 6vh, 4rem) !important;
  background: #fff;
}

.danfoss-pdp--store {
  --danfoss-red: #e2000f;
  --danfoss-text: #1a1a1a;
  --danfoss-muted: #5c5c5c;
  --danfoss-border: #e0e0e0;
  --danfoss-surface: #f5f5f5;
}

.danfoss-pdp__back {
  margin-bottom: 1rem;
}

.danfoss-pdp__back-link {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--danfoss-muted, #5c5c5c);
  text-decoration: none;
}

.danfoss-pdp__back-link:hover {
  color: var(--danfoss-red, #e2000f);
  text-decoration: underline;
}

.danfoss-pdp__hero {
  display: grid;
  gap: 1.5rem 2rem;
  margin-bottom: 0;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--danfoss-border, #e0e0e0);
}

@media (min-width: 768px) {
  .danfoss-pdp__hero {
    grid-template-columns: minmax(220px, 320px) 1fr;
    align-items: start;
  }
}

.danfoss-pdp__hero--simple {
  grid-template-columns: minmax(12rem, 18rem) 1fr;
}

.danfoss-pdp__media {
  display: flex;
  justify-content: center;
}

.danfoss-pdp__image-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 320px;
  min-height: 220px;
  padding: 1.25rem;
  background: var(--danfoss-surface, #f5f5f5);
  border: 1px solid var(--danfoss-border, #e0e0e0);
}

.danfoss-pdp__image-frame img {
  max-width: 100%;
  max-height: 280px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.danfoss-pdp__category {
  font-size: 0.85rem;
  color: var(--danfoss-muted, #5c5c5c);
  margin: 0;
}

.danfoss-pdp__variant-title {
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  font-weight: 400;
  line-height: 1.45;
  color: var(--danfoss-text, #1a1a1a);
  margin: 0 0 0.75rem;
}

.danfoss-pdp__order-no {
  font-size: clamp(1.75rem, 3.5vw, 2.25rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.02em;
  color: var(--danfoss-text, #1a1a1a);
  margin: 0 0 0.65rem !important;
}

.danfoss-pdp__quick-spec {
  font-size: 0.95rem;
  color: var(--danfoss-muted, #5c5c5c);
  line-height: 1.5;
}

.danfoss-pdp__actions {
  margin-top: 1.25rem;
}

.danfoss-pdp__btn-inquiry {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 7.5rem;
  padding: 0.65rem 1.5rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  background: var(--danfoss-red, #e2000f);
  border: 1px solid var(--danfoss-red, #e2000f);
  border-radius: 0;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

.danfoss-pdp__btn-inquiry:hover {
  color: #fff;
  background: #b8000c;
  border-color: #b8000c;
}

.danfoss-pdp--yokogawa {
  --yokogawa-yellow: #ffd100;
  --yokogawa-yellow-hover: #f5c400;
  --yokogawa-yellow-border: #e6bc00;
  --yokogawa-text: #111;
}

.danfoss-pdp--business-division {
  --pdp-brand: var(--robustech-brand, #003087);
  --pdp-brand-hover: var(--robustech-brand-hover, #00266a);
  --pdp-brand-accent: var(--robustech-brand-accent, #004282);
  --pdp-surface: var(--robustech-brand-tab-bg, #e4ebf5);
  --pdp-surface-strong: #d5e0f2;
  --pdp-text: #1a1a1a;
  --pdp-muted: #4a5568;
  --pdp-border: #c5d4e8;
  --danfoss-red: var(--pdp-brand);
  --danfoss-text: var(--pdp-text);
  --danfoss-muted: var(--pdp-muted);
  --danfoss-border: var(--pdp-border);
  --danfoss-surface: var(--pdp-surface);
}

.danfoss-pdp--business-division .danfoss-pdp__back-link {
  color: var(--pdp-muted);
}

.danfoss-pdp--business-division .danfoss-pdp__back-link:hover {
  color: var(--pdp-brand);
}

.danfoss-pdp--business-division .danfoss-pdp__image-frame {
  background: var(--pdp-surface);
  border-color: var(--pdp-border);
}

.danfoss-pdp--business-division .danfoss-pdp__category {
  color: var(--pdp-brand-accent);
  font-weight: 600;
  letter-spacing: 0.01em;
}

.danfoss-pdp--business-division .danfoss-pdp__variant-title {
  color: var(--pdp-brand);
  font-weight: 700;
}

.danfoss-pdp--business-division .danfoss-pdp__hero {
  border-bottom-color: var(--pdp-border);
}

.danfoss-pdp--business-division .danfoss-pdp__btn-inquiry {
  color: #fff;
  background: var(--pdp-brand);
  border-color: var(--pdp-brand);
}

.danfoss-pdp--business-division .danfoss-pdp__btn-inquiry:hover {
  color: #fff;
  background: var(--pdp-brand-hover);
  border-color: var(--pdp-brand-hover);
}

.danfoss-pdp--business-division .danfoss-pdp__btn-inquiry:focus-visible {
  outline: 2px solid var(--pdp-brand);
  outline-offset: 2px;
}

.danfoss-pdp--business-division .danfoss-pdp__intro {
  color: var(--pdp-muted);
}

.danfoss-pdp--business-division .danfoss-pdp__spec-group-title {
  color: var(--pdp-brand);
  padding-bottom: 0.35rem;
  border-bottom: 2px solid var(--pdp-surface-strong);
}

.danfoss-pdp--business-division .danfoss-pdp__features {
  background: var(--pdp-surface);
  border-left: 4px solid var(--pdp-brand);
}

.danfoss-pdp--business-division .danfoss-pdp__features li::before {
  color: var(--pdp-brand);
  font-weight: 700;
}

.danfoss-pdp--business-division .danfoss-pdp__table--striped tbody tr:nth-child(odd) {
  background-color: var(--pdp-surface);
}

.danfoss-pdp--business-division .danfoss-pdp__table th {
  color: var(--pdp-brand-accent);
}

body.content-subpage--business-division .content-subpage-main--business-division-pdp {
  background: #fff;
}

body.content-subpage--business-division .danfoss-pdp--business-division .danfoss-pdp__btn-inquiry {
  background: var(--robustech-brand, #003087);
  border-color: var(--robustech-brand, #003087);
}

body.content-subpage--business-division .danfoss-pdp--business-division .danfoss-pdp__btn-inquiry:hover {
  background: var(--robustech-brand-hover, #00266a);
  border-color: var(--robustech-brand-hover, #00266a);
}

body.content-subpage--business-division .danfoss-pdp--business-division .danfoss-pdp__features {
  border-left-color: var(--robustech-brand, #003087);
}

.danfoss-pdp--yokogawa .danfoss-pdp__btn-inquiry {
  color: var(--yokogawa-text, #111);
  background: var(--yokogawa-yellow, #ffd100);
  border-color: var(--yokogawa-yellow-border, #e6bc00);
}

.danfoss-pdp--yokogawa .danfoss-pdp__btn-inquiry:hover {
  color: var(--yokogawa-text, #111);
  background: var(--yokogawa-yellow-hover, #f5c400);
  border-color: #d4ad00;
}

.danfoss-pdp--yokogawa .danfoss-pdp__back-link:hover {
  color: var(--yokogawa-text, #111);
}

.danfoss-pdp--yokogawa .danfoss-pdp__tab:hover,
.danfoss-pdp--yokogawa .danfoss-pdp__tab.is-active {
  color: var(--yokogawa-text, #111);
  border-bottom-color: var(--yokogawa-yellow, #ffd100);
}

.danfoss-pdp--yokogawa .danfoss-pdp__tab.is-active {
  background: rgba(255, 209, 0, 0.14);
}

.danfoss-pdp--yokogawa .danfoss-pdp__tab:focus-visible {
  outline-color: var(--yokogawa-yellow, #ffd100);
}

.danfoss-pdp--yokogawa .danfoss-pdp__features {
  border-left-color: var(--yokogawa-yellow, #ffd100);
}

.danfoss-pdp--yokogawa .danfoss-pdp__doc-download,
.danfoss-pdp--yokogawa .danfoss-store-table__file-link,
.danfoss-pdp--yokogawa .danfoss-store-related__title a::before,
.danfoss-pdp--yokogawa .danfoss-store-related__title a:hover {
  color: var(--yokogawa-text, #111);
}

.danfoss-pdp--yokogawa .danfoss-pdp__doc-download:hover,
.danfoss-pdp--yokogawa .danfoss-store-table__download-link:hover,
.danfoss-pdp--yokogawa .danfoss-store-table__file-link:hover {
  color: var(--yokogawa-text, #111);
  background: rgba(255, 209, 0, 0.18);
}

.danfoss-pdp--yokogawa .danfoss-store-table__download-icon {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath fill='%23ffd100' d='M4 0h12l8 8v22a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2z'/%3E%3Cpath fill='%23fff' d='M16 0v8h8'/%3E%3C/svg%3E") center / contain no-repeat;
}

.danfoss-pdp__body {
  padding-top: 0;
}

.danfoss-pdp__tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid var(--danfoss-border, #e0e0e0);
  margin: 0 0 0;
  scrollbar-width: thin;
}

.danfoss-pdp__tab {
  flex: 0 0 auto;
  border: 0;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  background: transparent;
  color: var(--danfoss-text, #1a1a1a);
  font-size: 0.95rem;
  font-weight: 600;
  padding: 1rem 1.15rem;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.danfoss-pdp__tab:hover {
  color: var(--danfoss-red, #e2000f);
}

.danfoss-pdp__tab.is-active {
  color: var(--danfoss-red, #e2000f);
  border-bottom-color: var(--danfoss-red, #e2000f);
}

.danfoss-pdp__tab:focus-visible {
  outline: 2px solid var(--danfoss-red, #e2000f);
  outline-offset: -2px;
}

.danfoss-pdp__panels {
  padding-top: 1.5rem;
}

.danfoss-pdp__panel[hidden] {
  display: none !important;
}

.danfoss-pdp__panel-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.danfoss-pdp__intro {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--danfoss-muted, #5c5c5c);
  margin-bottom: 1.25rem;
}

.danfoss-pdp__features {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 1.5rem;
  padding: 1rem 1.15rem;
  background: var(--danfoss-surface, #f5f5f5);
  border-left: 3px solid var(--danfoss-red, #e2000f);
}

.danfoss-pdp__features li {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--danfoss-text, #1a1a1a);
  padding-left: 0.85rem;
  position: relative;
}

.danfoss-pdp__features li::before {
  content: "–";
  position: absolute;
  left: 0;
  color: var(--danfoss-muted, #5c5c5c);
}

.danfoss-pdp__spec-group + .danfoss-pdp__spec-group {
  margin-top: 2rem;
}

.danfoss-pdp__spec-group-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--danfoss-text, #1a1a1a);
  margin: 0 0 0.75rem;
}

.danfoss-pdp__spec-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(1.25rem, 3vw, 2rem);
  align-items: start;
}

.danfoss-pdp__spec-grid-col {
  min-width: 0;
}

.danfoss-pdp__table {
  width: 100%;
  font-size: 0.9rem;
  border: 0;
  margin: 0;
  border-collapse: collapse;
}

.danfoss-pdp__table--striped tbody tr {
  border-bottom: 0;
}

.danfoss-pdp__table--striped tbody tr:nth-child(odd) {
  background-color: #f2f2f2;
}

.danfoss-pdp__table--striped tbody tr:nth-child(even) {
  background-color: #fff;
}

.danfoss-pdp__table th {
  width: 42%;
  font-weight: 700;
  color: var(--danfoss-text, #1a1a1a);
  background: transparent;
  vertical-align: middle;
  padding: 0.7rem 1rem 0.7rem 1rem;
  border: 0;
}

.danfoss-pdp__table td {
  color: var(--danfoss-text, #1a1a1a);
  font-weight: 400;
  vertical-align: middle;
  padding: 0.7rem 1rem 0.7rem 0;
  word-break: break-word;
  border: 0;
}

.danfoss-pdp__table--striped tbody tr:hover {
  background-color: #ebebeb;
}

.danfoss-pdp__table--striped tbody tr:nth-child(even):hover {
  background-color: #f7f7f7;
}

.danfoss-pdp__variants-wrap {
  max-width: 100%;
}

.danfoss-pdp__table--variants {
  font-size: 0.82rem;
  white-space: nowrap;
}

.danfoss-pdp__table--variants thead th {
  width: auto;
  font-size: 0.78rem;
  font-weight: 700;
  background: #f2f2f2;
  border-bottom: 1px solid var(--danfoss-border, #e0e0e0);
  padding: 0.55rem 0.65rem;
  vertical-align: bottom;
}

.danfoss-pdp__table--variants tbody td {
  padding: 0.5rem 0.65rem;
  font-variant-numeric: tabular-nums;
  border-bottom: 1px solid #eee;
}

.danfoss-pdp__table--variants tbody tr:nth-child(odd) {
  background-color: #fafafa;
}

.danfoss-pdp__table--variants tbody tr:hover {
  background-color: #f0f0f0;
}

.danfoss-pdp__doc-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.danfoss-pdp__doc-item {
  display: grid;
  gap: 0.35rem 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--danfoss-border, #e0e0e0);
}

@media (min-width: 640px) {
  .danfoss-pdp__doc-item {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
  }

  .danfoss-pdp__doc-meta {
    grid-column: 1;
    grid-row: 1;
  }

  .danfoss-pdp__doc-title {
    grid-column: 1;
    grid-row: 2;
  }

  .danfoss-pdp__doc-download {
    grid-column: 2;
    grid-row: 1 / span 2;
    justify-self: end;
  }
}

.danfoss-pdp__doc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
}

.danfoss-pdp__doc-type,
.danfoss-pdp__doc-lang {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--danfoss-muted, #5c5c5c);
}

.danfoss-pdp__doc-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--danfoss-text, #1a1a1a);
}

.danfoss-pdp__doc-download {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--danfoss-red, #e2000f);
  text-decoration: none;
  white-space: nowrap;
}

.danfoss-pdp__doc-download:hover {
  text-decoration: underline;
}

/* Danfoss store-style resource tables & related lists */
.danfoss-store-table-wrap {
  margin-top: 0.5rem;
}

.danfoss-store-table {
  --danfoss-store-border: #e0e0e0;
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.danfoss-store-table thead th {
  font-weight: 700;
  color: var(--danfoss-text, #1a1a1a);
  border-bottom: 2px solid #1a1a1a;
  padding: 0.75rem 1rem;
  vertical-align: bottom;
  white-space: nowrap;
}

.danfoss-store-table tbody tr:nth-child(odd) {
  background: #f2f2f2;
}

.danfoss-store-table tbody tr:nth-child(even) {
  background: #fff;
}

.danfoss-store-table tbody td {
  padding: 1rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--danfoss-store-border);
}

.danfoss-store-table__th-thumb,
.danfoss-store-table__thumb {
  width: 72px;
}

.danfoss-store-table__thumb img {
  display: block;
  width: 56px;
  height: 56px;
  object-fit: contain;
  background: #fff;
  border: 1px solid var(--danfoss-store-border);
}

.danfoss-store-table__col-type {
  font-weight: 700;
  white-space: nowrap;
}

.danfoss-store-table__col-meta {
  color: var(--danfoss-muted, #5c5c5c);
  white-space: nowrap;
}

.danfoss-store-table__title-main {
  display: block;
  font-weight: 600;
  color: var(--danfoss-text, #1a1a1a);
}

.danfoss-store-table__title-sub,
.danfoss-store-table__title-meta {
  font-size: 0.82rem;
  color: var(--danfoss-muted, #5c5c5c);
  margin-top: 0.2rem;
}

.danfoss-store-table__th-download,
.danfoss-store-table__download {
  width: 5rem;
  text-align: center;
}

.danfoss-store-table__download-link {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  text-decoration: none;
  color: var(--danfoss-text, #1a1a1a);
}

.danfoss-store-table__download-link:hover {
  color: var(--danfoss-red, #e2000f);
}

.danfoss-store-table__download-icon {
  display: block;
  width: 28px;
  height: 34px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 32'%3E%3Cpath fill='%23e2000f' d='M4 0h12l8 8v22a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2z'/%3E%3Cpath fill='%23fff' d='M16 0v8h8'/%3E%3C/svg%3E") center / contain no-repeat;
}

.danfoss-store-table__download-ext {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.danfoss-store-table__file-link {
  font-weight: 600;
  color: var(--danfoss-red, #e2000f);
  text-decoration: none;
  white-space: nowrap;
}

.danfoss-store-table__file-link:hover {
  text-decoration: underline;
}

.danfoss-store-related__item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1.25rem 1.5rem;
  align-items: start;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--danfoss-border, #e0e0e0);
}

.danfoss-store-related__thumb img {
  display: block;
  width: 72px;
  height: 72px;
  object-fit: contain;
  background: #fff;
}

.danfoss-store-related__code {
  font-size: 0.82rem;
  color: var(--danfoss-muted, #5c5c5c);
}

.danfoss-store-related__title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
}

.danfoss-store-related__title a {
  color: var(--danfoss-text, #1a1a1a);
  text-decoration: none;
}

.danfoss-store-related__title a::before {
  content: "› ";
  color: var(--danfoss-red, #e2000f);
}

.danfoss-store-related__title a:hover {
  color: var(--danfoss-red, #e2000f);
}

.danfoss-store-related__summary {
  font-size: 0.82rem;
  color: var(--danfoss-muted, #5c5c5c);
  line-height: 1.45;
}

.danfoss-store-related__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.danfoss-store-related__inquiry {
  min-width: 5.5rem;
  text-align: center;
}

@media (max-width: 767.98px) {
  .danfoss-store-table thead {
    display: none;
  }

  .danfoss-store-table tbody tr {
    display: block;
    padding: 0.5rem 0;
  }

  .danfoss-store-table tbody td {
    display: block;
    border: 0;
    padding: 0.35rem 1rem;
  }

  .danfoss-store-related__item {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
  }

  .danfoss-store-related__actions {
    grid-column: 1 / -1;
    align-items: stretch;
  }
}

/* legacy simple layout */
.danfoss-pdp__model {
  font-size: 0.95rem;
}

.danfoss-product-detail__back-link {
  font-weight: 600;
  text-decoration: none;
}

.danfoss-product-detail__back-link:hover {
  text-decoration: underline;
}

.danfoss-product-detail__series {
  font-size: 0.9rem;
  color: #63666a;
}

.danfoss-product-detail__title {
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  font-weight: 700;
  color: #00263e;
}

.danfoss-product-detail__hero {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

@media (min-width: 768px) {
  .danfoss-product-detail__hero {
    grid-template-columns: minmax(12rem, 18rem) 1fr;
    align-items: start;
  }
}

.danfoss-product-detail__image-wrap {
  background: #f4f6f8;
  border-radius: 0.5rem;
  padding: 1rem;
  text-align: center;
}

.danfoss-product-detail__image-wrap img {
  max-width: 100%;
  height: auto;
}

.danfoss-product-detail__spec-title {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
  color: #00263e;
}

.danfoss-product-detail__features li {
  position: relative;
  padding-left: 1.1rem;
  margin-bottom: 0.5rem;
  line-height: 1.55;
}

.danfoss-product-detail__features li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #0070c9;
}

.danfoss-product-detail--store .danfoss-product-detail__header {
  display: grid;
  gap: clamp(1.25rem, 3vw, 2rem);
  margin-bottom: 1.25rem;
}

@media (min-width: 768px) {
  .danfoss-product-detail--store .danfoss-product-detail__header {
    grid-template-columns: 1fr minmax(14rem, 22rem);
    align-items: start;
  }
}

.danfoss-product-detail__order-label {
  display: block;
  font-size: 0.8rem;
  color: #63666a;
  margin-bottom: 0.15rem;
}

.danfoss-product-detail__order-value {
  font-size: 1.35rem;
  color: #00263e;
  letter-spacing: 0.02em;
}

.danfoss-product-detail__summary {
  font-size: 0.95rem;
  color: #4a4d52;
}

.danfoss-product-detail__image-wrap--store {
  max-width: 22rem;
  margin-inline: auto;
}

.danfoss-product-detail__store-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  color: #0070c9;
  text-decoration: none;
}

.danfoss-product-detail__store-link:hover {
  text-decoration: underline;
}

.danfoss-product-detail__store-link--inline {
  margin-left: 0.35rem;
}

.danfoss-product-detail__section-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #00263e;
  margin-bottom: 0.85rem;
  padding-bottom: 0.45rem;
  border-bottom: 2px solid rgba(0, 112, 201, 0.2);
}

.danfoss-product-detail__spec-block + .danfoss-product-detail__spec-block {
  margin-top: 1.75rem;
}

.danfoss-product-detail__spec-block-title {
  font-size: 1rem;
  font-weight: 700;
  color: #00263e;
  margin-bottom: 0.65rem;
}

.danfoss-product-detail__table {
  font-size: 0.9rem;
  border: 1px solid rgba(0, 38, 62, 0.1);
}

.danfoss-product-detail__table th {
  width: 42%;
  font-weight: 600;
  color: #00263e;
  background: #f4f6f8;
  vertical-align: top;
}

.danfoss-product-detail__table td {
  color: #333;
  word-break: break-word;
}

.danfoss-product-detail__table th,
.danfoss-product-detail__table td {
  padding: 0.55rem 0.75rem;
  border-color: rgba(0, 38, 62, 0.08);
}

.danfoss-product-resources__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(0, 38, 62, 0.12);
  padding-bottom: 0.5rem;
}

.danfoss-product-resources__tab {
  border: 1px solid rgba(0, 38, 62, 0.12);
  background: #fff;
  color: #00263e;
  font-size: 0.88rem;
  font-weight: 600;
  padding: 0.45rem 0.85rem;
  border-radius: 0.45rem;
  cursor: pointer;
}

.danfoss-product-resources__tab.is-active {
  background: #0070c9;
  border-color: #0070c9;
  color: #fff;
}

.danfoss-product-resources__tab:focus-visible {
  outline: 2px solid #0070c9;
  outline-offset: 2px;
}

.danfoss-product-resources__panel[hidden] {
  display: none !important;
}

.danfoss-product-resources__download {
  font-weight: 600;
  color: #0070c9;
  text-decoration: none;
}

.danfoss-product-resources__download:hover {
  text-decoration: underline;
}

.danfoss-product-resources__gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: 0.85rem;
}

.danfoss-product-resources__gallery-item img {
  width: 100%;
  height: auto;
  border-radius: 0.45rem;
  background: #f4f6f8;
  border: 1px solid rgba(0, 38, 62, 0.08);
}

.danfoss-product-resources__related {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
}

.danfoss-product-resources__related-card {
  padding: 0.85rem 1rem;
  border: 1px solid rgba(0, 38, 62, 0.1);
  border-radius: 0.55rem;
  background: #fafbfc;
}

.danfoss-product-resources__related-role {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #0070c9;
}

.danfoss-product-resources__related-order {
  font-size: 0.85rem;
}

.danfoss-product-resources__related-title {
  font-weight: 600;
  color: #00263e;
  line-height: 1.45;
}

/* 견적·구매 문의 (/support/quote) */
.content-subpage-main--product-inquiry {
  max-width: 1120px;
}

.product-inquiry {
  --inquiry-brand: #004282;
  --inquiry-brand-hover: #003666;
  --inquiry-brand-text: #004282;
  --inquiry-brand-border: rgba(0, 66, 130, 0.12);
  --inquiry-brand-accent: rgba(0, 66, 130, 0.12);
  --inquiry-submit-bg: #004282;
  --inquiry-submit-text: #fff;
  --inquiry-submit-hover-bg: #003666;
}

.product-inquiry--danfoss {
  --inquiry-brand: #e2000f;
  --inquiry-brand-hover: #b8000c;
  --inquiry-brand-text: #e2000f;
  --inquiry-brand-border: rgba(226, 0, 15, 0.18);
  --inquiry-brand-accent: rgba(226, 0, 15, 0.08);
  --inquiry-submit-bg: #e2000f;
  --inquiry-submit-text: #fff;
  --inquiry-submit-hover-bg: #b8000c;
}

.product-inquiry--yokogawa {
  --inquiry-brand: #ffd100;
  --inquiry-brand-hover: #f5c400;
  --inquiry-brand-text: #9a7b00;
  --inquiry-brand-border: rgba(230, 188, 0, 0.35);
  --inquiry-brand-accent: rgba(255, 209, 0, 0.14);
  --inquiry-submit-bg: #ffd100;
  --inquiry-submit-text: #111;
  --inquiry-submit-hover-bg: #f5c400;
}

.product-inquiry--skarpenord {
  --inquiry-brand: #00a2a4;
  --inquiry-brand-hover: #008d8f;
  --inquiry-brand-text: #007678;
  --inquiry-brand-border: rgba(0, 162, 164, 0.22);
  --inquiry-brand-accent: rgba(0, 162, 164, 0.08);
  --inquiry-submit-bg: #00a2a4;
  --inquiry-submit-text: #fff;
  --inquiry-submit-hover-bg: #008d8f;
}

.product-inquiry__layout {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  gap: 2rem 2.5rem;
  align-items: start;
}

@media (max-width: 991.98px) {
  .product-inquiry__layout {
    grid-template-columns: 1fr;
  }
}

.product-inquiry__aside-title,
.product-inquiry__form-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--inquiry-brand-text, #004282);
  margin-bottom: 0.85rem;
}

.product-inquiry .form-label {
  color: var(--inquiry-brand-text, #004282);
  font-weight: 600;
}

.product-inquiry__aside-list li {
  position: relative;
  padding-left: 1rem;
  margin-bottom: 0.65rem;
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--bs-secondary-color);
}

.product-inquiry__aside-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--inquiry-brand, #004282);
}

.product-inquiry__contact-card {
  padding: 1rem 1.1rem;
  background: var(--inquiry-brand-accent, #f7f9fb);
  border: 1px solid var(--inquiry-brand-border, rgba(0, 66, 130, 0.12));
}

.product-inquiry__contact-label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--inquiry-brand-text, #004282);
}

.product-inquiry__contact-value {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--inquiry-brand-text, #004282);
}

.product-inquiry__contact-value a {
  color: inherit;
  text-decoration: none;
}

.product-inquiry__sales-rep {
  margin-top: 1.25rem;
}

.product-inquiry__sales-rep-label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--inquiry-brand-text, #004282);
}

.product-inquiry__sales-rep-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1rem 1.1rem 1.25rem;
  background: #fff;
  border: 1px solid var(--inquiry-brand-border, rgba(0, 66, 130, 0.12));
  overflow: visible;
}

.product-inquiry__sales-rep-photo-wrap {
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  overflow: hidden;
  border-radius: 50%;
  border: 2px solid var(--inquiry-brand-border, rgba(0, 66, 130, 0.15));
  background: var(--inquiry-brand-accent, #f7f9fb);
}

.product-inquiry__sales-rep-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-inquiry__sales-rep-body {
  width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.product-inquiry__sales-rep-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--inquiry-brand-text, #004282);
}

.product-inquiry__sales-rep-title {
  font-size: 0.88rem;
  color: var(--bs-secondary-color);
  line-height: 1.45;
}

.product-inquiry__sales-rep-scope {
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--inquiry-brand-text, #004282);
  opacity: 0.88;
}

.product-inquiry__sales-rep-phone,
.product-inquiry__sales-rep-email {
  font-size: 0.9rem;
  line-height: 1.5;
}

.product-inquiry__sales-rep-phone a,
.product-inquiry__sales-rep-email a {
  display: inline-block;
  max-width: 100%;
  color: var(--inquiry-brand-text, #004282);
  text-decoration: none;
  overflow-wrap: anywhere;
  word-break: break-all;
}

.product-inquiry__sales-rep-phone a:hover,
.product-inquiry__sales-rep-email a:hover {
  color: var(--inquiry-brand-hover, #003666);
  text-decoration: underline;
}

.product-inquiry__product-summary {
  padding: 1rem 1.15rem;
  background: var(--inquiry-brand-accent, #f7f9fb);
  border-left: 3px solid var(--inquiry-brand, #004282);
}

.product-inquiry__product-summary-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--inquiry-brand-text, #004282);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.product-inquiry__product-name {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--inquiry-brand-text, #1a1a1a);
}

.product-inquiry__product-meta {
  color: var(--inquiry-brand-text, var(--bs-secondary-color)) !important;
  opacity: 0.85;
}

.product-inquiry a.small {
  color: var(--inquiry-brand-text, #004282);
}

.product-inquiry a.small:hover {
  color: var(--inquiry-brand-hover, #003666);
}

.product-inquiry__message {
  min-height: 9rem;
}

.product-inquiry__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 10rem;
  padding: 0.75rem 1.75rem;
  border: none;
  background: var(--inquiry-submit-bg, #004282);
  color: var(--inquiry-submit-text, #fff);
  font-weight: 700;
  transition: background 0.15s ease, color 0.15s ease;
}

.product-inquiry__submit:hover {
  background: var(--inquiry-submit-hover-bg, #003666);
  color: var(--inquiry-submit-text, #fff);
}

.product-inquiry__submit:disabled,
.product-inquiry__submit[aria-disabled="true"] {
  opacity: 0.5;
  cursor: not-allowed;
  background: rgba(0, 66, 130, 0.45);
  color: rgba(255, 255, 255, 0.92);
}

.product-inquiry__submit:disabled:hover,
.product-inquiry__submit[aria-disabled="true"]:hover {
  background: rgba(0, 66, 130, 0.45);
  color: rgba(255, 255, 255, 0.92);
}

.product-inquiry__form-wrap {
  scroll-margin-top: 5.75rem;
}

.product-inquiry__form--submitting {
  pointer-events: none;
}

.product-inquiry__success {
  border-left: 4px solid var(--inquiry-brand, var(--bs-success));
  margin-bottom: 1.5rem;
  scroll-margin-top: 5.75rem;
}

.product-inquiry__success-summary {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(25, 135, 84, 0.22);
}

.product-inquiry__success-summary-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #14532d;
}

.product-inquiry__success-summary-list {
  display: grid;
  gap: 0.65rem;
}

.product-inquiry__success-summary-row {
  display: grid;
  grid-template-columns: minmax(5.5rem, 7.5rem) 1fr;
  gap: 0.75rem;
  align-items: start;
}

.product-inquiry__success-summary-row dt {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #166534;
}

.product-inquiry__success-summary-row dd {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #1f2937;
  white-space: pre-wrap;
  word-break: break-word;
}

.product-inquiry__submitted-note {
  padding: 1rem 0 0.25rem;
  font-size: 0.9375rem;
}

@media (max-width: 575.98px) {
  .product-inquiry__success-summary-row {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }
}

.product-inquiry__submitting {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(15, 23, 42, 0.48);
  backdrop-filter: blur(2px);
}

.product-inquiry__submitting[hidden] {
  display: none !important;
}

.product-inquiry__submitting-panel {
  width: min(100%, 22rem);
  padding: 1.5rem 1.25rem;
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
  text-align: center;
}

.product-inquiry__submitting-spinner {
  width: 2.5rem;
  height: 2.5rem;
  margin: 0 auto 1rem;
  border: 0.25rem solid rgba(0, 66, 130, 0.16);
  border-top-color: var(--inquiry-brand, #004282);
  border-radius: 50%;
  animation: product-inquiry-submit-spin 0.85s linear infinite;
}

.product-inquiry__submitting-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: #0f172a;
}

.product-inquiry__submitting-text {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: #475569;
}

@keyframes product-inquiry-submit-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .product-inquiry__submitting-spinner {
    animation: none;
    border-top-color: rgba(0, 66, 130, 0.16);
    border-right-color: var(--inquiry-brand, #004282);
  }
}

.product-inquiry__validation:not(:empty) {
  scroll-margin-top: 5.75rem;
}

.product-inquiry__field {
  scroll-margin-top: 5.75rem;
}

.product-inquiry__field--invalid .form-label {
  color: #b42318;
}

.product-inquiry__control--invalid,
.product-inquiry__field--invalid .form-check-input.product-inquiry__control--invalid {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 0.15rem rgba(220, 53, 69, 0.14);
}

.product-inquiry__field--invalid .product-inquiry__control--invalid:focus,
.product-inquiry__field--invalid .form-check-input.product-inquiry__control--invalid:focus {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.22);
}

.product-inquiry__field-error {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: #b42318;
}

/* ----- 홈 우상단 AI 프롬프트 (Composer 스타일) ----- */
.home-ai-composer {
  position: fixed;
  top: calc(var(--site-header-h, 4rem) + 0.65rem);
  right: clamp(0.75rem, 2vw, 1.35rem);
  z-index: 1075;
  width: min(430px, calc(100vw - 1.5rem));
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.home-ai-composer:not(.is-open) {
  width: auto;
}

.home-ai-composer__peek,
.home-ai-composer__panel {
  pointer-events: auto;
}

.home-ai-composer__peek {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-left: auto;
  padding: 0.45rem 0.8rem 0.45rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(18, 22, 30, 0.72);
  backdrop-filter: blur(14px);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  transition:
    background 0.22s ease,
    border-color 0.22s ease,
    transform 0.22s ease,
    width 0.22s ease,
    height 0.22s ease,
    padding 0.22s ease,
    opacity 0.22s ease;
}

.home-ai-composer:not(.is-open) .home-ai-composer__peek {
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border-radius: 50%;
}

.home-ai-composer:not(.is-open) .home-ai-composer__peek-text {
  display: none;
}

.home-ai-composer:not(.is-open) .home-ai-composer__peek-icon svg {
  width: 18px;
  height: 18px;
}

.home-ai-composer__peek:hover,
.home-ai-composer__peek:focus-visible,
.home-ai-composer:not(.is-open):hover .home-ai-composer__peek {
  background: rgba(24, 28, 38, 0.88);
  border-color: rgba(255, 255, 255, 0.24);
  transform: translateY(-1px);
}

.home-ai-composer__peek-icon {
  display: inline-flex;
  opacity: 0.88;
}

.home-ai-composer.is-open .home-ai-composer__peek {
  position: absolute;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.home-ai-composer__panel {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  width: 100%;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.home-ai-composer:not(.is-open) .home-ai-composer__panel {
  display: none;
}

.home-ai-composer.is-open .home-ai-composer__panel {
  animation: home-ai-composer-panel-in 0.22s ease;
}

@keyframes home-ai-composer-panel-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.home-ai-composer__surface {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  background: rgba(18, 22, 30, 0.88);
  backdrop-filter: blur(18px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.34);
  overflow: hidden;
}

.home-ai-composer__form {
  display: flex;
  flex-direction: column;
}

.home-ai-composer__input {
  width: 100%;
  min-height: 3.25rem;
  max-height: 9rem;
  padding: 0.85rem 0.95rem 0.55rem;
  border: 0;
  resize: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.94);
  font-size: 0.92rem;
  line-height: 1.45;
}

.home-ai-composer__input::placeholder {
  color: rgba(255, 255, 255, 0.42);
}

.home-ai-composer__input:focus {
  outline: none;
}

.home-ai-composer__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  padding: 0.35rem 0.45rem 0.45rem;
}

.home-ai-composer__chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.home-ai-composer__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.72rem;
  line-height: 1.2;
  white-space: nowrap;
}

.home-ai-composer__chip--agent {
  color: rgba(255, 255, 255, 0.88);
  background: rgba(255, 255, 255, 0.1);
}

.home-ai-composer__chip--muted {
  opacity: 0.72;
}

.home-ai-composer__chip-icon {
  font-size: 0.82rem;
  line-height: 1;
}

.home-ai-composer__actions {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
}

.home-ai-composer__collapse,
.home-ai-composer__send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  border-radius: 999px;
  transition: background 0.16s ease, opacity 0.16s ease, transform 0.16s ease;
}

.home-ai-composer__collapse {
  background: transparent;
  color: rgba(255, 255, 255, 0.58);
}

.home-ai-composer__collapse:hover,
.home-ai-composer__collapse:focus-visible {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.88);
}

.home-ai-composer__send {
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
}

.home-ai-composer__send:hover:not(:disabled),
.home-ai-composer__send:focus-visible:not(:disabled) {
  background: #fff;
  transform: translateY(-1px);
}

.home-ai-composer__send:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}

.home-ai-composer__results {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: rgba(10, 14, 22, 0.82);
  backdrop-filter: blur(16px);
  padding: 0.85rem 0.95rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: 0.84rem;
  line-height: 1.5;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}

.home-ai-composer__results[hidden] {
  display: none !important;
}

.home-ai-composer__answer {
  margin: 0 0 0.65rem;
}

.home-ai-composer__links {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-ai-composer__link-item a {
  display: block;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.92);
  text-decoration: none;
  transition: background 0.16s ease;
}

.home-ai-composer__link-item a:hover,
.home-ai-composer__link-item a:focus-visible {
  background: rgba(255, 255, 255, 0.1);
}

.home-ai-composer__link-title {
  display: block;
  font-weight: 600;
  font-size: 0.84rem;
}

.home-ai-composer__link-summary {
  display: block;
  margin-top: 0.15rem;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.76rem;
}

.home-ai-composer__status {
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.8rem;
}

body.site-header--gnb-solid-scroll .home-ai-composer__peek,
body.site-header--gnb-solid-scroll .home-ai-composer__surface,
body.site-header--gnb-solid-scroll .home-ai-composer__results {
  border-color: rgba(15, 23, 42, 0.12);
}

body.site-header--gnb-solid-scroll .home-ai-composer__peek {
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

body.site-header--gnb-solid-scroll .home-ai-composer__surface {
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.14);
}

body.site-header--gnb-solid-scroll .home-ai-composer__input {
  color: #111827;
}

body.site-header--gnb-solid-scroll .home-ai-composer__input::placeholder {
  color: rgba(15, 23, 42, 0.42);
}

body.site-header--gnb-solid-scroll .home-ai-composer__chip {
  background: rgba(15, 23, 42, 0.06);
  color: rgba(15, 23, 42, 0.72);
}

body.site-header--gnb-solid-scroll .home-ai-composer__chip--agent {
  background: rgba(15, 23, 42, 0.08);
  color: rgba(15, 23, 42, 0.88);
}

body.site-header--gnb-solid-scroll .home-ai-composer__collapse {
  color: rgba(15, 23, 42, 0.55);
}

body.site-header--gnb-solid-scroll .home-ai-composer__results {
  background: rgba(255, 255, 255, 0.96);
  color: #1f2937;
}

body.site-header--gnb-solid-scroll .home-ai-composer__link-item a {
  background: rgba(15, 23, 42, 0.04);
  color: #111827;
}

body.site-header--gnb-solid-scroll .home-ai-composer__link-summary {
  color: rgba(15, 23, 42, 0.58);
}

@media (max-width: 991.98px) {
  .home-ai-composer {
    top: calc(var(--site-header-h, 3.5rem) + 0.45rem);
    right: 0.65rem;
    width: min(420px, calc(100vw - 1.3rem));
  }

  .home-ai-composer__chip:not(.home-ai-composer__chip--agent) {
    display: none;
  }
}

body.site-header--gnb-solid-scroll .home-ai-composer:not(.is-open):hover .home-ai-composer__peek {
  background: rgba(255, 255, 255, 0.98);
  border-color: rgba(15, 23, 42, 0.12);
}

@media (prefers-reduced-motion: reduce) {
  .home-ai-composer__peek,
  .home-ai-composer__send,
  .home-ai-composer__panel {
    transition: none;
    animation: none;
  }
}

/* ----- 관리자: GNB 설정 버튼 + 로그 페이지 ----- */
.main-nav-admin-outer {
  display: flex;
  justify-content: center;
  margin-bottom: 0.35rem;
}

@media (min-width: 992px) {
  .main-nav-admin-outer {
    justify-content: flex-end;
    margin-bottom: 0;
    margin-right: 0.65rem;
  }
}

.main-nav-admin-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.2;
}

.main-nav-admin-link__icon {
  width: 1.05rem;
  height: 1.05rem;
}

.main-nav-admin-link:hover {
  color: var(--rt-brand, #004080);
  background: rgba(0, 64, 128, 0.08);
}

.main-nav-admin-link--active {
  color: var(--rt-brand, #004080);
}

:is(body.hero-video-page, body.content-subpage) .main-nav-admin-link.hero-nav-on-video {
  color: rgba(255, 255, 255, 0.92);
}

:is(body.hero-video-page, body.content-subpage) .hero-navbar-transparent:hover .main-nav-admin-link.hero-nav-on-video,
body.site-header--gnb-solid-scroll .main-nav-admin-link.hero-nav-on-video {
  color: #212529;
}

.admin-page {
  max-width: 1120px;
}

.admin-card {
  background: #fff;
}

.admin-stat {
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
}

.admin-stat__label {
  font-size: 0.8125rem;
  color: rgba(15, 23, 42, 0.62);
}

.admin-stat__value {
  font-size: 1.75rem;
  font-weight: 700;
  color: #0f172a;
}

.admin-stat__unit {
  margin-left: 0.15rem;
  font-size: 1rem;
  font-weight: 600;
  color: rgba(15, 23, 42, 0.55);
}

.admin-stat__meta {
  font-size: 0.95rem;
  font-weight: 600;
  color: #0f172a;
}

.admin-log-table__message {
  max-width: 28rem;
  word-break: keep-all;
}

.admin-log-table__grid th {
  white-space: nowrap;
  font-size: 0.8125rem;
}