@media (min-width: 801px) {
  .garment-header:not(.is-scrolled) .garment-nav > a.current { color: #fff; }
}

@media (min-width: 701px) {
  .loong-home { color: #24313a; background: #fff; overflow: hidden; }
  .loong-home, .loong-home * { box-sizing: border-box; }
  .loong-home h1, .loong-home h2, .loong-home h3 { letter-spacing: 0; text-transform: none; }
  .loong-home h2 { font-size: 42px; line-height: 1.16; font-weight: 700; }
  .loong-home p { margin: 0; }
  .loong-shell { width: min(100% - 80px, 1460px); margin-inline: auto; }
  .loong-section { padding: 84px 0 90px; }
  .loong-eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #075eaa; font-size: 12px; font-weight: 700; line-height: 1.5; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 20px; }
  .loong-eyebrow i { font-size: 19px; line-height: 1; }
  .loong-eyebrow--light { color: #a9d2f2; }
  .loong-section-head { display: flex; align-items: end; justify-content: space-between; gap: 48px; margin-bottom: 34px; }
  .loong-section-head > div { max-width: 760px; }
  .loong-section-head > p { max-width: 390px; color: #63717b; font-size: 15px; line-height: 1.75; padding-bottom: 5px; }
  .loong-section-head--light h2 { color: #fff; }
  .loong-section-head--light > p { color: #bdcbd3; }
  .loong-button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 52px; padding: 0 21px; border-radius: 3px; font-size: 14px; font-weight: 700; line-height: 1.2; transition: background .2s ease, transform .2s ease; white-space: nowrap; }
  .loong-button i, .loong-text-link i { font-size: 19px; line-height: 1; }
  .loong-button:hover { transform: translateY(-2px); }
  .loong-button--blue { background: #0871c8; color: #fff; }
  .loong-button--blue:hover { background: #075eaa; color: #fff; }
  .loong-button--white { background: #fff; color: #19384e; }
  .loong-button--white:hover { background: #e9f4fd; color: #19384e; }
  .loong-text-link { display: inline-flex; align-items: center; gap: 15px; color: #075eaa; font-size: 14px; font-weight: 700; border-bottom: 1px solid currentColor; padding-bottom: 5px; }
  .loong-text-link:hover { color: #0a80df; }
  .loong-text-link--light { color: #fff; }
  .loong-text-link--light:hover { color: #a9d2f2; }

  .loong-hero { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 100svh; background: #142733; color: #fff; }
  .loong-hero__image, .loong-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
  .loong-hero__image { object-fit: cover; object-position: center 52%; z-index: -2; }
  .loong-hero__shade { z-index: -1; background: linear-gradient(90deg, rgba(7, 20, 30, .88) 0%, rgba(7, 20, 30, .7) 32%, rgba(7, 20, 30, .2) 54%, rgba(7, 20, 30, 0) 73%), linear-gradient(rgba(7, 20, 30, .64), transparent 22%); }
  .loong-hero__content { padding-top: 118px; padding-bottom: 94px; }
  .loong-hero h1 { max-width: 620px; color: #fff; font-size: 60px; line-height: 1.09; font-weight: 700; }
  .loong-hero p { max-width: 580px; margin-top: 24px; color: #e2ecf2; font-size: 20px; line-height: 1.6; }
  .loong-actions { display: flex; align-items: center; gap: 38px; margin-top: 36px; }
  .loong-hero__rail { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; padding: 16px max(40px, calc((100vw - 1460px) / 2)); color: #dae7ef; border-top: 1px solid rgba(255, 255, 255, .27); font-size: 10px; font-weight: 700; letter-spacing: .12em; }

  .loong-categories { background: #f2f5f6; padding-bottom: 32px; }
  .loong-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .loong-category { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; background: #fff; border: 1px solid #e2e8eb; border-radius: 4px; transition: box-shadow .2s ease, transform .2s ease; }
  .loong-category:hover { transform: translateY(-3px); box-shadow: 0 12px 22px rgba(20, 46, 60, .09); color: #075eaa; }
  .loong-category__media { display: block; width: 100%; aspect-ratio: 1.8; overflow: hidden; background: #e7ecef; }
  .loong-category__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
  .loong-category:hover img { transform: scale(1.04); }
  .loong-category__name { display: flex; align-items: center; min-height: 62px; padding: 12px 48px 12px 16px; color: #25333b; font-size: 15px; font-weight: 700; line-height: 1.3; }
  .loong-category > i { position: absolute; right: 16px; bottom: 20px; color: #075eaa; font-size: 19px; }

  .loong-factory { background: #142632; color: #fff; }
  .loong-factory-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 210px; gap: 10px; margin-bottom: 29px; }
  .loong-factory-photo { position: relative; grid-column: span 4; min-width: 0; margin: 0; overflow: hidden; background: #314653; }
  .loong-factory-photo--aerial { grid-column: span 8; grid-row: span 2; }
  .loong-factory-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
  .loong-factory-photo:hover img { transform: scale(1.035); }
  .loong-factory-photo figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 18px 15px; color: #fff; font-size: 13px; font-weight: 700; background: linear-gradient(transparent, rgba(9, 24, 32, .78)); }
  .loong-factory-photo--aerial figcaption { font-size: 17px; padding: 38px 24px 20px; }

  .loong-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 31px; }
  .loong-product { display: block; min-width: 0; border: 1px solid #e1e8ec; border-radius: 4px; overflow: hidden; background: #fff; transition: box-shadow .2s ease, transform .2s ease; }
  .loong-product:hover { transform: translateY(-3px); box-shadow: 0 12px 22px rgba(20, 46, 60, .09); }
  .loong-product__media { display: block; aspect-ratio: 1.35; background: #f3f6f7; }
  .loong-product__media img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
  .loong-product__body { display: flex; justify-content: space-between; align-items: start; min-height: 90px; gap: 12px; padding: 15px; color: #263746; font-size: 14px; font-weight: 700; line-height: 1.45; }
  .loong-product__body span { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
  .loong-product__body i { flex: none; color: #075eaa; font-size: 19px; }

  .loong-global { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 560px; color: #fff; background: #1d3541; }
  .loong-global > img, .loong-global__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
  .loong-global > img { z-index: -2; object-fit: cover; object-position: center; }
  .loong-global__shade { z-index: -1; background: linear-gradient(90deg, rgba(12, 31, 43, .86), rgba(12, 31, 43, .61) 43%, rgba(12, 31, 43, .05) 77%); }
  .loong-global__content { padding: 70px 0; }
  .loong-global h2 { max-width: 650px; color: #fff; font-size: 48px; }
  .loong-global p { max-width: 520px; margin: 23px 0 29px; color: #e2edf2; font-size: 17px; line-height: 1.7; }

  .loong-process { background: #f2f5f6; }
  .loong-process-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 2px solid #075eaa; border-bottom: 1px solid #d2dde4; }
  .loong-process-step { min-width: 0; padding: 30px 23px 32px 0; border-right: 1px solid #d2dde4; }
  .loong-process-step + .loong-process-step { padding-left: 23px; }
  .loong-process-step:last-child { border-right: 0; }
  .loong-process-step > i { display: block; color: #075eaa; font-size: 31px; line-height: 1; margin-bottom: 29px; }
  .loong-process-step h3 { color: #263746; font-size: 18px; line-height: 1.3; margin-bottom: 13px; }
  .loong-process-step p { color: #63717b; font-size: 13px; line-height: 1.65; }
  .loong-process__cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px; }
  .loong-process__cta p { font-size: 21px; font-weight: 700; color: #263746; }
}

@media (min-width: 701px) and (max-width: 1150px) {
  .loong-shell { width: min(100% - 48px, 1460px); }
  .loong-home h2 { font-size: 34px; }
  .loong-hero h1 { font-size: 54px; max-width: 600px; }
  .loong-category-grid, .loong-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .loong-process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .loong-process-step:nth-child(3) { border-right: 0; }
  .loong-process-step:nth-child(n+4) { border-top: 1px solid #d2dde4; }
  .loong-factory-grid { grid-auto-rows: 160px; }
}

@media (min-width: 701px) and (max-width: 850px) {
  .loong-hero h1 { font-size: 46px; }
  .loong-section-head { align-items: start; flex-direction: column; gap: 14px; }
  .loong-category-grid, .loong-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .loong-factory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 190px; }
  .loong-factory-photo, .loong-factory-photo--aerial { grid-column: span 1; grid-row: span 1; }
  .loong-factory-photo--aerial { grid-column: span 2; grid-row: span 2; }
}