/* ==========================================================================
   金亚包装 — shared design system
   ========================================================================== */

:root{
  --red:#e21f26;
  --red-dark:#b8151b;
  --ink:#1c2230;
  --text:#333c47;
  --muted:#6b7280;
  --muted-2:#9aa1ab;
  --line:#e7e9ee;
  --bg-alt:#f6f7f9;
  --bg-alt-2:#f0f2f6;
  --white:#fff;

  --blue-deep:#0a4fa0;
  --blue:#0d6fc7;
  --blue-light:#28a9e8;

  --orange-deep:#e8631a;
  --orange:#f5871f;
  --orange-light:#ffb057;

  --lav-deep:#8f8fd6;
  --lav:#c3c3ee;
  --lav-light:#e3e0f7;

  --pink-deep:#b070c9;
  --pink:#dc9fd0;
  --pink-light:#f2cfe0;


  --radius-sm:2px;
  --radius:3px;
  --radius-lg:4px;
  --container:1200px;
  --shadow-sm:0 2px 10px rgba(20,25,40,.06);
  --shadow:0 10px 30px rgba(20,25,40,.09);

  --ease:cubic-bezier(.22,.7,.2,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
body{
  margin:0;
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;
  color:var(--text);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
button{ font:inherit; cursor:pointer; }
input,textarea{ font:inherit; }

.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 24px;
}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ---------- section rhythm ---------- */
.section{ padding:48px 0; }
.section--alt{ background:var(--bg-alt); }
.section--tight{ padding:28px 0; }
@media (max-width:900px){
  .section--tight{ padding:32px 0; }
}

.eyebrow{
  display:block; text-align:center; color:var(--muted); font-size:14px;
  letter-spacing:.02em; margin-top:10px;
}
.section-head{ text-align:center; margin-bottom:28px; }
.section-head h2{
  font-size:30px; font-weight:700; color:var(--ink); letter-spacing:.02em;
}
.section-head .dash{
  width:36px; height:3px; background:var(--red); margin:16px auto 0; border-radius:2px;
}
@media (max-width:640px){
  .section-head h2{ font-size:23px; }
}

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:200;
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
  box-shadow:var(--shadow-sm);
}

/* R28: homepage header overlays the banner at scrollTop=0 and becomes a solid sticky-style bar after scrolling. */
.site-header--home{
  position:fixed; top:0; left:0; right:0; width:100%; z-index:200;
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  border-bottom-color:transparent;
  box-shadow:none;
  transition:background-color .25s var(--ease), border-color .25s var(--ease),
             box-shadow .25s var(--ease), backdrop-filter .25s var(--ease);
}
.site-header--home.is-scrolled{
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  border-bottom-color:var(--line);
  box-shadow:var(--shadow-sm);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:68px;
}
.logo{ display:flex; align-items:center; flex-shrink:0; }
.site-logo-img{ width:190px; height:58px; object-fit:contain; display:block; }

.main-nav{ display:flex; align-items:center; gap:2px; }
.main-nav a{
  display:inline-block; padding:8px 12px; font-size:15px; color:var(--text);
  font-weight:600; border-radius:20px; transition:background .2s var(--ease), color .2s var(--ease);
  white-space:nowrap;
}
.main-nav a:hover{ background:var(--bg-alt); color:var(--red); }
.main-nav a.active{ background:var(--blue); color:#fff; }

.header-phone{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-width:202px;
  height:44px;
  padding:0 12px 0 9px;
  flex-shrink:0;
  overflow:visible;
  background:linear-gradient(180deg,#f32628 0%,#e5141b 100%);
  border:1px solid #ca1017;
  border-radius:6px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    0 1px 2px rgba(124,0,0,.18);
  color:#ffd83f;
  text-decoration:none;
}

.header-phone::before{
  content:"";
  display:block;
  width:10px;
  height:18px;
  flex:0 0 10px;
  margin-right:-5px;
  transform:translateX(2px);
  background:
    linear-gradient(#ffd83f,#ffd83f) 2px 2px / 8px 3px no-repeat,
    linear-gradient(#ffd83f,#ffd83f) 0 7px / 10px 3px no-repeat,
    linear-gradient(#ffd83f,#ffd83f) 2px 12px / 8px 3px no-repeat;
  border-radius:2px;
  filter:drop-shadow(0 1px 0 rgba(111,0,0,.28));
}

.header-phone svg{
  width:23px;
  height:23px;
  flex:0 0 23px;
  color:#ffd83f;
  filter:drop-shadow(0 1px 0 rgba(111,0,0,.35));
}

.header-phone .label{
  display:block;
  color:#ffd83f;
  font-size:22px;
  line-height:1;
  font-weight:800;
  letter-spacing:.015em;
  white-space:nowrap;
  text-shadow:0 1px 0 rgba(120,0,0,.45);
}

.header-phone .tag{
  position:absolute;
  top:-10px;
  right:8px;
  padding:2px 8px 2px;
  border:1px solid #dac985;
  border-radius:9px 9px 7px 7px;
  background:linear-gradient(180deg,#fff6c8 0%,#eadf9d 100%);
  color:#8a3a14;
  font-size:10px;
  line-height:1.15;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
  text-shadow:none;
}

.nav-toggle{
  display:none; width:40px; height:40px; border:none; background:none;
  flex-direction:column; justify-content:center; align-items:center; gap:5px;
}
.nav-toggle span{ width:22px; height:2px; background:var(--ink); border-radius:2px; }

@media (max-width:768px){
  .main-nav{ position:absolute; top:calc(100% + 1px); left:0; right:0; height:calc(100vh - 68px); background:#fff; flex-direction:column;
    align-items:stretch; padding:10px 20px 30px; gap:0; overflow-y:auto;
    transform:translateX(100%); transition:transform .28s var(--ease); border-top:1px solid var(--line); }
  .main-nav.open{ transform:translateX(0); }
  .main-nav a{ padding:16px 6px; border-bottom:1px solid var(--line); border-radius:0; font-size:16px; }
  .main-nav a.active{ background:none; color:var(--red); }
  .nav-toggle{ display:flex; }
  .header-phone{
    min-width:44px;
    width:44px;
    height:40px;
    padding:0;
  }
  .header-phone .label,
  .header-phone .tag{ display:none; }
  .header-phone::before{ display:none; }
  .header-phone svg{ width:21px; height:21px; flex-basis:21px; }
}
@media (max-width:520px){
  .site-header .container{ height:64px; }
  .main-nav{ height:calc(100vh - 65px); }
  .site-logo-img{ width:150px; height:46px; }
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative; overflow:hidden;
  padding:64px 0 68px;
  color:#fff;
  width:min(var(--container), calc(100% - 48px));
  margin:0 auto;
}
.hero .container{
  display:grid; grid-template-columns:0.82fr 1fr; align-items:center; gap:40px;
  position:relative; z-index:2;
}
.hero-eyebrow{ font-size:14px; letter-spacing:.14em; opacity:.85; margin-bottom:10px; font-weight:600; }
.hero h1{ font-size:32px; font-weight:700; line-height:1.3; letter-spacing:.01em; }
.hero h1 em{ font-style:normal; }
.hero .lede{ margin-top:16px; font-size:15px; line-height:2; opacity:.92; }
.hero .lede strong{ font-weight:700; }
.hero-tags{ display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:22px; }
.hero-tags span{ font-size:13.5px; opacity:.92; }
.hero-badges{ display:flex; gap:22px; margin-top:28px; flex-wrap:wrap; }
.hero-badge{ display:flex; align-items:center; gap:8px; font-size:13px; opacity:.95; }
.hero-badge svg,
.hero-badge img{ width:26px; height:26px; flex:0 0 26px; object-fit:contain; }
.hero-badge i{
  width:26px;
  min-width:26px;
  text-align:center;
  font-size:23px;
  line-height:1;
  flex:0 0 26px;
}
.hero-cta{
  display:inline-flex; align-items:center; gap:8px; margin-top:26px;
  background:#fff; color:var(--ink); font-weight:700; font-size:14px;
  padding:12px 26px; border-radius:24px; transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.hero-cta svg{ width:20px; height:20px; }
.hero-cta--singleline{ white-space:nowrap; flex-wrap:nowrap; }
.hero-cta--singleline span{ white-space:nowrap; }
.hero-cta--singleline svg{ flex:0 0 auto; }
.hero-cta:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }

.hero--blue{ background:linear-gradient(120deg,var(--blue-deep),var(--blue-light) 85%); }
.hero--orange{ background:linear-gradient(120deg,var(--orange-deep),var(--orange-light) 90%); color:#3a1c04; }
.hero--orange .hero-eyebrow,.hero--orange .lede,.hero--orange .hero-tags span{ color:#4a2708; opacity:.85; }
.hero--orange h1{ color:#2c1503; }
.hero--lav{ background:linear-gradient(120deg,var(--lav-deep),var(--lav-light) 92%); color:#2b2b52; }
.hero--lav h1{ color:#242252; }
.hero--lav .lede{ color:#3d3d66; opacity:1; }
.hero--pink{ background:linear-gradient(120deg,var(--pink-deep),var(--pink-light) 92%); color:#3a1236; }
.hero--pink h1{ color:#33113a; }
.hero--pink .lede{ color:#4d2049; opacity:1; }

/* full-bleed photo hero (home page pattern): one background photo with a
   gradient scrim on the left for text legibility, instead of a split layout */
.hero--photo{ padding:0; background:none; }
.hero--photo .scrim{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:1;
  background:linear-gradient(100deg, var(--blue-deep) 0%, rgba(10,79,160,.88) 32%, rgba(10,79,160,.38) 58%, rgba(10,79,160,0) 78%);
  pointer-events:none;
}
.hero--photo .container{ display:block; padding:58px 46px 64px; }
.hero--photo .hero-text{ max-width:460px; }
.hero--home{
  width:100%; max-width:none; margin:0;
  /* R40: the homepage banner is the first viewport, not a fixed-height strip.
     100vh is the fallback; 100dvh follows mobile browser chrome changes. */
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  display:flex; align-items:center;
}
.hero--home .container{ width:100%; }
.hero--home .hero-swiper{ position:absolute; inset:0; z-index:0; }
.hero--home .swiper-viewport,.hero--home .swiper-track,.hero--home .swiper-slide{ height:100%; }
.hero--home .swiper-slide{ position:relative; overflow:hidden; }
.hero--home .swiper-slide > img,.hero--home .swiper-slide > video{
  width:100%; height:100%; object-fit:cover; object-position:center;
}
.hero--home .swiper-slide > .scrim{ z-index:1; }
.hero--home .swiper-slide > .container{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  align-items:center;
}
.hero--home .hero-text{ position:relative; z-index:1; }
.hero--home .swiper-arrow{ z-index:4; }
.hero--home .swiper-dots{ z-index:4; bottom:18px; }

@media (max-width:900px){
  .hero .container{ grid-template-columns:1fr; }
  .hero h1{ font-size:28px; }
  .hero--photo .scrim{ background:linear-gradient(180deg, rgba(10,79,160,.55) 0%, rgba(10,60,130,.92) 55%, var(--blue-deep) 100%); }
  .hero--photo .hero-text{ max-width:none; }
}

@media (max-width:640px){
  .hero{ width:100%; }
  .hero--photo .container,
}

/* Unified full-width banners for every page except the homepage. */
.hero--inner{
  width:100%; max-width:none; height:360px; min-height:360px; margin:0; padding:0;
  display:flex; align-items:center; color:#fff; background:#13233c; isolation:isolate;
}
.hero--inner::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg,rgba(9,22,42,.82) 0%,rgba(9,22,42,.58) 43%,rgba(9,22,42,.18) 74%,rgba(9,22,42,.08) 100%);
}
.hero--inner .inner-hero-bg{
  position:absolute; inset:0; z-index:0; background-repeat:no-repeat;
  background-size:cover; background-position:center;
}
.hero--inner .container{
  display:block; width:100%; padding:0 24px; position:relative; z-index:2;
}
.hero--inner .hero-text{ max-width:560px; }
.hero--inner h1,
.hero--inner .lede,
.hero--inner .hero-tags span,
.hero--inner .hero-badge{ color:#fff; }
.hero--inner .lede{ opacity:.94; }
.hero--inner .hero-badge{ text-shadow:0 1px 2px rgba(0,0,0,.28); }

@media (max-width:640px){
  .hero--inner{ height:320px; min-height:320px; }
  .hero--inner .container{ padding:18px 20px; }
  .hero--inner h1{ font-size:25px; line-height:1.28; }
  .hero--inner .lede{ margin-top:10px; font-size:13px; line-height:1.65; }
  .hero--inner .hero-badges{ gap:10px 16px; margin-top:16px; }
  .hero--inner .hero-badge{ font-size:12px; }
  .hero--inner .hero-badge svg{ width:21px; height:21px; }
  .hero--inner .hero-cta{ margin-top:18px; }
  .hero--inner::after{
    background:linear-gradient(90deg,rgba(9,22,42,.82) 0%,rgba(9,22,42,.6) 70%,rgba(9,22,42,.32) 100%);
  }
}

/* ========================================================================== 
   Buttons
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 30px; border-radius:26px; font-size:14.5px; font-weight:700;
  border:1px solid transparent; transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
  white-space:nowrap;
}
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ background:#000; }
.btn-ghost{ background:var(--bg-alt); color:var(--ink); }
.btn-ghost:hover{ background:var(--bg-alt-2); }
.btn-sm{ padding:9px 20px; font-size:13px; }

.social-cta-list{ display:flex; align-items:center; gap:14px; margin-top:26px; flex-wrap:wrap; }
.social-cta{ min-width:160px; padding:12px 22px; }
.social-cta--channels{ min-width:238px; }
.social-cta .brand-icon{ width:28px; height:28px; flex:0 0 28px; }
.social-cta i.brand-icon{ font-size:26px; line-height:28px; text-align:center; }
.social-cta .brand-icon--wechat{ color:#07c160; fill:currentColor; }
.social-cta .brand-icon--channels{ color:#ff8a00; fill:currentColor; }
.social-cta-item{
  position:relative;
  display:inline-flex;
}
.social-qr-popover{
  position:absolute;
  left:50%;
  bottom:calc(100% + 12px);
  z-index:30;
  width:176px;
  padding:10px 10px 8px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:12px;
  background:#fff;
  box-shadow:0 12px 32px rgba(15,23,42,.16);
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,8px);
  transition:opacity .18s var(--ease),transform .18s var(--ease),visibility .18s;
  pointer-events:none;
}
.social-qr-popover::after{
  content:"";
  position:absolute;
  left:50%;
  top:100%;
  width:12px;
  height:12px;
  background:#fff;
  border-right:1px solid rgba(15,23,42,.10);
  border-bottom:1px solid rgba(15,23,42,.10);
  transform:translate(-50%,-6px) rotate(45deg);
}
.social-qr-popover img{
  display:block;
  width:156px;
  height:156px;
  object-fit:contain;
  background:#fff;
  border-radius:6px;
}
.social-qr-popover span{
  display:block;
  margin-top:7px;
  color:#475569;
  font-size:12px;
  line-height:1.4;
  text-align:center;
  white-space:nowrap;
}
@media (hover:hover) and (pointer:fine){
  .social-cta-item:hover .social-qr-popover,
  .social-cta-item:focus-within .social-qr-popover{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0);
  }
}

@media (max-width:560px){
  .social-cta-list{ align-items:stretch; }
  .social-cta-item{ width:100%; }
  .social-cta{ min-width:0; width:100%; }
}

/* ==========================================================================
   Grids & cards
   ========================================================================== */
.grid{ display:grid; gap:24px; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
.grid-6{ grid-template-columns:repeat(6,1fr); }
@media (max-width:900px){
  .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); }
  .grid-6{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px){
  .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; }
  .grid-6{ grid-template-columns:repeat(2,1fr); }
}

.photo-card{
  border-radius:var(--radius); overflow:hidden; background:var(--bg-alt);
  box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.photo-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.photo-card .ph{ aspect-ratio:4/3; overflow:hidden; }
.photo-card .ph img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.photo-card:hover .ph img{ transform:scale(1.06); }
.photo-card .cap{ padding:12px 10px; text-align:center; font-size:14px; color:var(--text); font-weight:600; }
.photo-card .cap strong,.photo-card .cap span{ display:block; }
.photo-card .cap strong{ color:var(--ink); font-weight:700; }
.photo-card .cap span{ margin-top:2px; color:var(--muted); font-size:12.5px; font-weight:500; }

.gallery-tabs{
  display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:32px;
}
.gallery-tabs button{
  border:1px solid var(--line); background:#fff; color:var(--text);
  padding:11px 26px; border-radius:24px; font-size:14px; font-weight:600;
  transition:all .2s var(--ease);
}
.gallery-tabs button.active,
.gallery-tabs button:not([aria-disabled="true"]):hover{
  background:var(--blue); border-color:var(--blue); color:#fff;
}

.gallery-tabs button[aria-disabled="true"],
.app-tabs button[aria-disabled="true"]{
  cursor:default;
  pointer-events:none;
}


/* Homepage production workshop — reference layout: clean 3×2 grid with
   centered titles and descriptive copy beneath each production image. */
.workshop-section{
  background:#fff;
  padding:64px 0 72px;
}
.workshop-section .container{
  max-width:1180px;
}
.workshop-head{
  margin-bottom:34px;
}
.workshop-head h2{
  font-size:30px;
  font-weight:500;
  color:#303030;
  letter-spacing:.04em;
}
.workshop-head .eyebrow{
  margin-top:13px;
  color:#4f4f4f;
  font-size:14px;
  letter-spacing:.04em;
}
.workshop-head .dash{
  display:none;
}
.workshop-mark{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:3px;
  height:15px;
  margin-top:14px;
}
.workshop-mark span{
  display:block;
  width:3px;
  border-radius:2px;
  background:#222;
}
.workshop-mark span:nth-child(1),
.workshop-mark span:nth-child(3){
  height:7px;
}
.workshop-mark span:nth-child(2){
  height:12px;
}
.workshop-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:26px;
  row-gap:30px;
}
.workshop-card{
  min-width:0;
  background:#fff;
}
.workshop-card .ph{
  width:100%;
  aspect-ratio:1.62/1;
  overflow:hidden;
  background:#f4f4f4;
}
.workshop-card .ph img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.workshop-copy{
  padding:20px 4px 0;
}
.workshop-copy h3{
  margin:0;
  text-align:center;
  color:#343434;
  font-size:16px;
  line-height:1.55;
  font-weight:500;
}
.workshop-copy p{
  margin:13px 0 0;
  color:#555;
  font-size:12.5px;
  line-height:1.9;
  font-weight:400;
  text-align:left;
}
@media (max-width:900px){
  .workshop-section{ padding:52px 0 60px; }
  .workshop-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px 22px;
  }
}
@media (max-width:600px){
  .workshop-section{ padding:44px 0 50px; }
  .workshop-head{ margin-bottom:28px; }
  .workshop-head h2{ font-size:25px; }
  .workshop-head .eyebrow{ font-size:13px; line-height:1.8; }
  .workshop-grid{ grid-template-columns:1fr; row-gap:30px; }
  .workshop-copy{ padding-top:16px; }
  .workshop-copy h3{ font-size:16px; }
  .workshop-copy p{ font-size:13px; line-height:1.85; }
}

/* numbered product cards (产品中心) — asymmetric masonry matching source layout:
   01 tall on the left; 02+03 stacked on the right; 04 spans full width below */
.product-masonry{
  display:grid; grid-template-columns:0.85fr 1.15fr; grid-auto-rows:auto; gap:0;
  border:1px solid var(--line); background:#fff;
}
.pm-card{
  background:#fff; border:0; border-radius:0;
  min-width:0; padding:30px 34px; transition:none;
}
.pm-card:hover{ box-shadow:none; transform:none; }
.pm-card .num{ font-size:25px; font-weight:800; color:var(--blue); font-family:Georgia,serif; line-height:1; }
.pm-card h3{ font-size:18px; font-weight:700; color:var(--ink); margin:6px 0 10px; }
.pm-card p{ font-size:13px; color:var(--muted); line-height:1.85; }
.pm-card .arrow{
  width:32px; height:32px; border-radius:50%; border:1px solid var(--blue); color:var(--blue);
  display:flex; align-items:center; justify-content:center; transition:all .2s var(--ease); flex-shrink:0;
}
.pm-card .arrow svg{ width:15px; height:15px; }
.pm-card:hover .arrow{ background:var(--blue); color:#fff; }

/* 01 — tall left card: text on top, photo filling the rest below */
.pm-01{ grid-column:1; grid-row:1/3; display:flex; flex-direction:column; border-right:1px solid var(--line); }
.pm-01 .ph{ flex:1; margin-top:18px; border-radius:var(--radius-sm); overflow:hidden; min-height:200px; }
.pm-01 .ph img{ width:100%; height:100%; object-fit:cover; }
.pm-01 .foot{ display:flex; justify-content:flex-end; margin-top:14px; margin-bottom:4px; }
.pm-01 .foot .arrow{ margin-right:18px; }

/* 02/03 — right column, stacked: text left, photo right, side by side */
.pm-02{ grid-column:2; grid-row:1; padding:0; border-bottom:1px solid var(--line); }
.pm-03{ grid-column:2; grid-row:2; padding:0; }
.pm-02 .row, .pm-03 .row{ display:flex; gap:0; align-items:stretch; height:100%; }
.pm-02 .text, .pm-03 .text{ flex:1 1 46%; display:flex; flex-direction:column; padding:30px 34px; }
.pm-02 .ph, .pm-03 .ph{ flex:1 1 54%; border-radius:0; overflow:hidden; }
.pm-02 .ph img, .pm-03 .ph img{ width:100%; height:100%; object-fit:cover; }
.pm-02 .foot, .pm-03 .foot{ margin-top:auto; padding-top:12px; }

/* 04 — full width, text left / 3 photos right */
.pm-04{ grid-column:1/3; grid-row:3; padding:0; border-top:1px solid var(--line); }
.pm-04 .row{ display:flex; gap:0; align-items:stretch; }
.pm-04 .text{ flex:0 0 33%; display:flex; flex-direction:column; padding:30px 34px; }
.pm-04 .foot{ margin-top:auto; padding-top:14px; }
.pm-04 .photos{ flex:1; width:100%; max-width:100%; min-width:0; padding:18px 0; box-sizing:border-box; }
.pm-04 .photos .ph{ border-radius:var(--radius-sm); overflow:hidden; }
.pm-04 .photos img{ width:100%; height:100%; object-fit:cover; }
.product-section{ background:#fff; }
.product-center-block{ overflow:hidden; border-radius:0; }

.service-cta{
  position:relative; z-index:1; min-height:265px; margin-top:0; overflow:hidden;
  display:grid; grid-template-columns:38% 62%; align-items:center;
  padding:34px 48px; color:#fff; background-size:cover; background-position:center;
}
.service-cta::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(90deg,rgba(18,39,67,.36),rgba(18,39,67,.08) 54%,rgba(18,39,67,.24));
}
.service-cta-copy h3{ font-size:25px; line-height:1.3; font-weight:600; letter-spacing:.02em; }
.service-cta-copy p{ margin-top:7px; font-size:12.5px; color:rgba(255,255,255,.9); }
.service-cta-button{
  display:inline-flex; align-items:center; gap:9px; margin-top:25px; padding:9px 22px;
  border-radius:999px; background:#fff; color:var(--red); font-size:12.5px; font-weight:700;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease);
}
.service-cta-button:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.18); }
.service-cta-button span{ font-size:9px; }
.service-cta-features{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; text-align:center; }
.service-cta-feature{ min-width:0; }
.service-cta-icon{
  width:42px; height:42px; margin:0 auto 10px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.24); color:#fff;
}
.service-cta-icon svg{ width:24px; height:24px; }
.service-cta-feature h4{ font-size:17px; font-weight:500; white-space:nowrap; }
.service-cta-feature p{ margin-top:4px; font-size:10.5px; color:rgba(255,255,255,.8); white-space:nowrap; }

@media (max-width:860px){
  .product-masonry{ grid-template-columns:minmax(0,1fr); }
  .pm-01{ grid-column:1; grid-row:auto; border-right:0; border-bottom:1px solid var(--line); }
  .pm-02,.pm-03,.pm-04{ grid-column:1; grid-row:auto; border-bottom:1px solid var(--line); }
  .pm-02 .row,.pm-03 .row,.pm-04 .row{ flex-direction:column; }
  .pm-04 .text{ flex:1; }
  .service-cta{ grid-template-columns:1fr; gap:30px; padding:34px 28px; background-position:center; }
  .service-cta-copy{ text-align:center; }
}

@media (max-width:560px){
  .service-cta{ padding:34px 20px; }
  .service-cta-copy h3{ font-size:21px; }
  .service-cta-features{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 10px; }
}

/* 彩盒页：效果图专属细节、工艺/材质卡片与底部优势区 */
.boxes-detail-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 30px;
  max-width:970px; margin:0 auto;
}
.boxes-detail-card{
  display:grid; grid-template-columns:61% 39%; min-height:176px; overflow:hidden;
  background:#fff; border:1px solid #d7dce5; border-radius:24px;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
}
.boxes-detail-card.rev{ grid-template-columns:39% 61%; }
.boxes-detail-card.rev .ph{ order:2; }
.boxes-detail-card.rev .txt{ order:1; }
.boxes-detail-card .ph{ min-height:176px; overflow:hidden; }
.boxes-detail-card .ph img{ width:100%; height:100%; object-fit:cover; display:block; }
.boxes-detail-card .txt{
  padding:18px 16px 16px; display:flex; flex-direction:column; justify-content:center;
  color:#333742; text-align:left;
}
.boxes-detail-card .tag{
  display:inline-flex; align-items:center; justify-content:center; align-self:flex-start;
  min-height:26px; padding:3px 12px; border:1px solid #cdd3de; border-radius:999px;
  color:#30343d; font-size:14px; line-height:1; white-space:nowrap; background:#fff;
}
.boxes-detail-card h3{
  margin-top:12px; font-size:24px; line-height:1.22; font-weight:700; letter-spacing:.02em;
  color:#30343d;
}
.boxes-detail-card b{ margin-top:8px; font-size:17px; line-height:1; color:#30343d; }
.boxes-detail-card p{ margin-top:10px; font-size:14px; color:#515866; line-height:1.55; }

.boxes-card-grid{
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px;
  max-width:1120px; margin:0 auto;
}
.boxes-mini-card{
  background:#fff; border:1px solid #e9eef6; border-radius:7px; overflow:hidden;
  box-shadow:0 8px 18px rgba(15,23,42,.06); text-align:center;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.boxes-mini-card:hover{ transform:translateY(-3px); box-shadow:0 12px 24px rgba(15,23,42,.1); }
.boxes-mini-card .ph{ aspect-ratio:1.18/1; overflow:hidden; background:#f3f6fb; }
.boxes-mini-card img{ width:100%; height:100%; object-fit:cover; display:block; }
.boxes-mini-card .cap{
  padding:10px 8px 11px; font-size:15px; font-weight:700; color:var(--ink);
  background:#fff;
}
.boxes-mini-card .en{
  display:block; margin-top:4px; color:#6d7480; font-size:8px; line-height:1.2;
  letter-spacing:.08em; text-transform:uppercase; font-weight:600;
}








@media (max-width:1000px){
  .boxes-detail-grid{ grid-template-columns:1fr; max-width:560px; }
  .boxes-card-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  
}

@media (max-width:560px){
  .boxes-detail-card,.boxes-detail-card.rev{ grid-template-columns:1fr; border-radius:18px; }
  .boxes-detail-card.rev .ph,.boxes-detail-card.rev .txt{ order:initial; }
  .boxes-detail-card .txt{ padding:18px; }
  .boxes-detail-card h3{ font-size:22px; }
  .boxes-card-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  
}

.bags-process-flow{
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px;
  max-width:1040px; margin:0 auto;
}
.bags-process-step{
  border:1px solid #b8b7c6; background:#fff; text-align:center; min-height:188px;
  display:grid; grid-template-rows:132px 1fr; box-shadow:none;
}
.bags-process-step .top{
  position:relative; background:#dcdbe9; padding:16px 10px 14px;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
}
.bags-process-step .num{
  position:absolute; top:11px; left:13px; font-family:Georgia,serif; font-size:22px;
  line-height:1; font-style:italic; color:#101827; letter-spacing:.03em;
}
.bags-process-step .ic{ width:54px; height:54px; color:#222733; margin-bottom:8px; }
.bags-process-step .ic svg{ width:100%; height:100%; }
.bags-process-step h4{ font-size:19px; color:#111827; font-weight:500; line-height:1.15; }
.bags-process-step p{
  padding:10px 11px 12px; color:#111827; font-size:12.5px; line-height:1.55;
  display:flex; align-items:center; justify-content:center;
}
@media (max-width: 1000px){
  .bags-process-flow{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 640px){
  .bags-process-flow{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .bags-process-step{ min-height:172px; grid-template-rows:122px 1fr; }
  .bags-process-step h4{ font-size:17px; }
}

/* ==========================================================================
   CTA banners
   ========================================================================== */










.cta-features{ display:flex; gap:40px; margin-top:24px; flex-wrap:wrap; }
.cta-features .f{ text-align:left; }
.cta-features .ic{ width:34px; height:34px; margin-bottom:10px; }
.cta-features .ic svg{ width:100%; height:100%; }
.cta-features h5{ font-size:14.5px; font-weight:700; margin-bottom:4px; }
.cta-features span{ font-size:12px; opacity:.75; }

/* R31: homepage “走进金亚” — editable text overlay; sample gallery restored to original styling */
.walkin-section{ background:#fff; padding-top:0; }
.walkin-block{ overflow:visible; border-radius:0; background:#fff; box-shadow:none; }
.walkin-hero{
  position:relative; overflow:hidden; min-height:520px; aspect-ratio:auto;
  background:#eef1f5;
}
.walkin-hero-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;
  display:block;
}
.walkin-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.05) 38%, rgba(255,255,255,0) 70%);
}
.walkin-copy{
  position:absolute; z-index:2; left:7.6%; top:90px; transform:none;
  width:min(350px,34%); color:var(--ink);
}
.walkin-kicker{
  display:none;
}
.walkin-copy h2{
  display:inline-block; padding:4px 20px; margin:0 0 24px 0;
  background:rgba(255,255,255,.72); border-radius:4px; color:#1a1f2b;
  font-size:22px; line-height:1.35; font-weight:400; letter-spacing:.02em;
  box-shadow:0 1px 5px rgba(10,20,30,.08);
}
.walkin-desc{
  width:330px; padding:12px 16px; margin:0 0 44px 0;
  background:rgba(255,255,255,.72); border-radius:4px;
  box-shadow:0 1px 8px rgba(10,20,30,.08); backdrop-filter:blur(1px);
}
.walkin-desc p{ color:#1f2b38; font-size:12px; line-height:1.78; margin:0; }
.walkin-desc p + p{ margin-top:2px; }
.walkin-more{
  display:inline-flex; align-items:center; gap:8px; padding:9px 24px;
  background:#e91e8f; color:#fff; border-radius:999px; font-size:13px; font-weight:700;
  box-shadow:0 8px 20px rgba(233,30,143,.22); transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.walkin-more:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(233,30,143,.3); }
.walkin-more span{ font-size:16px; line-height:1; }
.walkin-block .sample-swiper{
  width:100%; margin:-24px auto 0; padding:14px 16px 8px;
  background:#fff; box-shadow:0 4px 12px rgba(20,25,40,.08); z-index:2;
}
.walkin-block .sample-swiper--source{
  width:calc(100% - 160px); margin:-80px auto 0; padding:12px 14px 16px;
  position:relative; z-index:3; background:#fff; box-shadow:0 8px 22px rgba(20,25,40,.1);
}
.sample-swiper--source .swiper-track{ gap:18px; }
.sample-swiper--source .photo-card{ box-shadow:none; border:0; border-radius:0; background:#fff; }
.sample-swiper--source .photo-card .ph{ aspect-ratio:16/9; }
.sample-swiper--source .photo-card .cap{
  padding:10px 4px 0; font-size:12.5px; font-weight:600; color:var(--ink);
}
.sample-swiper--source .swiper-arrow,
.sample-swiper--source .swiper-dots{ display:none; }
.walkin-block + .stats{ margin-top:84px; }

@media (max-width:900px){
  .walkin-hero{ min-height:390px; aspect-ratio:auto; }
  .walkin-hero::after{
    background:linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.94) 54%, rgba(255,255,255,.24) 78%, rgba(255,255,255,0) 100%);
  }
  .walkin-copy{ left:5%; width:56%; }
  .walkin-copy h2{ font-size:30px; }
  .walkin-block .sample-swiper--source{ width:calc(100% - 56px); margin:-56px auto 0; }
}

@media (max-width:640px){
  .walkin-section{ padding-top:24px; }
  .walkin-hero{ min-height:520px; border-radius:16px; }
  .walkin-hero-image{ object-position:64% center; }
  .walkin-hero::after{
    background:linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.14) 28%, rgba(255,255,255,.96) 58%, #fff 100%);
  }
  .walkin-copy{
    left:18px; right:18px; top:auto; bottom:26px; transform:none; width:auto;
    padding:20px; background:rgba(255,255,255,.9); border:1px solid rgba(255,255,255,.7);
    border-radius:14px; box-shadow:0 10px 30px rgba(20,30,45,.12); backdrop-filter:blur(6px);
  }
  .walkin-kicker{ font-size:11px; }
  .walkin-copy h2{ font-size:26px; margin-bottom:12px; }
  .walkin-copy p{ font-size:13px; line-height:1.72; }
  .walkin-more{ margin-top:8px; }
  .walkin-block .sample-swiper{ width:calc(100% - 24px); margin:-24px auto 0; padding:10px 10px 28px; }
  .walkin-block .sample-swiper--source{ width:calc(100% - 24px); margin:-24px auto 0; padding:10px 10px 28px; }
  .sample-swiper--source .swiper-arrow,
  .sample-swiper--source .swiper-dots{ display:flex; }
  .walkin-block + .stats{ margin-top:52px; }
}

/* Lightweight image/video swiper. Slides accept either <img> or <video> and
   share the same controls, touch gestures, keyboard navigation and pagination. */
.media-swiper{ --swiper-gap:12px; position:relative; min-width:0; }
.swiper-viewport{ overflow:hidden; width:100%; }
.swiper-track{
  display:flex; gap:var(--swiper-gap); width:100%;
  transition:transform .5s var(--ease); will-change:transform;
}
.swiper-slide{ flex:0 0 100%; min-width:0; }
.swiper-slide img,.swiper-slide video{ display:block; width:100%; }
.swiper-arrow{
  position:absolute; top:50%; z-index:3; width:38px; height:38px; margin-top:-19px;
  display:flex; align-items:center; justify-content:center; border:0; border-radius:50%;
  background:rgba(14,24,42,.7); color:#fff; box-shadow:0 4px 16px rgba(0,0,0,.18);
  transition:opacity .2s var(--ease), transform .2s var(--ease), background .2s var(--ease);
}
.swiper-arrow:hover{ background:var(--blue); transform:scale(1.05); }
.swiper-arrow:disabled{ opacity:.28; cursor:default; transform:none; }
.swiper-arrow span{ font-size:30px; line-height:1; transform:translateY(-1px); }
.swiper-prev{ left:12px; }
.swiper-next{ right:12px; }
.swiper-dots{
  position:absolute; left:50%; bottom:10px; z-index:3; transform:translateX(-50%);
  display:flex; gap:7px; align-items:center; justify-content:center;
}
.swiper-dot{ width:8px; height:8px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.58); box-shadow:0 0 0 1px rgba(16,24,40,.18); }
.swiper-dot.active{ width:24px; border-radius:8px; background:#fff; }
.media-swiper.is-static .swiper-arrow,.media-swiper.is-static .swiper-dots{ display:none; }
.product-swiper{ --swiper-gap:12px; padding-bottom:25px; }
.product-swiper.is-static{ padding-bottom:0; }
.pm-04 .photos.product-swiper{ padding-top:18px; padding-bottom:18px; }
.pm-04 .photos.product-swiper.is-static{ padding-bottom:18px; }
.product-swiper .swiper-slide{ aspect-ratio:4/5; }
.product-swiper .swiper-arrow,.sample-swiper .swiper-arrow{ width:32px; height:32px; margin-top:-16px; }
.product-swiper .swiper-dots,.sample-swiper .swiper-dots{ bottom:5px; }
.product-swiper .swiper-dot,.sample-swiper .swiper-dot{ background:#b8c0cc; box-shadow:none; }
.product-swiper .swiper-dot.active,.sample-swiper .swiper-dot.active{ background:var(--blue); }
.sample-swiper .photo-card{ box-shadow:none; border:0; border-radius:0; background:#fff; }
.sample-swiper .photo-card .ph{ aspect-ratio:16/9; }
.sample-swiper .photo-card:hover{ transform:none; }
@media (max-width:760px){
  .hero--home .swiper-slide img,.hero--home .swiper-slide video{ object-position:62% center; }
  .hero--home .swiper-arrow{ display:none; }
  .walkin-section{ padding-top:24px; }
}

.cta-designer{
  border-radius:var(--radius-lg); overflow:hidden; position:relative;
  background:#fdf3d8;
}
.cta-designer img{ width:100%; display:block; }






/* ==========================================================================
   Stats strip
   ========================================================================== */
.stats{
  display:flex; justify-content:space-between; text-align:center; flex-wrap:wrap; gap:24px;
}
.stats .stat{ flex:1; min-width:110px; }
.stats .stat .n{ font-size:clamp(24px,2.6vw,36px); font-weight:500; color:var(--ink); }
.stats .stat .n small{ font-size:.5em; font-weight:700; margin-left:2px; }
.stats .stat .l{ font-size:12.5px; color:var(--muted); margin-top:6px; }

/* ==========================================================================
   Culture / glass cards
   ========================================================================== */
.culture-banner{
  position:relative; border-radius:var(--radius-lg); overflow:hidden;
  background-size:cover; background-position:center; padding:44px 5%;
  color:#fff; text-align:center;
}
.culture-banner::before{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(10,16,30,.55); }
.culture-banner > *{ position:relative; z-index:2; }
.culture-banner .eb{ font-size:12px; letter-spacing:.24em; opacity:.8; }
.culture-banner h2{ font-size:25px; font-weight:700; margin:7px 0 26px; }
.culture-banner--light{ background:#fff; color:var(--ink); padding:20px 8% 28px; }
.culture-banner--light::before{ display:none; }
.culture-banner--light .glass-card{
  background:#fff;
  border:1px solid #e4e6e9;
  border-radius:10px;
  color:var(--text);
  backdrop-filter:none;
  box-shadow:2px 4px 7px rgba(0,0,0,.18);
}
.culture-banner--light .eb{ color:var(--muted); }
.culture-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.glass-card{
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(6px); border-radius:var(--radius); padding:22px 12px; text-align:center;
}
.glass-card .ic{ width:38px; height:38px; margin:0 auto 14px; }
.glass-card .ic svg{ width:100%; height:100%; }
.culture-banner--light .glass-card .ic{
  width:64px;
  height:64px;
  margin:0 auto 18px;
  border-radius:50%;
  background:#ececec;
  display:grid;
  place-items:center;
}
.culture-banner--light .glass-card .ic img{
  width:70%;
  height:70%;
  object-fit:contain;
  display:block;
}
.glass-card h4{ font-size:15px; font-weight:700; margin-bottom:10px; }
.glass-card p{ font-size:12px; opacity:.85; line-height:1.8; }
@media (max-width:760px){ .culture-grid{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   Tables (glue comparison etc.)
   ========================================================================== */
.compare-table{ width:100%; border-collapse:collapse; font-size:13.5px; }
.compare-table th,.compare-table td{
  border:1px solid var(--line); padding:14px 16px; text-align:center;
}
.compare-table thead th{ background:var(--ink); color:#fff; font-weight:700; font-size:15px; }
.compare-table td:first-child,.compare-table th:first-child{
  text-align:left; background:var(--bg-alt); font-weight:600; color:var(--ink);
}
.compare-table tbody tr:nth-child(even) td:not(:first-child){ background:#fafbfc; }

/* 4-column key/value table (介绍说明 pattern): col 1 & 3 are labels */
.kv-table td:nth-child(3){ text-align:left; background:var(--bg-alt); font-weight:600; color:var(--ink); }
.kv-table td:nth-child(2),.kv-table td:nth-child(4){ background:#fff; }
.kv-table tr:nth-child(even) td:nth-child(2),.kv-table tr:nth-child(even) td:nth-child(4){ background:#fafbfc; }



/* ==========================================================================
   Floating sidebar
   ========================================================================== */
.float-side{
  position:fixed; right:16px; bottom:100px; z-index:150;
  display:flex; flex-direction:column; gap:1px;
  width:72px;
  border-radius:4px; overflow:visible;
  filter:drop-shadow(0 4px 12px rgba(15,38,68,.18));
}
.float-side a, .float-side button{
  width:72px; min-width:72px; height:60px; padding:6px 4px;
  box-sizing:border-box;
  background:var(--red); color:#fff; border:none;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:5px; font-size:12px; line-height:1.15; font-weight:500;
  border-bottom:1px solid rgba(255,255,255,.22);
  box-shadow:none;
  transition:background .2s var(--ease);
  cursor:pointer;
}
.float-side > :first-child,
.float-side > :first-child > button{ border-radius:4px 4px 0 0; }
.float-side > :last-child,
.float-side > :last-child > button{ border-radius:0 0 4px 4px; }
.float-side a:hover, .float-side button:hover{ background:var(--red-dark); }
.float-side span{
  display:block;
  width:100%;
  white-space:nowrap;
  word-break:keep-all;
  text-align:center;
}
.float-side svg{ width:19px; height:19px; flex:0 0 19px; }
.float-side i{ font-size:19px; line-height:1; }
.float-side .to-top{ background:var(--ink); }
.float-side .to-top span{ font-size:12px; }
.float-wechat-item{ position:relative; }
.float-wechat-popover{
  position:absolute;
  right:calc(100% + 12px);
  top:50%;
  z-index:5;
  width:164px;
  padding:10px;
  border:1px solid rgba(15,38,68,.12);
  border-radius:10px;
  background:#fff;
  box-shadow:0 14px 36px rgba(15,38,68,.22);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(8px,-50%) scale(.96);
  transform-origin:100% 50%;
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.float-wechat-popover::after{
  content:"";
  position:absolute;
  right:-7px;
  top:50%;
  width:12px;
  height:12px;
  background:#fff;
  border-top:1px solid rgba(15,38,68,.12);
  border-right:1px solid rgba(15,38,68,.12);
  transform:translateY(-50%) rotate(45deg);
}
.float-wechat-popover-title{
  margin-bottom:7px;
  color:var(--ink);
  font-size:13px;
  line-height:1.4;
  font-weight:700;
  text-align:center;
}
.float-wechat-popover img{
  display:block;
  width:142px;
  height:142px;
  margin:0 auto;
  object-fit:contain;
  background:#fff;
}
.float-wechat-item:hover .float-wechat-popover,
.float-wechat-item:focus-within .float-wechat-popover,
.float-wechat-item.is-open .float-wechat-popover{
  opacity:1;
  visibility:visible;
  transform:translate(0,-50%) scale(1);
}
.inquiry-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease, visibility .2s ease;
}
.inquiry-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.inquiry-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(7,18,34,.58);
  backdrop-filter:blur(2px);
}
.inquiry-modal-dialog{
  position:relative;
  z-index:1;
  width:min(100%,560px);
  max-height:calc(100vh - 48px);
  overflow:auto;
  padding:30px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 24px 70px rgba(7,18,34,.3);
}
.inquiry-modal-close{
  position:absolute;
  top:12px;
  right:14px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#f4f5f7;
  color:#5d6672;
  font-size:26px;
  line-height:1;
  cursor:pointer;
}
.inquiry-modal-head{ padding-right:40px; margin-bottom:22px; }
.inquiry-modal-head h3{ margin:0 0 7px; color:var(--ink); font-size:24px; line-height:1.25; }
.inquiry-modal-head p{ margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.inquiry-modal-form{ display:grid; gap:16px; }
.inquiry-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.inquiry-modal-form label{ display:grid; gap:7px; color:var(--ink); font-size:13px; font-weight:600; }
.inquiry-modal-form label span em{ color:var(--red); font-style:normal; }
.inquiry-modal-form input,
.inquiry-modal-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid #d9dee5;
  border-radius:7px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-weight:400;
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.inquiry-modal-form input{ height:44px; padding:0 12px; }
.inquiry-modal-form textarea{ min-height:120px; padding:11px 12px; resize:vertical; line-height:1.65; }
.inquiry-modal-form input:focus,
.inquiry-modal-form textarea:focus{
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(225,31,43,.1);
}
.inquiry-form-submit{
  min-height:46px;
  border:0;
  border-radius:7px;
  background:var(--red);
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.inquiry-form-submit:hover{ background:var(--red-dark); }
.inquiry-form-submit:disabled{ opacity:.65; cursor:not-allowed; }
.inquiry-form-status{
  min-height:20px;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
  text-align:center;
}
.inquiry-form-status.is-error{ color:#c62828; }
.inquiry-form-status.is-success{ color:#17823b; }
body.inquiry-modal-open{ overflow:hidden; }
@media (max-width:640px){
  .float-side{ right:12px; bottom:90px; width:46px; filter:none; }
  .float-side a,.float-side button{ width:46px; min-width:46px; height:46px; padding:4px; font-size:9px; }
  .float-side svg{ width:15px;height:15px; flex-basis:15px; }
  .float-side i{ font-size:16px; }
  .float-wechat-popover{ width:148px; }
  .float-wechat-popover img{ width:126px; height:126px; }
  .inquiry-modal{ padding:14px; }
  .inquiry-modal-dialog{ padding:24px 18px 20px; max-height:calc(100vh - 28px); }
  .inquiry-modal-head h3{ font-size:21px; }
  .inquiry-form-grid{ grid-template-columns:1fr; }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background:#fff; border-top:1px solid var(--line); padding-top:34px; }
.footer-nav{
  display:flex; flex-wrap:wrap; gap:6px 28px; padding-bottom:22px; margin-bottom:28px;
  border-bottom:1px solid var(--line); font-size:13px; color:var(--text);
}
.footer-nav a:hover{ color:var(--red); }
.footer-nav--brand{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:56px;
  min-height:82px;
  padding:10px 0 20px;
}
.footer-nav--brand .footer-brand{
  flex:0 0 190px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.footer-nav--brand .footer-brand img{
  width:190px;
  height:58px;
  object-fit:contain;
  display:block;
}
.footer-nav--brand .footer-nav-links{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.footer-nav--brand .footer-nav-links a{
  display:flex;
  align-items:center;
  min-height:44px;
  font-size:14px;
  line-height:1;
  white-space:nowrap;
}
@media (max-width:980px){
  .footer-nav--brand{
    flex-wrap:wrap;
    gap:18px 28px;
  }
  .footer-nav--brand .footer-nav-links{
    width:100%;
    flex:1 0 100%;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:8px 26px;
  }
}
@media (max-width:560px){
  .footer-nav--brand .footer-brand{
    flex-basis:160px;
  }
  .footer-nav--brand .footer-brand img{
    width:160px;
    height:auto;
  }
  .footer-nav--brand .footer-nav-links{
    gap:6px 18px;
  }
}

.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:36px; padding-bottom:28px; }
.footer-col h5{ font-size:16px; font-weight:700; color:var(--ink); margin-bottom:16px; }
.footer-col p{ font-size:12px; color:var(--muted); line-height:1.85; }
.footer-contact-row{ display:flex; align-items:center; gap:8px; font-size:15px; color:var(--ink); font-weight:700; margin-bottom:10px; }
.footer-contact-row svg{ width:16px; height:16px; color:var(--red); }
.footer-contact-sub{ font-size:13px; color:var(--muted); margin-bottom:14px; }
.footer-qr{
  width:92px; height:92px; border:1px solid var(--line); border-radius:6px; overflow:hidden; margin-bottom:12px;
  padding:6px; box-sizing:border-box;
  background:#fff; display:grid; place-items:center;
}
.footer-qr img{
  width:100%; height:100%; object-fit:contain; object-position:center center;
  display:block; margin:auto;
}
.social-row{ display:flex; gap:10px; align-items:center; overflow:visible; }
.footer-social-item{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.social-row a{
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:transparent; color:#fff; font-size:13px;
}
.social-row .social-link img{ width:30px; height:30px; display:block; object-fit:contain; border-radius:50%; }
.footer-social-qr-popover{
  position:absolute;
  left:50%;
  bottom:calc(100% + 12px);
  z-index:20;
  width:152px;
  padding:8px;
  border:1px solid rgba(15,38,68,.12);
  border-radius:10px;
  background:#fff;
  box-shadow:0 12px 30px rgba(15,38,68,.18);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,8px) scale(.96);
  transform-origin:50% 100%;
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.footer-social-qr-popover::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-7px;
  width:12px;
  height:12px;
  border-right:1px solid rgba(15,38,68,.12);
  border-bottom:1px solid rgba(15,38,68,.12);
  background:#fff;
  transform:translateX(-50%) rotate(45deg);
}
.footer-social-qr-popover img{
  display:block;
  width:136px;
  height:136px;
  border-radius:4px;
  object-fit:contain;
  background:#fff;
}
@media (hover:hover) and (pointer:fine){
  .footer-social-item:hover .footer-social-qr-popover,
  .footer-social-item:focus-within .footer-social-qr-popover{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0) scale(1);
  }
}
@media (max-width:860px){
  .footer-social-qr-popover{display:none;}
}
.footer-bottom{ background:var(--red); color:#fff; text-align:center; padding:14px 0; font-size:13px; }
.footer-bottom a{ opacity:.9; }
.footer-bottom a:hover{ opacity:1; text-decoration:underline; }

@media (max-width:860px){
  .footer-grid{ grid-template-columns:1fr; gap:28px; }
}

/* ==========================================================================
   Page-specific: applications tabs (bags page)
   ========================================================================== */
.app-section{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; padding:64px 0;
  background-size:cover; background-position:center; color:#fff;
}
.app-section::before{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg, rgba(10,20,45,.55), rgba(10,20,45,.8)); }
.app-section .container{ position:relative; z-index:2; }
.app-section .section-head h2{ color:#fff; }
.app-section .section-head p{ color:rgba(255,255,255,.8); font-size:13.5px; margin-top:10px; }
.app-tabs{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin:30px 0 36px; }
.app-tabs button,
.app-tabs > a{
  display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.35); color:#fff;
  padding:12px 28px; border-radius:24px; font-size:14px; line-height:1.2; font-weight:600;
  text-decoration:none; transition:all .2s var(--ease);
}
.app-tabs button.active,
.app-tabs button:not([aria-disabled="true"]):hover,
.app-tabs > a:hover{ background:#fff; color:var(--ink); }
.case-carousel{
  position:relative;
  padding:0 52px;
}
.case-carousel-viewport{
  overflow:hidden;
}
.case-carousel-track{
  display:flex;
  align-items:stretch;
  gap:24px;
  transition:transform .32s var(--ease);
  will-change:transform;
}
.case-carousel .case-card{
  flex:0 0 auto;
  min-width:0;
  height:auto;
  align-self:stretch;
  display:flex;
  flex-direction:column;
}
.case-carousel .case-card .body{ flex:1 1 auto; }
.case-carousel-nav{
  position:absolute;
  top:50%;
  z-index:4;
  width:42px;
  height:42px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.46);
  border-radius:50%;
  background:rgba(10,20,45,.52);
  color:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  transform:translateY(-50%);
  transition:background .2s var(--ease),opacity .2s var(--ease),transform .2s var(--ease);
}
.case-carousel-prev{ left:0; }
.case-carousel-next{ right:0; }
.case-carousel-nav svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.case-carousel-nav:hover:not(:disabled){
  background:rgba(255,255,255,.96);
  color:var(--ink);
}
.case-carousel-nav:disabled{
  opacity:.32;
  cursor:default;
}
.case-carousel-nav[hidden]{
  display:none;
}

.case-card{
  display:flex;
  flex-direction:column;
  height:100%;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); border-radius:var(--radius);
  overflow:hidden; backdrop-filter:blur(4px);
}
.case-card .ph{ aspect-ratio:16/11; overflow:hidden; flex:0 0 auto; }
.case-card .ph img{ width:100%; height:100%; object-fit:cover; }
.case-card .body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  padding:20px;
}
.case-card h4{
  font-size:17px;
  line-height:1.5;
  font-weight:700;
  margin-bottom:8px;
}
.case-card p{
  flex:1 1 auto;
  font-size:12.5px;
  opacity:.82;
  line-height:1.85;
  margin-bottom:0;
}
.case-card .foot{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:16px;
  flex:0 0 auto;
  height:auto;
  min-height:0;
  margin-top:auto;
  padding:14px 20px;
  border-top:1px solid rgba(255,255,255,.15);
}
.case-card .foot span{
  min-width:0;
  font-size:11.5px;
  line-height:1.75;
  opacity:.7;
}
.case-card .foot a{
  align-self:center;
  white-space:nowrap;
  font-size:12px;
  font-weight:700;
}

/* tech dark comparison (专版 vs 无版) */
.tech-compare{
  position:relative; border-radius:var(--radius-lg); overflow:hidden; color:#fff;
  background:#060b18;
  padding:54px 6% 58px;
  min-height:420px;
  display:grid;
  grid-template-columns:.95fr 1.2fr;
  align-items:center;
  gap:42px;
}
.tech-bg{
  position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(2,7,18,.2), rgba(2,7,18,.56)),
    url("../img/bags-tech-compare-bg-v2.jpg") center/cover no-repeat;
}
.tech-copy,.tech-panel,.tech-footer{ position:relative; z-index:2; }
.tech-brand{ font-size:12px; letter-spacing:.14em; color:#d8e2ef; margin-bottom:14px; font-weight:700; }
.tech-copy h2{ font-size:32px; line-height:1.18; font-weight:800; text-shadow:0 2px 10px rgba(0,0,0,.35); }
.tech-sub{ margin-top:22px; font-size:17px; color:#92c1df; font-weight:700; letter-spacing:.04em; }
.tech-note{
  display:inline-block; margin-top:86px; padding:12px 28px; border-radius:4px;
  background:rgba(232,238,244,.7); color:#182235; font-size:18px; line-height:1.55; font-weight:700;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
}
.tech-panel{
  display:grid; grid-template-columns:1fr 1fr; border:1px solid rgba(255,255,255,.2);
  background:rgba(4,8,16,.48); box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.tech-option{ min-height:292px; padding:32px 38px 28px; border-left:1px solid rgba(255,255,255,.16); }
.tech-option:first-child{ border-left:none; }
.tech-option .ic{ width:74px; height:74px; margin:0 auto 16px; color:#d8dee9; opacity:.9; }
.tech-option .ic svg{ width:100%; height:100%; }
.tech-option h3{ font-size:21px; font-weight:800; text-align:center; margin-bottom:38px; }
.tech-option ul{ max-width:130px; margin:0 auto; }
.tech-option li{ font-size:15px; color:#f2f6ff; padding:7px 0; display:flex; align-items:center; gap:9px; }
.tech-option li::before{ content:""; width:7px; height:7px; border-radius:50%; background:#d8dee9; flex:0 0 auto; }
.tech-footer{
  position:absolute; left:0; right:0; bottom:24px; text-align:center;
  font-size:22px; letter-spacing:.18em; color:#e3e7ee; opacity:.92;
}
@media (max-width: 900px){
  .tech-compare{ grid-template-columns:1fr; padding:40px 24px 78px; gap:26px; }
  .tech-note{ margin-top:28px; font-size:15px; }
  .tech-footer{ font-size:17px; bottom:20px; }
}
@media (max-width: 640px){
  .tech-panel{ grid-template-columns:1fr; }
  .tech-option{ border-left:none; border-top:1px solid rgba(255,255,255,.16); }
  .tech-option:first-child{ border-top:none; }
  .tech-copy h2{ font-size:26px; }
}

.material-media{
  display:grid; grid-template-columns:1fr 1.45fr; grid-template-rows:1fr 1fr;
  gap:10px; min-height:330px;
}
.material-media img{ width:100%; height:100%; min-height:0; object-fit:cover; border-radius:8px; }





@media (max-width:760px){
  .material-media{ order:-1; min-height:260px; }
}

/* full-width craft description rows from the reference artwork */
.craft-desc{ position:relative; border:1px solid #d7dbe2; border-radius:12px; padding:25px 32px 18px; margin:0 0 32px; text-align:center; background:#fff; }
.craft-desc h4{ position:absolute; top:0; left:50%; transform:translate(-50%,-50%); padding:0 24px; background:#fff; font-size:16px; font-weight:700; color:var(--ink); white-space:nowrap; }
.craft-desc p{ font-size:13px; color:var(--muted); line-height:1.9; }

.glue-visual{ max-width:760px; margin:0 auto 28px; overflow:hidden; }
.glue-visual img{ display:block; width:100%; height:auto; }



/* three-element diagram (卷标三要素) */
.label-elements{ background:#dcecff; }
.label-elements .section-head{ margin-bottom:28px; }
.diagram-block{ background:transparent; border-radius:0; padding:0 0 34px; margin:0; }
.diagram-block h4{ font-size:16px; font-weight:700; color:var(--ink); margin-bottom:16px; }
.diagram-image{ display:block; width:min(100%,680px); height:auto; margin-top:16px; border-radius:18px; }



.service-flow{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:52px; max-width:980px; margin:0 auto; }
.flow-node{
  position:relative; aspect-ratio:1; border-radius:50%; background:#eef3f9;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  color:var(--ink); padding:16px; box-shadow:inset 0 0 0 1px rgba(19,43,76,.04);
}
.flow-node:not(:last-child)::after{
  content:""; position:absolute; left:100%; top:50%; width:52px; height:14px; transform:translateY(-50%);
  background:linear-gradient(#aeb7c4,#aeb7c4) left center/42px 1px no-repeat;
}
.flow-node:not(:last-child)::before{
  content:""; position:absolute; left:calc(100% + 37px); top:50%; width:8px; height:8px;
  border-top:1px solid #aeb7c4; border-right:1px solid #aeb7c4; transform:translateY(-50%) rotate(45deg);
}
.flow-node span{ font-size:15px; font-weight:700; }
.flow-node small{ margin-top:5px; font-size:12px; color:var(--muted); }

.team-benefits{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px 44px; }
.team-benefit{ text-align:center; min-width:0; }

.team-benefit h4{ color:var(--ink); font-size:15px; margin-bottom:6px; }
.team-benefit p{ color:var(--muted); font-size:11px; line-height:1.5; }

@media (max-width:760px){
  .craft-desc{ padding:24px 18px 16px; }
  .service-flow{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
  .flow-node{ aspect-ratio:auto; min-height:140px; }
  .flow-node::before,.flow-node::after{ display:none; }
  .team-benefits{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 18px; }
}

/* box type panel */
.boxtype-panel{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); }
.boxtype-panel img{ width:100%; }

/* news list */
.news-item{ display:grid; grid-template-columns:260px 1fr auto; gap:26px; padding:28px 0; border-bottom:1px solid var(--line); align-items:center; }
.news-item .ph{ border-radius:var(--radius-sm); overflow:hidden; aspect-ratio:16/10; }
.news-item .ph img{ width:100%; height:100%; object-fit:cover; }
.news-item h4{ font-size:17px; font-weight:700; color:var(--ink); margin-bottom:10px; }
.news-item:hover h4{ color:var(--red); }
.news-item p{ font-size:13px; color:var(--muted); line-height:1.85; }
.news-date{ text-align:center; padding-left:26px; border-left:1px solid var(--line); color:var(--muted); }
.news-date .y{ font-size:15px; font-weight:700; color:var(--ink); }
.news-date .d{ font-size:13px; margin-top:4px; }
@media (max-width:760px){
  .news-item{ grid-template-columns:1fr; }
  .news-date{ border-left:none; padding-left:0; display:flex; gap:8px; align-items:baseline; }
}
/* contact page */
.contact-intro{ display:grid; grid-template-columns:96px 1fr; gap:24px; }
.contact-avatar{ width:96px; height:96px; border-radius:50%; overflow:hidden; border:3px solid var(--bg-alt); }
.contact-avatar img{ width:100%; height:100%; object-fit:cover; }
.contact-intro h3{ font-size:19px; font-weight:700; color:var(--ink); margin-bottom:14px; position:relative; padding-left:14px; }
.contact-intro h3::before{ content:""; position:absolute; left:0; top:3px; bottom:3px; width:4px; background:var(--red); border-radius:2px; }
.contact-intro p{ font-size:13.5px; color:var(--muted); line-height:2; }
.contact-cardgrid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:36px; }
.contact-card{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.contact-card .head{ background:var(--red); color:#fff; font-weight:700; font-size:16px; padding:16px 22px; }
.contact-card .body{ padding:22px; display:flex; flex-direction:column; gap:16px; }
.contact-row{ display:flex; gap:12px; align-items:flex-start; }
.contact-row svg{ width:20px; height:20px; color:var(--red); flex-shrink:0; margin-top:2px; }
.contact-row .l{ font-size:12px; color:var(--muted); margin-bottom:2px; }
.contact-row .v{ font-size:14px; color:var(--ink); font-weight:600; line-height:1.6; }
.contact-map{ border-radius:var(--radius); overflow:hidden; height:100%; min-height:220px; }
.contact-map img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:760px){
  .contact-intro{ grid-template-columns:64px 1fr; }
  .contact-avatar{ width:64px; height:64px; }
  .contact-cardgrid{ grid-template-columns:1fr; }
}






/* about page value blocks */
.value-block{ display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:stretch; padding:0; border:1px solid var(--line); border-bottom:0; }
.value-block:last-of-type{ border-bottom:1px solid var(--line); }
.value-block > div:not(.ph){ padding:16px 24px; display:flex; flex-direction:column; justify-content:center; }
.value-block .ph{ border-radius:0; overflow:hidden; height:260px; }
.value-block .ph img{ width:100%; height:100%; object-fit:cover; }
.value-block .ph img[src$="about-block-2.jpg"]{ width:120%; max-width:none; margin-left:-20%; }
.value-block h3{ font-size:18px; font-weight:700; color:var(--ink); margin-bottom:10px; }
.value-block p{ font-size:11.5px; color:var(--muted); line-height:1.65; }
.value-block.rev .ph{ order:2; }
@media (max-width:760px){
  .value-block,.value-block.rev{ grid-template-columns:1fr; }
  .value-block.rev .ph{ order:-1; }
  .value-block .ph{ height:auto; aspect-ratio:16/10; }
  .value-block > div:not(.ph){ padding:22px 20px; }
}

/* reveal on scroll (progressive enhancement only — visible by default so content
   never depends on JS execution; JS adds .will-animate before toggling .in) */
.reveal.will-animate{ opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.will-animate.in{ opacity:1; transform:translateY(0); }

/* misc */
.center{ text-align:center; }
.mt-lg{ margin-top:48px; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
@media (max-width:760px){ .two-col{ grid-template-columns:1fr; } }


/* R27: home banner refinement — better crop control for each slide and improved mobile readability */
.hero--home .swiper-slide:nth-child(1) img{ object-position:center; }
.hero--home .swiper-slide:nth-child(2) img{ object-position:center; }
.hero--home .swiper-slide:nth-child(3) img{ object-position:center; }

@media (min-width: 1280px){
  .hero--home .swiper-slide:nth-child(1) img{ object-position:center center; }
  .hero--home .swiper-slide:nth-child(2) img{ object-position:center center; }
  .hero--home .swiper-slide:nth-child(3) img{ object-position:center center; }
}

@media (max-width: 1024px){
  .hero--home .hero-text{ max-width:420px; }
}

@media (max-width: 768px){
  .hero--home .container{ padding:34px 20px 56px; }
  .hero--home .hero-text{ max-width:280px; }
  .hero--home .hero-eyebrow{ font-size:12px; letter-spacing:.12em; margin-bottom:8px; }
  .hero--home h1{ font-size:24px; line-height:1.32; }
  .hero--home .hero-badges{ gap:10px 14px; margin-top:16px; }
  .hero--home .hero-badge{ font-size:12px; }
  .hero--home .hero-badge svg{ width:20px; height:20px; }
  .hero--home .swiper-dots{ bottom:12px; }
  .hero--home .swiper-slide:nth-child(1) img{ object-position:72% center; }
  .hero--home .swiper-slide:nth-child(2) img{ object-position:38% center; }
  .hero--home .swiper-slide:nth-child(3) img{ object-position:36% center; }
}

@media (max-width: 480px){
  .hero--home .container{ padding:26px 16px 48px; }
  .hero--home .hero-text{ max-width:245px; }
  .hero--home h1{ font-size:21px; }
  .hero--home .hero-badges{ gap:8px 10px; }
  .hero--home .hero-badge{ font-size:11px; }
  .hero--home .hero-badge svg{ width:18px; height:18px; }
  .hero--home .swiper-slide:nth-child(1) img{ object-position:76% center; }
  .hero--home .swiper-slide:nth-child(2) img{ object-position:32% center; }
  .hero--home .swiper-slide:nth-child(3) img{ object-position:30% center; }
}


/* labels.html reference banner — keep the existing .hero--inner dimensions. */
.labels-hero-ref{
  background:#dbe2f4;
  color:#233239;
}
.labels-hero-ref::after{ display:none; }
.labels-hero-ref .inner-hero-bg{
  background-color:#dbe2f4;
  background-size:100% 100%;
  background-position:center center;
  opacity:1;
}
.labels-hero-ref .container{
  height:100%;
  display:flex;
  align-items:center;
}
.labels-hero-ref .labels-hero-copy{
  max-width:760px;
  color:#233239;
}
.labels-hero-ref .labels-hero-title-row{
  display:flex;
  align-items:flex-end;
  gap:22px;
  white-space:nowrap;
}
.labels-hero-ref .labels-hero-title-row h1{
  margin:0;
  color:#233239;
  font-size:42px;
  line-height:1.1;
  font-weight:500;
  letter-spacing:.01em;
}
.labels-hero-ref .labels-hero-title-row span{
  color:#2f3b42;
  font-size:26px;
  line-height:1.2;
  font-weight:400;
  padding-bottom:3px;
}
.labels-hero-ref .lede{
  margin-top:16px;
  color:#28353c;
  opacity:1;
  font-size:15px;
  line-height:1.7;
}
.labels-hero-ref .lede strong{
  color:#e32127;
  font-size:24px;
  font-weight:500;
}
.labels-hero-ref .labels-hero-features{
  display:flex;
  align-items:flex-start;
  margin-top:20px;
}
.labels-hero-ref .labels-hero-feature{
  width:132px;
  min-height:88px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  color:#26343b;
  position:relative;
}
.labels-hero-ref .labels-hero-feature + .labels-hero-feature{
  border-left:1px solid rgba(38,52,59,.52);
}
.labels-hero-ref .labels-hero-feature svg{
  width:42px;
  height:42px;
  margin-bottom:7px;
  flex:0 0 42px;
}
.labels-hero-ref .labels-hero-feature strong,
.labels-hero-ref .labels-hero-feature span{
  display:block;
  color:#26343b;
  text-shadow:none;
  line-height:1.45;
}
.labels-hero-ref .labels-hero-feature strong{
  font-size:13px;
  font-weight:600;
}
.labels-hero-ref .labels-hero-feature span{
  font-size:13px;
}
@media (max-width:900px){
  .labels-hero-ref .inner-hero-bg{
    background-size:auto 100%;
    background-position:right center;
    opacity:.42;
  }
  .labels-hero-ref .labels-hero-copy{ max-width:620px; }
  .labels-hero-ref .labels-hero-title-row h1{ font-size:34px; }
  .labels-hero-ref .labels-hero-title-row span{ font-size:21px; }
  .labels-hero-ref .lede{ font-size:13px; max-width:570px; }
  .labels-hero-ref .lede strong{ font-size:20px; }
  .labels-hero-ref .labels-hero-feature{ width:112px; }
}
@media (max-width:640px){
  .labels-hero-ref .inner-hero-bg{
    background-size:auto 100%;
    opacity:.22;
    background-position:right center;
  }
  .labels-hero-ref .container{ padding:14px 18px; }
  .labels-hero-ref .labels-hero-title-row{
    display:block;
    white-space:normal;
  }
  .labels-hero-ref .labels-hero-title-row h1{ font-size:25px; }
  .labels-hero-ref .labels-hero-title-row span{
    display:block;
    margin-top:4px;
    font-size:17px;
  }
  .labels-hero-ref .lede{
    margin-top:9px;
    font-size:11.5px;
    line-height:1.5;
  }
  .labels-hero-ref .lede br{ display:none; }
  .labels-hero-ref .lede strong{ font-size:16px; }
  .labels-hero-ref .labels-hero-features{
    margin-top:10px;
    justify-content:space-between;
  }
  .labels-hero-ref .labels-hero-feature{
    width:25%;
    min-height:66px;
  }
  .labels-hero-ref .labels-hero-feature svg{
    width:28px;
    height:28px;
    flex-basis:28px;
    margin-bottom:3px;
  }
  .labels-hero-ref .labels-hero-feature strong,
  .labels-hero-ref .labels-hero-feature span{
    font-size:10px;
  }
}


/* labels material reference cards v53 */
.labels-material-section{
  padding-top:22px;
  background:#fff;
}
.labels-material-list{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.labels-material-card{
  display:grid;
  grid-template-columns:minmax(0,.94fr) minmax(0,1.56fr);
  gap:26px;
  align-items:stretch;
  min-height:246px;
  padding:14px 16px;
  border:1px solid #dedede;
  background:#fff;
}
.labels-material-card--reverse{
  grid-template-columns:minmax(0,1.56fr) minmax(0,.94fr);
}
.labels-material-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:12px 18px;
  min-width:0;
}
.labels-material-copy h3{
  margin:0 0 12px;
  color:#202020;
  font-size:19px;
  line-height:1.3;
  font-weight:800;
}
.labels-material-text p{
  margin:0 0 4px;
  color:#333;
  font-size:12.6px;
  line-height:1.56;
}
.labels-material-text p:last-child{
  margin-bottom:0;
}
.labels-material-text .labels-material-em{
  color:#f15b36;
  font-weight:600;
}
.labels-material-media{
  display:grid;
  gap:10px;
  min-width:0;
  min-height:216px;
}
.labels-material-media img{
  display:block;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  object-fit:cover;
  border-radius:8px;
}








@media (max-width:960px){
  .labels-material-card,
  .labels-material-card--reverse{
    grid-template-columns:1fr;
    gap:16px;
  }
  .labels-material-card--reverse .labels-material-copy{
    order:-1;
  }
  .labels-material-copy{
    padding:8px 8px 2px;
  }
  .labels-material-media{
    min-height:300px;
  }
}
@media (max-width:640px){
  .labels-material-section{
    padding-top:14px;
  }
  .labels-material-list{
    gap:14px;
  }
  .labels-material-card{
    min-height:0;
    padding:12px;
  }
  .labels-material-copy{
    padding:2px 2px 0;
  }
  .labels-material-copy h3{
    font-size:17px;
    margin-bottom:10px;
  }
  .labels-material-text p{
    font-size:12.5px;
    line-height:1.65;
  }
  .labels-material-media{
    min-height:0;
  }
  
  
  
  
}


/* labels material compact reference alignment v54 */
.labels-material-section{
  padding-top:14px;
}
.labels-material-list{
  gap:12px;
}
.labels-material-card{
  grid-template-columns:minmax(0,.94fr) minmax(0,1.56fr);
  gap:16px;
  min-height:164px;
  padding:9px 10px;
}
.labels-material-card--reverse{
  grid-template-columns:minmax(0,1.56fr) minmax(0,.94fr);
}
.labels-material-copy{
  padding:7px 10px;
}
.labels-material-copy h3{
  margin-bottom:8px;
  font-size:17px;
  line-height:1.2;
}
.labels-material-text p{
  margin-bottom:2px;
  font-size:11px;
  line-height:1.42;
}
.labels-material-media{
  gap:7px;
  min-height:145px;
}
.labels-material-media img{
  border-radius:10px;
  object-fit:cover;
  object-position:center;
}


@media (max-width:960px){
  .labels-material-card,
  .labels-material-card--reverse{
    gap:12px;
    min-height:0;
  }
  .labels-material-copy{
    padding:6px 6px 2px;
  }
  .labels-material-media{
    min-height:220px;
  }
}
@media (max-width:640px){
  .labels-material-list{gap:12px}
  .labels-material-card{padding:10px}
  .labels-material-copy h3{font-size:17px}
  .labels-material-text p{font-size:12.5px;line-height:1.58;margin-bottom:5px}
  .labels-material-media{min-height:0}
}


/* labels material compact height v55 */
.labels-material-section{
  padding-top:9px;
}
.labels-material-list{
  gap:8px;
}
.labels-material-card{
  gap:10px;
  min-height:108px;
  padding:5px 7px;
}
.labels-material-copy{
  padding:3px 6px;
}
.labels-material-copy h3{
  margin-bottom:4px;
  font-size:14px;
  line-height:1.15;
}
.labels-material-text p{
  margin-bottom:1px;
  font-size:9.6px;
  line-height:1.28;
}
.labels-material-media{
  gap:5px;
  min-height:96px;
}
.labels-material-media img{
  border-radius:7px;
}
@media (max-width:960px){
  .labels-material-card,
  .labels-material-card--reverse{
    gap:9px;
    min-height:0;
  }
  .labels-material-copy{
    padding:4px 5px 1px;
  }
  .labels-material-copy h3{
    font-size:15px;
    margin-bottom:5px;
  }
  .labels-material-text p{
    font-size:10.5px;
    line-height:1.35;
    margin-bottom:2px;
  }
  .labels-material-media{
    min-height:150px;
  }
}
@media (max-width:640px){
  .labels-material-section{padding-top:9px}
  .labels-material-list{gap:10px}
  .labels-material-card{padding:8px}
  .labels-material-copy h3{font-size:16px}
  .labels-material-text p{font-size:12px;line-height:1.5;margin-bottom:4px}
  .labels-material-media{min-height:0}
}


/* labels material reference-specific cards v56 */
.labels-material-section{
  padding:12px 0 4px;
  background:#f3f3f3;
}
.labels-material-list{
  gap:12px;
}

/* card 1 + 2: left text / stacked small images / large image */
.labels-material-card--copper,
.labels-material-card--pearl{
  display:grid;
  grid-template-columns:minmax(0,40%) minmax(0,60%);
  gap:14px;
  align-items:center;
  min-height:0;
  padding:10px 12px;
  background:#f3f3f3;
  border:1px solid #e1e1e1;
}
.labels-material-copy--copper,
.labels-material-copy--pearl{
  padding:4px 6px;
}
.labels-material-copy--copper h3,
.labels-material-copy--pearl h3{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.18;
  font-weight:800;
  color:#222;
}
.labels-material-copy--copper .labels-material-text p,
.labels-material-copy--pearl .labels-material-text p{
  margin:0 0 5px;
  font-size:13px;
  line-height:1.48;
  color:#333;
}
.labels-material-copy--copper .labels-material-text .labels-material-em,
.labels-material-copy--pearl .labels-material-text .labels-material-em{
  color:#e25042;
  font-weight:600;
}
.labels-material-media--copper,
.labels-material-media--pearl{
  display:grid;
  grid-template-columns:minmax(0,34%) minmax(0,66%);
  gap:10px;
  min-height:210px;
}
.labels-material-media--copper .labels-material-media-left,
.labels-material-media--pearl .labels-material-media-left{
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:10px;
}
.labels-material-media--copper .labels-material-media-right,
.labels-material-media--pearl .labels-material-media-right{
  height:100%;
}

/* card 3 + 4: large image / stacked small images / right text */
.labels-material-card--silver,
.labels-material-card--laser{
  display:grid;
  grid-template-columns:minmax(0,56%) minmax(0,44%);
  gap:14px;
  align-items:center;
  min-height:0;
  padding:10px 12px;
  background:#f3f3f3;
  border:1px solid #e1e1e1;
}
.labels-material-media--silver,
.labels-material-media--laser{
  display:grid;
  grid-template-columns:minmax(0,63%) minmax(0,37%);
  gap:10px;
  min-height:210px;
}
.labels-material-media--silver .labels-material-media-side,
.labels-material-media--laser .labels-material-media-side{
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:10px;
}
.labels-material-media--silver .labels-material-media-main,
.labels-material-media--laser .labels-material-media-main{
  height:100%;
}
.labels-material-copy--silver,
.labels-material-copy--laser{
  padding:4px 6px 4px 12px;
}
.labels-material-copy--silver h3,
.labels-material-copy--laser h3{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.18;
  font-weight:800;
  color:#222;
}
.labels-material-copy--silver .labels-material-text p,
.labels-material-copy--laser .labels-material-text p{
  margin:0 0 5px;
  font-size:13px;
  line-height:1.48;
  color:#333;
}
.labels-material-copy--silver .labels-material-text .labels-material-em,
.labels-material-copy--laser .labels-material-text .labels-material-em{
  color:#e25042;
  font-weight:600;
}

/* shared reference image treatment */
.labels-material-card--copper .labels-material-img,
.labels-material-card--pearl .labels-material-img,
.labels-material-card--silver .labels-material-img,
.labels-material-card--laser .labels-material-img{
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:14px;
  background:#eaeaea;
}
.labels-material-card--copper .labels-material-img img,
.labels-material-card--pearl .labels-material-img img,
.labels-material-card--silver .labels-material-img img,
.labels-material-card--laser .labels-material-img img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

/* desktop proportions matched to uploaded 2048x600 references */
@media (min-width:1201px){
  .labels-material-card--copper,
  .labels-material-card--pearl,
  .labels-material-card--silver,
  .labels-material-card--laser{
    aspect-ratio:2048 / 600;
  }
  .labels-material-media--copper,
  .labels-material-media--pearl,
  .labels-material-media--silver,
  .labels-material-media--laser{
    min-height:0;
    height:100%;
    max-height:100%;
  }
}

/* tablet */
@media (max-width:1200px){
  .labels-material-card--copper,
  .labels-material-card--pearl,
  .labels-material-card--silver,
  .labels-material-card--laser{
    grid-template-columns:1fr;
    aspect-ratio:auto;
    gap:12px;
  }
  .labels-material-copy--silver,
  .labels-material-copy--laser{
    order:-1;
    padding-left:6px;
  }
  .labels-material-media--copper,
  .labels-material-media--pearl,
  .labels-material-media--silver,
  .labels-material-media--laser{
    min-height:240px;
  }
}

/* mobile */
@media (max-width:640px){
  .labels-material-section{padding-top:8px}
  .labels-material-list{gap:10px}
  .labels-material-card--copper,
  .labels-material-card--pearl,
  .labels-material-card--silver,
  .labels-material-card--laser{
    padding:9px;
    gap:10px;
  }
  .labels-material-copy--copper h3,
  .labels-material-copy--pearl h3,
  .labels-material-copy--silver h3,
  .labels-material-copy--laser h3{
    font-size:18px;
    margin-bottom:8px;
  }
  .labels-material-copy--copper .labels-material-text p,
  .labels-material-copy--pearl .labels-material-text p,
  .labels-material-copy--silver .labels-material-text p,
  .labels-material-copy--laser .labels-material-text p{
    font-size:12px;
    line-height:1.55;
    margin-bottom:4px;
  }
  .labels-material-media--copper,
  .labels-material-media--pearl{
    grid-template-columns:minmax(0,34%) minmax(0,66%);
    min-height:180px;
    gap:8px;
  }
  .labels-material-media--silver,
  .labels-material-media--laser{
    grid-template-columns:minmax(0,63%) minmax(0,37%);
    min-height:180px;
    gap:8px;
  }
  .labels-material-media--copper .labels-material-media-left,
  .labels-material-media--pearl .labels-material-media-left,
  .labels-material-media--silver .labels-material-media-side,
  .labels-material-media--laser .labels-material-media-side{
    gap:8px;
  }
  .labels-material-card--copper .labels-material-img,
  .labels-material-card--pearl .labels-material-img,
  .labels-material-card--silver .labels-material-img,
  .labels-material-card--laser .labels-material-img{
    border-radius:10px;
  }
}


/* labels material image-height + text alignment v57 */
@media (min-width:1201px){
  .labels-material-card--copper,
  .labels-material-card--pearl,
  .labels-material-card--silver,
  .labels-material-card--laser{
    align-items:stretch;
    overflow:hidden;
  }

  .labels-material-copy--copper,
  .labels-material-copy--pearl,
  .labels-material-copy--silver,
  .labels-material-copy--laser{
    align-self:stretch;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:0;
    overflow:hidden;
  }

  .labels-material-media--copper,
  .labels-material-media--pearl,
  .labels-material-media--silver,
  .labels-material-media--laser{
    align-self:stretch;
    height:auto;
    min-height:0;
    max-height:none;
    overflow:hidden;
  }

  .labels-material-media--copper .labels-material-media-left,
  .labels-material-media--pearl .labels-material-media-left,
  .labels-material-media--copper .labels-material-media-right,
  .labels-material-media--pearl .labels-material-media-right,
  .labels-material-media--silver .labels-material-media-main,
  .labels-material-media--laser .labels-material-media-main,
  .labels-material-media--silver .labels-material-media-side,
  .labels-material-media--laser .labels-material-media-side{
    height:100%;
    min-height:0;
    overflow:hidden;
  }

  .labels-material-card--copper .labels-material-img,
  .labels-material-card--pearl .labels-material-img,
  .labels-material-card--silver .labels-material-img,
  .labels-material-card--laser .labels-material-img{
    min-height:0;
    height:100%;
  }

  .labels-material-card--copper .labels-material-img img,
  .labels-material-card--pearl .labels-material-img img,
  .labels-material-card--silver .labels-material-img img,
  .labels-material-card--laser .labels-material-img img{
    height:100%;
    min-height:0;
    object-fit:cover;
  }

  /* reference-like text inset */
  .labels-material-copy--copper,
  .labels-material-copy--pearl{
    padding-left:clamp(18px,2vw,34px);
    padding-right:clamp(8px,1vw,18px);
  }

  .labels-material-copy--silver,
  .labels-material-copy--laser{
    padding-left:clamp(22px,2.2vw,38px);
    padding-right:clamp(10px,1.1vw,20px);
  }

  .labels-material-copy--copper h3,
  .labels-material-copy--pearl h3,
  .labels-material-copy--silver h3,
  .labels-material-copy--laser h3{
    margin:0 0 8px;
  }

  .labels-material-copy--copper .labels-material-text p,
  .labels-material-copy--pearl .labels-material-text p,
  .labels-material-copy--silver .labels-material-text p,
  .labels-material-copy--laser .labels-material-text p{
    margin:0 0 3px;
    line-height:1.38;
  }

  .labels-gap-before{
    margin-top:6px !important;
  }

  .labels-gap-after{
    margin-bottom:6px !important;
  }

  .labels-hanging-label{
    padding-left:3.25em;
    text-indent:-3.25em;
  }

  .labels-hanging-number{
    padding-left:1.65em;
    text-indent:-1.65em;
  }
}

@media (max-width:1200px){
  .labels-hanging-label,
  .labels-hanging-number{
    padding-left:0;
    text-indent:0;
  }
  .labels-gap-before{
    margin-top:4px !important;
  }
  .labels-gap-after{
    margin-bottom:5px !important;
  }
}


/* labels material per-image reference alignment v58 */
@media (min-width:1201px){
  /* reference geometry: 35/65 for cards 1-2, 65/35 for cards 3-4 */
  .labels-material-media--copper,
  .labels-material-media--pearl{
    grid-template-columns:minmax(0,35%) minmax(0,65%);
    gap:10px;
    height:100%;
    min-height:0;
  }

  .labels-material-media--silver,
  .labels-material-media--laser{
    grid-template-columns:minmax(0,65%) minmax(0,35%);
    gap:10px;
    height:100%;
    min-height:0;
  }

  .labels-material-media--copper .labels-material-media-left,
  .labels-material-media--pearl .labels-material-media-left,
  .labels-material-media--silver .labels-material-media-side,
  .labels-material-media--laser .labels-material-media-side{
    grid-template-rows:minmax(0,1fr) minmax(0,1fr);
    gap:10px;
    height:100%;
    min-height:0;
  }

  .labels-material-media--copper .labels-material-media-right,
  .labels-material-media--pearl .labels-material-media-right,
  .labels-material-media--silver .labels-material-media-main,
  .labels-material-media--laser .labels-material-media-main{
    height:100%;
    min-height:0;
  }

  .labels-material-card--copper .labels-material-img,
  .labels-material-card--pearl .labels-material-img,
  .labels-material-card--silver .labels-material-img,
  .labels-material-card--laser .labels-material-img{
    width:100%;
    height:100%;
    min-height:0;
    overflow:hidden;
    padding:0;
  }

  .labels-material-card--copper .labels-material-img img,
  .labels-material-card--pearl .labels-material-img img,
  .labels-material-card--silver .labels-material-img img,
  .labels-material-card--laser .labels-material-img img{
    width:100%;
    height:100%;
    min-height:0;
    display:block;
    object-fit:cover;
    padding:0;
    margin:0;
  }

  /* card 1 - copper reference */
  .labels-shot-copper-top img{
    object-position:center 48%;
  }
  .labels-shot-copper-bottom img{
    object-position:center 52%;
  }
  .labels-shot-copper-main img{
    object-position:center 50%;
  }

  /* card 2 - pearl/PVC/synthetic reference */
  .labels-shot-pearl-top img{
    object-position:center 48%;
  }
  .labels-shot-pearl-bottom img{
    object-position:center 55%;
  }
  .labels-shot-pearl-main img{
    object-position:center 50%;
  }

  /* card 3 - silver reference */
  .labels-shot-silver-main img{
    object-position:center 54%;
  }
  .labels-shot-silver-top img{
    object-position:center 46%;
  }
  .labels-shot-silver-bottom img{
    object-position:center 52%;
  }

  /* card 4 - laser reference */
  .labels-shot-laser-main img{
    object-position:center 52%;
  }
  .labels-shot-laser-top img{
    object-position:center 48%;
  }
  .labels-shot-laser-bottom img{
    object-position:center 52%;
  }
}

@media (max-width:1200px){
  .labels-shot-copper-top img,
  .labels-shot-copper-bottom img,
  .labels-shot-copper-main img,
  .labels-shot-pearl-top img,
  .labels-shot-pearl-bottom img,
  .labels-shot-pearl-main img,
  .labels-shot-silver-main img,
  .labels-shot-silver-top img,
  .labels-shot-silver-bottom img,
  .labels-shot-laser-main img,
  .labels-shot-laser-top img,
  .labels-shot-laser-bottom img{
    object-fit:cover;
    object-position:center;
    padding:0;
  }
}


/* labels temperature-resistance image section v59 */
.labels-temperature-section{
  padding:12px 0;
  background:#fff;
}
.labels-temperature-visual{
  width:100%;
  overflow:hidden;
}
.labels-temperature-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 1;
  object-fit:contain;
}
@media (max-width:768px){
  .labels-temperature-section{
    padding:8px 0;
  }
  .labels-temperature-visual img{
    width:100%;
    height:auto;
    aspect-ratio:auto;
  }
}


/* labels craft framed rows exact-reference v60 */
.labels-craft-section .craft-desc{
  position:relative;
  width:100%;
  min-height:90px;
  margin:0 0 36px;
  padding:23px 42px 15px;
  border:1px solid #a9a9a9;
  border-radius:20px;
  background:#fff;
  text-align:center;
  box-shadow:none;
}

.labels-craft-section .craft-desc:last-child{
  margin-bottom:0;
}

.labels-craft-section .craft-desc h4{
  position:absolute;
  top:0;
  left:50%;
  transform:translate(-50%,-50%);
  z-index:2;
  min-width:160px;
  margin:0;
  padding:0 28px;
  background:#fff;
  color:#333;
  font-size:20px;
  font-weight:400;
  line-height:1.2;
  letter-spacing:0;
  white-space:nowrap;
}

.labels-craft-section .craft-desc h4::before,
.labels-craft-section .craft-desc h4::after{
  content:"";
  position:absolute;
  top:50%;
  width:1px;
  height:18px;
  background:#8f8f8f;
  transform:translateY(-50%);
}

.labels-craft-section .craft-desc h4::before{
  left:0;
}

.labels-craft-section .craft-desc h4::after{
  right:0;
}

.labels-craft-section .craft-desc p{
  margin:0;
  color:#555;
  font-size:16px;
  font-weight:400;
  line-height:1.62;
  text-align:center;
}

@media (max-width:768px){
  .labels-craft-section .craft-desc{
    min-height:0;
    margin-bottom:30px;
    padding:24px 18px 16px;
    border-radius:16px;
  }

  .labels-craft-section .craft-desc h4{
    min-width:132px;
    padding:0 20px;
    font-size:18px;
  }

  .labels-craft-section .craft-desc h4::before,
  .labels-craft-section .craft-desc h4::after{
    height:16px;
  }

  .labels-craft-section .craft-desc p{
    font-size:14px;
    line-height:1.72;
  }
}


/* labels printing standalone swiper section v61 */
.labels-print-section{
  background:#fff;
}

.labels-print-section .container{
  max-width:1200px;
}





.labels-print-layout{
  display:grid;
  grid-template-columns:minmax(0,340px) minmax(0,1fr);
  gap:34px;
  align-items:center;
}

.labels-print-copy{
  padding:8px 0;
}

.labels-print-copy h3{
  margin:0 0 14px;
  color:var(--ink);
  font-size:24px;
  line-height:1.35;
  font-weight:700;
}

.labels-print-copy p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.9;
}

.labels-print-swiper{
  position:relative;
  min-width:0;
  padding-bottom:28px;
}

.labels-print-swiper .swiper-viewport{
  overflow:hidden;
  border-radius:4px;
  background:#f5f5f5;
}

.labels-print-swiper .swiper-track{
  align-items:stretch;
}

.labels-print-swiper .swiper-slide{
  flex:0 0 100%;
  aspect-ratio:16 / 7;
  overflow:hidden;
}

.labels-print-swiper .swiper-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.labels-print-swiper .swiper-arrow{
  width:36px;
  height:36px;
  margin-top:-30px;
}

.labels-print-swiper .swiper-dots{
  bottom:4px;
}

.labels-print-swiper .swiper-dot{
  background:#c6ccd5;
  box-shadow:none;
}

.labels-print-swiper .swiper-dot.active{
  background:var(--blue);
}

@media (max-width:900px){
  .labels-print-layout{
    grid-template-columns:1fr;
    gap:20px;
  }

  .labels-print-copy{
    text-align:center;
  }

  .labels-print-copy h3{
    font-size:21px;
  }

  .labels-print-swiper .swiper-slide{
    aspect-ratio:16 / 9;
  }
}

@media (max-width:640px){
  

  .labels-print-copy p{
    font-size:13px;
    line-height:1.75;
  }

  .labels-print-copy h3{
    font-size:19px;
  }

  .labels-print-swiper{
    padding-bottom:24px;
  }

  .labels-print-swiper .swiper-arrow{
    width:32px;
    height:32px;
    margin-top:-28px;
  }
}


/* labels printing uploaded background v62 */
.labels-print-section{
  position:relative;
  overflow:hidden;
  background:#111b27 url("../img/labels-print-bg.webp?v=1") center center / cover no-repeat;
}

.labels-print-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:rgba(7,14,22,.18);
  pointer-events:none;
}

.labels-print-section > .container{
  position:relative;
  z-index:1;
}

.labels-print-section .labels-print-copy h3{
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.32);
}

.labels-print-section .labels-print-copy p{
  color:rgba(255,255,255,.9);
  text-shadow:0 1px 5px rgba(0,0,0,.28);
}

.labels-print-section .section-head .dash{
  background:#fff;
}

@media (min-width:901px){
  .labels-print-section.section--tight{
    padding:64px 0;
  }
}

@media (max-width:900px){
  .labels-print-section{
    background-position:42% center;
  }
}


/* labels printing compact reference layout v63 */
.labels-print-section.section--tight{
  min-height:360px;
  padding:38px 0 34px;
}

.labels-print-section .container{
  max-width:1280px;
}

.labels-print-layout{
  grid-template-columns:300px minmax(0,1fr);
  gap:32px;
  align-items:center;
}

.labels-print-copy{
  padding:0;
}

.labels-print-copy h2{
  margin:0 0 22px;
  color:#fff;
  font-size:34px;
  line-height:1.15;
  font-weight:400;
  letter-spacing:.01em;
  text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.labels-print-points{
  margin:0;
  padding-left:1.5em;
  color:rgba(255,255,255,.94);
  font-size:14px;
  line-height:1.72;
  text-shadow:0 1px 5px rgba(0,0,0,.3);
}

.labels-print-points li{
  margin:0 0 4px;
}





.labels-print-swiper{
  padding:0 0 20px;
}

.labels-print-swiper .swiper-viewport{
  background:transparent;
  border-radius:0;
}

.labels-print-swiper .swiper-slide{
  box-sizing:border-box;
  aspect-ratio:auto;
  min-height:0;
  padding:0 9px;
  overflow:visible;
  background:transparent;
}

.labels-print-swiper .swiper-slide img{
  display:block;
  width:100%;
  height:200px;
  object-fit:cover;
  object-position:center;
  border:7px solid #fff;
  border-bottom:0;
  background:#fff;
}

.labels-print-swiper .swiper-slide::after{
  content:attr(data-caption);
  display:none;
}

.labels-print-swiper .swiper-slide{
  background:#fff;
  border:1px solid rgba(255,255,255,.95);
}

.labels-print-swiper .swiper-slide img + *{
  display:none;
}

.labels-print-swiper .swiper-slide img{
  border:6px solid #fff;
  border-bottom-width:0;
}

.labels-print-swiper .swiper-slide{
  padding:0;
  margin:0 9px;
}

.labels-print-swiper .swiper-slide img[alt]{
  margin:0;
}

.labels-print-swiper .swiper-slide{
  position:relative;
}

.labels-print-swiper .swiper-slide::before{
  content:attr(aria-label);
  display:none;
}

.labels-print-swiper .swiper-arrow{
  display:none;
}

.labels-print-swiper .swiper-dots{
  bottom:0;
}

.labels-print-swiper .swiper-dot{
  width:7px;
  height:7px;
  background:rgba(255,255,255,.48);
}

.labels-print-swiper .swiper-dot.active{
  background:#fff;
}

@media (max-width:900px){
  .labels-print-section.section--tight{
    min-height:0;
    padding:42px 0 36px;
  }

  .labels-print-layout{
    grid-template-columns:1fr;
    gap:24px;
  }

  .labels-print-copy{
    text-align:left;
  }

  .labels-print-copy h2{
    font-size:30px;
    margin-bottom:16px;
  }

  .labels-print-swiper .swiper-slide img{
    height:220px;
  }
}

@media (max-width:640px){
  .labels-print-section.section--tight{
    padding:34px 0 30px;
  }

  .labels-print-copy h2{
    font-size:26px;
  }

  .labels-print-points{
    font-size:13px;
    line-height:1.65;
  }

  

  .labels-print-swiper .swiper-slide img{
    height:210px;
  }
}

.labels-print-caption{
  padding:12px 8px 13px;
  background:#fff;
  color:#222;
  font-size:18px;
  line-height:1.2;
  text-align:center;
}


/* labels printing compact reference layout v64 */
@media (min-width:901px){
  .labels-print-section.section--tight{
    height:360px;
    min-height:360px;
    padding:34px 0 30px;
  }

  .labels-print-section .container,
  .labels-print-swiper,
  .labels-print-layout{
    height:100%;
  }

  .labels-print-layout{
    display:grid;
    grid-template-columns:300px minmax(0,1fr);
    gap:30px;
    align-items:center;
  }

  .labels-print-copy{
    align-self:center;
  }

  .labels-print-copy h2{
    margin:0 0 18px;
    font-size:33px;
    line-height:1.15;
  }

  .labels-print-points{
    font-size:13px;
    line-height:1.68;
  }

  .labels-print-points li{
    margin-bottom:3px;
  }

  .labels-print-nav{
    display:flex;
    gap:18px;
    margin-top:14px;
  }

  .labels-print-nav .swiper-arrow{
    position:static;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    margin:0;
    transform:none;
    border:1px solid rgba(255,255,255,.82);
    border-radius:50%;
    background:transparent;
    color:#fff;
  }

  .labels-print-nav .swiper-arrow span{
    line-height:1;
    font-size:23px;
    font-weight:300;
  }

  .labels-print-nav .swiper-arrow:disabled{
    opacity:.45;
  }

  .labels-print-swiper{
    padding:0;
  }

  .labels-print-swiper .swiper-viewport{
    min-width:0;
    overflow:hidden;
    background:transparent;
  }

  .labels-print-swiper .swiper-track{
    gap:18px;
    align-items:stretch;
  }

  .labels-print-swiper .swiper-slide{
    margin:0;
    padding:0;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(255,255,255,.95);
  }

  .labels-print-swiper .swiper-slide img{
    display:block;
    width:100%;
    height:205px;
    margin:0;
    border:6px solid #fff;
    border-bottom:0;
    object-fit:cover;
    object-position:center;
  }

  .labels-print-swiper .swiper-slide img + .labels-print-caption{
    display:block;
  }

  .labels-print-caption{
    padding:11px 8px 12px;
    font-size:17px;
    line-height:1.2;
  }

  .labels-print-swiper > .swiper-dots{
    display:none;
  }
}

@media (max-width:900px){
  .labels-print-nav{
    display:flex;
    justify-content:flex-start;
    gap:14px;
    margin-top:14px;
  }

  .labels-print-nav .swiper-arrow{
    position:static;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    margin:0;
    transform:none;
  }

  .labels-print-swiper .swiper-track{
    gap:16px;
  }

  .labels-print-swiper .swiper-slide{
    margin:0;
  }

  .labels-print-swiper .swiper-slide img + .labels-print-caption{
    display:block;
  }

  .labels-print-swiper > .swiper-dots{
    position:static;
    margin-top:14px;
  }
}


/* labels service flow + guarantees reference layout v65 */
.labels-service-section{
  padding:42px 0 58px;
  background:#fff;
}

.labels-service-section .container{
  max-width:1080px;
}

.labels-service-head{
  margin:0 0 42px;
  text-align:center;
}

.labels-service-head h2{
  margin:0;
  color:#262626;
  font-size:28px;
  line-height:1.2;
  font-weight:400;
  letter-spacing:.02em;
}

.labels-service-flow{
  display:grid;
  grid-template-columns:repeat(5,146px);
  justify-content:space-between;
  align-items:center;
  gap:0;
  max-width:100%;
  margin:0 auto;
}

.labels-service-flow .flow-node{
  width:146px;
  height:146px;
  min-height:0;
  aspect-ratio:auto;
  padding:14px;
  border-radius:50%;
  background:#deddf0;
  box-shadow:none;
  color:#1e1e1e;
}

.labels-service-flow .flow-node span,
.labels-service-flow .flow-node small{
  display:block;
  margin:0;
  color:#1e1e1e;
  font-size:22px;
  line-height:1.5;
  font-weight:400;
}

.labels-service-flow .flow-node:not(:last-child)::before{
  content:"";
  position:absolute;
  left:calc(100% + 12px);
  top:50%;
  width:25px;
  height:18px;
  transform:translateY(-50%);
  border:0;
  background:repeating-linear-gradient(
    90deg,
    #252525 0 2px,
    transparent 2px 5px
  );
}

.labels-service-flow .flow-node:not(:last-child)::after{
  content:"";
  position:absolute;
  left:calc(100% + 37px);
  top:50%;
  width:0;
  height:0;
  transform:translateY(-50%);
  background:none;
  border-top:9px solid transparent;
  border-bottom:9px solid transparent;
  border-left:14px solid #252525;
}

.labels-guarantee-head{
  margin-top:42px;
  margin-bottom:50px;
}

.labels-guarantee-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  width:100%;
}

.labels-guarantee-card{
  position:relative;
  min-height:248px;
  padding:70px 18px 24px;
  background:#deddf0;
  text-align:center;
}

.labels-guarantee-icon{
  position:absolute;
  top:-30px;
  left:50%;
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  transform:translateX(-50%);
  border:2px solid #fff;
  border-radius:50%;
  background:#8062a5;
  color:#fff;
  box-shadow:0 0 0 1px rgba(128,98,165,.08);
}

.labels-guarantee-icon svg{
  width:38px;
  height:38px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.labels-guarantee-icon b{
  position:absolute;
  right:7px;
  bottom:5px;
  font-size:10px;
  line-height:1;
  font-weight:500;
}

.labels-guarantee-icon--text{
  font-size:38px;
  font-weight:300;
  line-height:1;
}

.labels-guarantee-card h4{
  margin:0 0 26px;
  color:#1f1f1f;
  font-size:34px;
  line-height:1.15;
  font-weight:400;
  letter-spacing:.08em;
}

.labels-guarantee-card p{
  margin:0;
  color:#222;
  font-size:21px;
  line-height:1.55;
  font-weight:400;
}

@media (max-width:1100px){
  .labels-service-section .container{
    max-width:960px;
  }

  .labels-service-flow{
    grid-template-columns:repeat(5,132px);
  }

  .labels-service-flow .flow-node{
    width:132px;
    height:132px;
  }

  .labels-service-flow .flow-node span,
  .labels-service-flow .flow-node small{
    font-size:19px;
  }

  .labels-service-flow .flow-node:not(:last-child)::before{
    left:calc(100% + 8px);
    width:18px;
  }

  .labels-service-flow .flow-node:not(:last-child)::after{
    left:calc(100% + 25px);
  }

  .labels-guarantee-card{
    min-height:228px;
    padding-left:12px;
    padding-right:12px;
  }

  .labels-guarantee-card h4{
    font-size:30px;
  }

  .labels-guarantee-card p{
    font-size:18px;
  }
}

@media (max-width:760px){
  .labels-service-section{
    padding:36px 0 46px;
  }

  .labels-service-head{
    margin-bottom:28px;
  }

  .labels-service-head h2{
    font-size:25px;
  }

  .labels-service-flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
  }

  .labels-service-flow .flow-node{
    width:100%;
    height:auto;
    min-height:132px;
    border-radius:66px;
  }

  .labels-service-flow .flow-node span,
  .labels-service-flow .flow-node small{
    font-size:18px;
  }

  .labels-service-flow .flow-node::before,
  .labels-service-flow .flow-node::after{
    display:none;
  }

  .labels-guarantee-head{
    margin-top:36px;
    margin-bottom:44px;
  }

  .labels-guarantee-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:46px 16px;
  }

  .labels-guarantee-card{
    min-height:210px;
    padding-top:60px;
  }

  .labels-guarantee-card h4{
    margin-bottom:18px;
    font-size:28px;
  }

  .labels-guarantee-card p{
    font-size:17px;
  }
}

@media (max-width:480px){
  .labels-service-flow{
    grid-template-columns:1fr;
  }

  .labels-service-flow .flow-node{
    min-height:110px;
  }

  .labels-guarantee-grid{
    grid-template-columns:1fr;
  }

  .labels-guarantee-card{
    min-height:190px;
  }
}


/* labels professional team reference layout v66 */
.labels-team-section{
  padding:28px 0 48px;
  background:#fff;
}

.labels-team-section .container{
  max-width:1200px;
}

.labels-team-head{
  margin:0 0 24px;
  text-align:center;
}

.labels-team-head h2{
  margin:0;
  color:#222;
  font-size:28px;
  line-height:1.2;
  font-weight:400;
  letter-spacing:.02em;
}

.labels-team-gallery{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  width:100%;
}

.labels-team-photo{
  aspect-ratio:1.12 / 1;
  overflow:hidden;
  padding:5px;
  border:1px solid #a7a7a7;
  background:#fff;
}

.labels-team-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.labels-team-benefits{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:72px;
  row-gap:70px;
  max-width:1080px;
  margin:72px auto 0;
}

.labels-team-benefit{
  min-width:0;
  text-align:center;
}

.labels-team-shield{
  width:64px;
  height:72px;
  margin:0 auto 14px;
  color:#111;
}

.labels-team-shield svg{
  display:block;
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.labels-team-shield .shield{
  stroke-width:3.1;
}

.labels-team-shield .bar{
  stroke-width:4;
}

.labels-team-shield .bar-a{ stroke:#e91e63; }
.labels-team-shield .bar-b{ stroke:#00bcd4; }
.labels-team-shield .bar-c{ stroke:#9c27b0; }

.labels-team-benefit h4{
  margin:0;
  color:#333;
  font-size:25px;
  line-height:1.3;
  font-weight:400;
  letter-spacing:.02em;
}

.labels-team-benefit p{
  margin:7px 0 0;
  color:#555;
  font-size:12px;
  line-height:1.45;
  font-weight:400;
  letter-spacing:.075em;
  text-transform:uppercase;
  white-space:nowrap;
}

@media (max-width:980px){
  .labels-team-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
  }

  .labels-team-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:36px;
    row-gap:54px;
    margin-top:54px;
  }

  .labels-team-benefit h4{
    font-size:22px;
  }

  .labels-team-benefit p{
    white-space:normal;
  }
}

@media (max-width:560px){
  .labels-team-section{
    padding:34px 0 42px;
  }

  .labels-team-head{
    margin-bottom:20px;
  }

  .labels-team-head h2{
    font-size:25px;
  }

  .labels-team-gallery{
    grid-template-columns:1fr;
    gap:14px;
  }

  .labels-team-photo{
    aspect-ratio:1.28 / 1;
  }

  .labels-team-benefits{
    grid-template-columns:1fr;
    gap:42px;
    margin-top:46px;
  }

  .labels-team-benefit h4{
    font-size:21px;
  }

  .labels-team-benefit p{
    font-size:11px;
  }
}


/* bags application case card footer alignment v50 */
.app-section .grid.grid-3{
  align-items:stretch;
}

.app-section .case-card{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
}

.app-section .case-card .ph{
  flex:0 0 auto;
}

.app-section .case-card .body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
}

.app-section .case-card .body p{
  flex:1 1 auto;
  margin-bottom:0;
}

.app-section .case-card .foot{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  min-height:56px;
  margin-top:auto;
}

.app-section .case-card .foot span{
  flex:1 1 auto;
  min-width:0;
}

.app-section .case-card .foot a{
  flex:0 0 auto;
  white-space:nowrap;
}


/* boxes high quality packaging reference layout v67 */
.boxes-quality-section{
  padding:22px 0 28px;
  background:#fff;
}

.boxes-quality-section .container{
  max-width:1200px;
}

.boxes-quality-title{
  margin:0 0 36px;
  color:#282323;
  font-size:38px;
  line-height:1.3;
  font-weight:500;
  letter-spacing:.035em;
  text-align:center;
}

.boxes-quality-row{
  display:grid;
  grid-template-columns:42% 58%;
  width:100%;
  overflow:hidden;
  border:1px solid #d4d4d4;
  background:#fff;
}

.boxes-quality-row + .boxes-quality-row{
  margin-top:28px;
}

.boxes-quality-row--bottom{
  grid-template-columns:58% 42%;
}

.boxes-quality-media{
  min-width:0;
  aspect-ratio:1195 / 656;
  overflow:hidden;
  background:#f6f6f6;
}

.boxes-quality-row--bottom .boxes-quality-media{
  aspect-ratio:1191 / 656;
}

.boxes-quality-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.boxes-quality-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  justify-content:center;
  padding:28px 38px;
  color:#222;
}

.boxes-quality-copy h3{
  margin:0 0 14px;
  color:#242020;
  font-size:26px;
  line-height:1.28;
  font-weight:500;
}

.boxes-quality-copy > p{
  margin:0;
  color:#272727;
  font-size:14px;
  line-height:1.8;
  text-align:left;
}

.boxes-quality-points{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.boxes-quality-points p{
  display:flex;
  margin:0;
  color:#222;
  font-size:14px;
  line-height:1.8;
}

.boxes-quality-points p span{
  flex:0 0 auto;
}

@media (max-width:900px){
  .boxes-quality-title{
    margin-bottom:24px;
    font-size:30px;
  }

  .boxes-quality-row,
  .boxes-quality-row--bottom{
    grid-template-columns:1fr;
  }

  .boxes-quality-copy{
    padding:24px 22px;
  }

  .boxes-quality-row--bottom .boxes-quality-copy{
    order:1;
  }

  .boxes-quality-row--bottom .boxes-quality-media{
    order:2;
  }
}

@media (max-width:560px){
  .boxes-quality-section{
    padding:18px 0 24px;
  }

  .boxes-quality-title{
    margin-bottom:20px;
    font-size:24px;
    line-height:1.45;
  }

  .boxes-quality-row + .boxes-quality-row{
    margin-top:18px;
  }

  .boxes-quality-copy{
    padding:20px 16px;
  }

  .boxes-quality-copy h3{
    margin-bottom:12px;
    font-size:21px;
  }

  .boxes-quality-copy > p,
  .boxes-quality-points p{
    font-size:14px;
    line-height:1.75;
  }
}


/* boxes quality promise reference layout v68 */
.boxes-promise-section{
  padding:18px 0 54px;
  background:#fff;
}

.boxes-promise-section .container{
  max-width:1200px;
}

.boxes-promise-head{
  text-align:center;
}

.boxes-promise-head h2{
  margin:0;
  color:#1f1b1b;
  font-size:26px;
  line-height:1.35;
  font-weight:400;
  letter-spacing:.02em;
}

.boxes-promise-main{
  margin:34px 0 4px;
  color:#211d1d;
  font-size:32px;
  line-height:1.3;
  font-weight:400;
  letter-spacing:.02em;
}

.boxes-promise-sub{
  margin:0 0 20px;
  color:#292424;
  font-size:21px;
  line-height:1.4;
  font-weight:400;
}

.boxes-promise-panel{
  position:relative;
  min-height:174px;
  padding:28px 24px 34px;
  background:#edf0fa;
  text-align:center;
}

.boxes-promise-panel h3{
  margin:0 0 8px;
  color:#282323;
  font-size:38px;
  line-height:1.25;
  font-weight:400;
  letter-spacing:.02em;
}

.boxes-promise-panel p{
  margin:0;
  color:#2a2525;
  font-size:20px;
  line-height:1.45;
  font-weight:400;
}

.boxes-promise-badge{
  position:absolute;
  left:50%;
  bottom:-36px;
  width:78px;
  height:58px;
  transform:translateX(-50%);
  color:#7f68aa;
  text-align:center;
}

.boxes-promise-badge-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin:0 auto;
  border:2px solid #fff;
  border-radius:50%;
  background:#846bb1;
  color:#fff;
  box-shadow:0 0 0 1px rgba(132,107,177,.28);
}

.boxes-promise-badge-icon svg{
  width:31px;
  height:31px;
}

.boxes-promise-badge-icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:50%;
}

.boxes-promise-badge span{
  display:block;
  margin-top:-1px;
  font-size:7px;
  line-height:1;
  letter-spacing:.08em;
  white-space:nowrap;
}

@media (max-width:900px){
  .boxes-promise-main{
    margin-top:28px;
    font-size:27px;
  }

  .boxes-promise-sub{
    font-size:18px;
  }

  .boxes-promise-panel h3{
    font-size:32px;
  }

  .boxes-promise-panel p{
    font-size:18px;
  }
}

@media (max-width:560px){
  .boxes-promise-section{
    padding:16px 0 48px;
  }

  .boxes-promise-head h2{
    font-size:23px;
  }

  .boxes-promise-main{
    margin-top:24px;
    font-size:23px;
    line-height:1.45;
  }

  .boxes-promise-sub{
    margin-bottom:16px;
    font-size:16px;
  }

  .boxes-promise-panel{
    min-height:160px;
    padding:26px 14px 34px;
  }

  .boxes-promise-panel h3{
    font-size:27px;
  }

  .boxes-promise-panel p{
    font-size:15px;
    line-height:1.55;
  }
}


/* boxes detail + one-stop reference layout v69 */
.boxes-detail-section{
  padding:28px 0 56px;
  background:#fff;
}

.boxes-detail-section .container{
  max-width:1160px;
}

.boxes-detail-head{
  margin-bottom:28px;
}

.boxes-detail-grid--reference{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:26px 26px;
  max-width:1070px;
  margin:0 auto;
}

.boxes-detail-grid--reference .boxes-detail-card{
  display:grid;
  grid-template-columns:60% 40%;
  min-height:218px;
  overflow:hidden;
  border:1px solid #8f8f8f;
  border-radius:28px;
  background:#fff;
  box-shadow:none;
}

.boxes-detail-grid--reference .boxes-detail-card.rev{
  grid-template-columns:40% 60%;
}

.boxes-detail-grid--reference .boxes-detail-card.rev .ph{
  order:2;
}

.boxes-detail-grid--reference .boxes-detail-card.rev .txt{
  order:1;
}

.boxes-detail-grid--reference .boxes-detail-card .ph{
  min-height:218px;
  overflow:hidden;
  background:#f6f6f6;
}

.boxes-detail-grid--reference .boxes-detail-card .ph img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.boxes-detail-grid--reference .boxes-detail-card .txt{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 24px;
  color:#171717;
  text-align:left;
}

.boxes-detail-grid--reference .boxes-detail-card .tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:flex-start;
  min-height:26px;
  padding:2px 12px 3px;
  border:1px solid #777;
  border-radius:999px;
  background:#fff;
  color:#111;
  font-size:16px;
  line-height:1;
  font-weight:400;
  white-space:nowrap;
}

.boxes-detail-grid--reference .boxes-detail-card h3{
  margin:10px 0 0;
  color:#111;
  font-size:28px;
  line-height:1.18;
  font-weight:500;
  letter-spacing:.01em;
}

.boxes-detail-grid--reference .boxes-detail-card b{
  margin:8px 0 0;
  color:#111;
  font-size:20px;
  line-height:1;
  font-weight:400;
}

.boxes-detail-grid--reference .boxes-detail-card p{
  margin:10px 0 0;
  color:#222;
  font-size:15px;
  line-height:1.45;
  font-weight:400;
}

.boxes-detail-cta{
  position:relative;
  max-width:1086px;
  min-height:190px;
  margin:44px auto 0;
  padding:24px 30px 44px;
  background:#edf0fa;
  text-align:center;
}

.boxes-detail-cta h3{
  margin:0 0 10px;
  color:#282323;
  font-size:40px;
  line-height:1.22;
  font-weight:400;
  letter-spacing:.02em;
}

.boxes-detail-cta p{
  margin:0;
  color:#292424;
  font-size:20px;
  line-height:1.45;
  font-weight:400;
}

.boxes-detail-cta-badge{
  position:absolute;
  left:50%;
  bottom:-38px;
  width:80px;
  transform:translateX(-50%);
  color:#7f68aa;
  text-align:center;
}

.boxes-detail-cta-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin:0 auto;
  border:2px solid #fff;
  border-radius:50%;
  background:#846bb1;
  color:#fff;
  box-shadow:0 0 0 1px rgba(132,107,177,.28);
}

.boxes-detail-cta-icon svg{
  width:31px;
  height:31px;
}

.boxes-detail-cta-badge span{
  display:block;
  margin-top:-1px;
  font-size:7px;
  line-height:1;
  letter-spacing:.08em;
  white-space:nowrap;
}

@media (max-width:980px){
  .boxes-detail-grid--reference{
    max-width:720px;
    grid-template-columns:1fr;
  }

  .boxes-detail-cta h3{
    font-size:32px;
  }

  .boxes-detail-cta p{
    font-size:17px;
  }
}

@media (max-width:560px){
  .boxes-detail-section{
    padding:22px 0 50px;
  }

  .boxes-detail-grid--reference .boxes-detail-card,
  .boxes-detail-grid--reference .boxes-detail-card.rev{
    grid-template-columns:1fr;
    min-height:0;
    border-radius:20px;
  }

  .boxes-detail-grid--reference .boxes-detail-card.rev .ph,
  .boxes-detail-grid--reference .boxes-detail-card.rev .txt{
    order:initial;
  }

  .boxes-detail-grid--reference .boxes-detail-card .ph{
    min-height:210px;
  }

  .boxes-detail-grid--reference .boxes-detail-card .txt{
    padding:18px 20px 22px;
  }

  .boxes-detail-grid--reference .boxes-detail-card h3{
    font-size:24px;
  }

  .boxes-detail-cta{
    min-height:170px;
    margin-top:28px;
    padding:24px 16px 42px;
  }

  .boxes-detail-cta h3{
    font-size:27px;
  }

  .boxes-detail-cta p{
    font-size:15px;
    line-height:1.55;
  }
}


/* bags bottom benefits reference layout v70 */
.bags-benefits-section{
  padding:38px 0 62px;
  background:#fff;
}

.bags-benefits-section .container{
  max-width:1240px;
}

.bags-benefits-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:96px;
  row-gap:72px;
  align-items:start;
}

.bags-benefit-item{
  min-width:0;
  text-align:center;
}

.bags-benefit-shield{
  width:72px;
  height:80px;
  margin:0 auto 18px;
  color:#2c2425;
}

.bags-benefit-shield svg{
  display:block;
  width:100%;
  height:100%;
}

.bags-benefit-shield .shield{
  fill:none;
  stroke:currentColor;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.bags-benefit-item h4{
  margin:0;
  color:#4b4646;
  font-size:30px;
  line-height:1.26;
  font-weight:400;
  letter-spacing:.01em;
}

.bags-benefit-item p{
  margin:10px 0 0;
  color:#3f3b3b;
  font-size:12px;
  line-height:1.35;
  font-weight:400;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
}

@media (max-width:1100px){
  .bags-benefits-grid{
    column-gap:44px;
    row-gap:58px;
  }

  .bags-benefit-item h4{
    font-size:26px;
  }

  .bags-benefit-item p{
    white-space:normal;
  }
}

@media (max-width:760px){
  .bags-benefits-section{
    padding:34px 0 48px;
  }

  .bags-benefits-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:46px 24px;
  }

  .bags-benefit-item h4{
    font-size:22px;
  }

  .bags-benefit-item p{
    font-size:11px;
  }
}

@media (max-width:480px){
  .bags-benefits-grid{
    grid-template-columns:1fr;
    gap:38px;
  }

  .bags-benefit-shield{
    width:66px;
    height:74px;
    margin-bottom:14px;
  }

  .bags-benefit-item h4{
    font-size:21px;
  }
}


/* about uploaded banner reference v72 */
.about-upload-hero{
  position:relative;
  width:100%;
  aspect-ratio:2047 / 480;
  min-height:0;
  padding:0;
  overflow:hidden;
  background:#ffed00;
}

.about-upload-hero-bg{
  position:absolute;
  inset:0;
  background-color:#ffed00;
  background-position:center center;
  background-size:100% 100%;
  background-repeat:no-repeat;
}

@media (max-width:760px){
  .about-upload-hero{
    aspect-ratio:2047 / 480;
  }
}


/* about corporate culture structured section v74 */
.about-culture-section{
  position:relative;
  min-height:432px;
  overflow:hidden;
  background:
    #273f68
    url("../img/cta-handshake-bg.png")
    center center / cover no-repeat;
}

.about-culture-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(14,39,75,.36),rgba(35,64,103,.15) 50%,rgba(245,249,255,.08));
  pointer-events:none;
}

.about-culture-inner{
  position:relative;
  z-index:1;
  max-width:820px;
  padding-top:40px;
  padding-bottom:48px;
}

.about-culture-heading{
  margin:0 0 64px;
  text-align:center;
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}

.about-culture-heading span{
  display:block;
  margin-bottom:10px;
  font-size:12px;
  line-height:1;
  font-weight:400;
  letter-spacing:.08em;
}

.about-culture-heading h2{
  margin:0;
  font-size:31px;
  line-height:1.2;
  font-weight:400;
  letter-spacing:.02em;
}

.about-culture-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}

.about-culture-card{
  min-height:220px;
  padding:31px 18px 24px;
  border:1px solid rgba(30,47,69,.62);
  border-radius:6px;
  background:rgba(255,255,255,.78);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  text-align:center;
  color:#161616;
}

.about-culture-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  margin:0 auto 18px;
  border-radius:50%;
  background:rgba(255,255,255,.96);
  box-shadow:0 1px 3px rgba(0,0,0,.06);
}

.about-culture-icon img{
  display:block;
  width:34px;
  height:34px;
  object-fit:contain;
}

.about-culture-card h3{
  margin:0 0 15px;
  font-size:16px;
  line-height:1.35;
  font-weight:400;
}

.about-culture-card p{
  margin:0 0 7px;
  font-size:11px;
  line-height:1.45;
  font-weight:400;
  white-space:nowrap;
}

.about-culture-card p:last-child{
  margin-bottom:0;
}

@media (max-width:900px){
  .about-culture-section{
    min-height:auto;
  }

  .about-culture-inner{
    max-width:760px;
    padding-top:34px;
    padding-bottom:40px;
  }

  .about-culture-heading{
    margin-bottom:38px;
  }

  .about-culture-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
  }

  .about-culture-card{
    min-height:200px;
  }
}

@media (max-width:560px){
  .about-culture-section{
    background-position:center center;
  }

  .about-culture-inner{
    padding-top:30px;
    padding-bottom:32px;
  }

  .about-culture-heading{
    margin-bottom:26px;
  }

  .about-culture-heading h2{
    font-size:27px;
  }

  .about-culture-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .about-culture-card{
    min-height:0;
    padding:24px 18px 22px;
  }

  .about-culture-card p{
    white-space:normal;
  }
}


/* news generated text-free banner v76 */
.news-generated-hero{
  height:auto;
  min-height:0;
  aspect-ratio:2047 / 480;
  background:#f68b16;
}
.news-generated-hero::after{
  background:linear-gradient(90deg,rgba(244,133,22,.10) 0%,rgba(244,133,22,.06) 40%,rgba(0,0,0,.03) 100%);
}
.news-generated-hero .news-generated-hero-bg{
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.news-generated-hero .hero-text{
  max-width:620px;
}
@media (max-width:640px){
  .news-generated-hero{
    aspect-ratio:auto;
    height:320px;
    min-height:320px;
  }
  .news-generated-hero .news-generated-hero-bg{
    background-position:center center;
  }
}


/* contact generated text-free banner v78 */
.contact-generated-hero{
  height:auto;
  min-height:0;
  aspect-ratio:2047 / 480;
  background:#f7c341;
  color:#2f2f2f;
}
.contact-generated-hero::after{
  background:linear-gradient(90deg,rgba(250,195,63,.06) 0%,rgba(250,195,63,.03) 40%,rgba(255,255,255,0) 68%);
}
.contact-generated-hero .contact-generated-hero-bg{
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.contact-generated-hero h1,
.contact-generated-hero .lede{
  color:#343434;
  text-shadow:none;
}
.contact-generated-hero .lede{
  opacity:1;
}
.contact-generated-hero .hero-cta{
  background:transparent;
  color:#444;
  border:2px solid rgba(60,60,60,.85);
  box-shadow:0 3px 0 rgba(60,60,60,.55);
}
.contact-generated-hero .hero-cta:hover{
  box-shadow:0 4px 0 rgba(60,60,60,.55);
}
@media (max-width:640px){
  .contact-generated-hero{
    aspect-ratio:auto;
    height:320px;
    min-height:320px;
  }
  .contact-generated-hero .contact-generated-hero-bg{
    background-position:center center;
  }
}


/* contact thanks structured section v80 */
.contact-thanks-section{
  position:relative;
  min-height:458px;
  overflow:hidden;
  background:
    #20324f
    url("../img/cta-handshake-bg.png")
    center center / cover no-repeat;
  color:#fff;
}

.contact-thanks-overlay{
  position:absolute;
  inset:0;
  background:rgba(15,29,52,.42);
  pointer-events:none;
}

.contact-thanks-inner{
  position:relative;
  z-index:1;
  min-height:458px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
}

.contact-thanks-content{
  width:min(100%,960px);
  margin:0 auto;
  color:#fff;
}

.contact-thanks-heading{
  margin:0 0 34px;
  text-align:center;
}

.contact-thanks-heading span{
  display:block;
  margin-bottom:14px;
  color:#fff;
  font-size:15px;
  line-height:1;
  font-weight:400;
  letter-spacing:.06em;
}

.contact-thanks-heading h2{
  margin:0;
  color:#fff;
  font-size:34px;
  line-height:1.22;
  font-weight:400;
  letter-spacing:.01em;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}

.contact-thanks-copy{
  width:min(100%,920px);
  margin:0 auto;
  color:#fff;
  font-size:16px;
  line-height:1.9;
  font-weight:400;
  text-align:center;
  overflow-wrap:break-word;
  word-break:normal;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}

.contact-thanks-copy p{
  margin:0;
  color:inherit;
  font:inherit;
  line-height:inherit;
  white-space:normal;
}

.contact-thanks-copy p:last-child{
  margin-bottom:0;
}

.contact-thanks-phone{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  margin:28px auto 0;
  padding:8px 4px 7px;
  border-top:1px solid rgba(255,255,255,.72);
  border-bottom:1px solid rgba(255,255,255,.72);
  color:#fff;
  font-size:15px;
  line-height:1.2;
  text-decoration:none;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}

.contact-thanks-phone svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
}

.contact-thanks-phone:hover{
  color:#fff;
  opacity:.9;
}

@media (max-width:760px){
  .contact-thanks-section,
  .contact-thanks-inner{
    min-height:420px;
  }

  .contact-thanks-inner{
    padding:36px 20px;
  }

  .contact-thanks-heading{
    margin-bottom:24px;
  }

  .contact-thanks-heading h2{
    font-size:28px;
  }

  .contact-thanks-copy{
    width:100%;
    font-size:13px;
    line-height:1.85;
  }

  .contact-thanks-copy p{
    font-size:inherit;
    line-height:inherit;
    white-space:normal;
  }

  .contact-thanks-phone{
    margin-top:26px;
    font-size:14px;
  }
}

@media (max-width:480px){
  .contact-thanks-section,
  .contact-thanks-inner{
    min-height:380px;
  }

  .contact-thanks-heading span{
    font-size:12px;
  }

  .contact-thanks-heading h2{
    font-size:24px;
  }

  .contact-thanks-copy{
    font-size:12px;
  }

  .contact-thanks-copy p{
    font-size:inherit;
  }
}


/* bags banner light overlay fix v86 */
.bags-hero-ref{
  background:#f8e6cf;
  color:#6b402d;
}

.bags-hero-ref::after{
  background:linear-gradient(
    90deg,
    rgba(255,248,238,.16) 0%,
    rgba(255,248,238,.10) 42%,
    rgba(255,248,238,.02) 68%,
    rgba(255,248,238,0) 100%
  );
}

.bags-hero-ref .inner-hero-bg{
  background-size:cover;
  background-position:center center;
  opacity:1;
}

.bags-hero-ref h1,
.bags-hero-ref .lede,
.bags-hero-ref .hero-badge{
  color:#6a3f2c;
  text-shadow:none;
}

.bags-hero-ref .lede{
  opacity:1;
}

.bags-hero-ref .hero-badge svg{
  color:#6a3f2c;
}

@media (max-width:640px){
  .bags-hero-ref::after{
    background:linear-gradient(
      90deg,
      rgba(255,248,238,.68) 0%,
      rgba(255,248,238,.52) 58%,
      rgba(255,248,238,.18) 100%
    );
  }
}


/* boxes generated banner v87 */
.boxes-hero-ref{
  background:#f4cfe8;
  color:#2f2830;
}

.boxes-hero-ref::after{
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.10) 0%,
    rgba(255,255,255,.06) 42%,
    rgba(255,255,255,.01) 70%,
    rgba(255,255,255,0) 100%
  );
}

.boxes-hero-ref .inner-hero-bg{
  background-size:cover;
  background-position:center center;
  opacity:1;
}

.boxes-hero-ref h1,
.boxes-hero-ref .lede,
.boxes-hero-ref .hero-tags span{
  color:#302832;
  text-shadow:none;
}

.boxes-hero-ref .lede{
  opacity:1;
}

@media (max-width:640px){
  .boxes-hero-ref::after{
    background:linear-gradient(
      90deg,
      rgba(255,245,252,.72) 0%,
      rgba(255,245,252,.52) 60%,
      rgba(255,245,252,.20) 100%
    );
  }
}


/* news detail page v89 */
.news-item-link{
  color:inherit;
  text-decoration:none;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.news-item-link:hover{
  transform:translateY(-2px);
}
.news-item-link:hover h4{
  color:var(--red);
}

.news-detail-section{
  padding:34px 0 64px;
  background:#fff;
}

.news-detail-breadcrumb{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:24px;
  color:var(--muted);
  font-size:13px;
}
.news-detail-breadcrumb a{
  transition:color .2s var(--ease);
}
.news-detail-breadcrumb a:hover{
  color:var(--red);
}

.news-detail-article{
  max-width:960px;
  margin:0 auto;
}

.news-detail-header{
  padding:10px 0 26px;
  text-align:center;
  border-bottom:1px solid var(--line);
}
.news-detail-header h1{
  margin:0 auto;
  max-width:860px;
  color:var(--ink);
  font-size:32px;
  line-height:1.45;
  font-weight:700;
}
.news-detail-meta{
  display:flex;
  justify-content:center;
  gap:28px;
  margin-top:16px;
  color:var(--muted);
  font-size:13px;
}

.news-detail-lead{
  margin:28px 0;
  padding:18px 22px;
  background:var(--bg-alt);
  border-left:4px solid var(--red);
  color:var(--text);
  font-size:15px;
  line-height:1.9;
}

.news-detail-cover{
  margin:0 0 30px;
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--bg-alt);
}
.news-detail-cover img{
  width:100%;
  max-height:540px;
  object-fit:cover;
}

.news-detail-body{
  color:var(--text);
  font-size:16px;
  line-height:2;
}
.news-detail-body p{
  margin:0 0 22px;
}
.news-detail-body h2{
  margin:34px 0 14px;
  color:var(--ink);
  font-size:22px;
  line-height:1.45;
  font-weight:700;
  position:relative;
  padding-left:14px;
}
.news-detail-body h2::before{
  content:"";
  position:absolute;
  left:0;
  top:.25em;
  bottom:.25em;
  width:4px;
  border-radius:2px;
  background:var(--red);
}

.news-detail-nav{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:44px;
  padding-top:26px;
  border-top:1px solid var(--line);
}
.news-detail-nav a{
  min-height:86px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.news-detail-nav a:hover{
  border-color:rgba(226,31,38,.4);
  box-shadow:var(--shadow-sm);
  transform:translateY(-1px);
}
.news-detail-nav span{
  display:block;
  margin-bottom:7px;
  color:var(--muted);
  font-size:12px;
}
.news-detail-nav strong{
  display:block;
  color:var(--ink);
  font-size:14px;
  line-height:1.6;
  font-weight:600;
}
.news-detail-nav a:last-child{
  text-align:right;
}

.news-detail-back{
  margin-top:26px;
  text-align:center;
}
.news-detail-back a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  padding:10px 22px;
  border:1px solid var(--ink);
  border-radius:22px;
  color:var(--ink);
  font-size:14px;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.news-detail-back a:hover{
  background:var(--ink);
  color:#fff;
}

@media (max-width:640px){
  .news-detail-section{
    padding:24px 0 44px;
  }
  .news-detail-breadcrumb{
    margin-bottom:18px;
    font-size:12px;
    white-space:nowrap;
    overflow:hidden;
  }
  .news-detail-header{
    padding-bottom:20px;
  }
  .news-detail-header h1{
    font-size:24px;
    line-height:1.5;
  }
  .news-detail-meta{
    gap:12px;
    flex-wrap:wrap;
    margin-top:12px;
    font-size:12px;
  }
  .news-detail-lead{
    margin:22px 0;
    padding:15px 16px;
    font-size:14px;
    line-height:1.8;
  }
  .news-detail-cover{
    margin-bottom:24px;
  }
  .news-detail-body{
    font-size:15px;
    line-height:1.9;
  }
  .news-detail-body p{
    margin-bottom:18px;
  }
  .news-detail-body h2{
    margin:28px 0 12px;
    font-size:19px;
  }
  .news-detail-nav{
    grid-template-columns:1fr;
    margin-top:34px;
  }
  .news-detail-nav a:last-child{
    text-align:left;
  }
}


/* about quality typography v90 */
.about-quality-section .section-head{
  margin-bottom:32px;
}

.about-quality-section .section-head h2{
  font-size:34px;
  line-height:1.35;
  font-weight:700;
}

.about-quality-section .value-block > div:not(.ph){
  padding:24px 30px;
}

.about-quality-section .value-block h3{
  margin-bottom:12px;
  font-size:22px;
  line-height:1.4;
  font-weight:700;
}

.about-quality-section .value-block p{
  font-size:14px;
  line-height:1.8;
  color:#555f6d;
}

@media (max-width:900px){
  .about-quality-section .section-head h2{
    font-size:30px;
  }

  .about-quality-section .value-block h3{
    font-size:21px;
  }

  .about-quality-section .value-block p{
    font-size:14px;
    line-height:1.75;
  }
}

@media (max-width:760px){
  .about-quality-section .section-head{
    margin-bottom:24px;
  }

  .about-quality-section .section-head h2{
    font-size:25px;
    line-height:1.45;
  }

  .about-quality-section .value-block > div:not(.ph){
    padding:22px 20px;
  }

  .about-quality-section .value-block h3{
    font-size:20px;
  }

  .about-quality-section .value-block p{
    font-size:14px;
    line-height:1.75;
  }
}


/* homepage product center reference scroll motion v91 */
.product-section.product-motion-enabled .product-motion-target{
  --product-motion-x:0px;
  --product-motion-y:28px;
  --product-motion-scale:1;
  opacity:0;
  filter:blur(1px);
  transform:translate3d(var(--product-motion-x),var(--product-motion-y),0) scale(var(--product-motion-scale));
  transition:
    opacity 1.05s cubic-bezier(.22,.72,.22,1),
    transform 1.28s cubic-bezier(.16,1,.3,1),
    filter 1.05s ease;
  transition-delay:var(--product-motion-delay,0ms);
  will-change:opacity,transform;
}

.product-section.product-motion-enabled .product-motion-target.product-motion-left{
  --product-motion-x:-48px;
  --product-motion-y:0px;
}

.product-section.product-motion-enabled .product-motion-target.product-motion-right{
  --product-motion-x:48px;
  --product-motion-y:0px;
}

.product-section.product-motion-enabled .product-motion-target.product-motion-up{
  --product-motion-x:0px;
  --product-motion-y:34px;
}

.product-section.product-motion-enabled .product-motion-target.product-motion-media{
  --product-motion-y:20px;
  --product-motion-scale:.955;
  overflow:hidden;
}

.product-section.product-motion-enabled .product-motion-target.product-motion-media img{
  transform:scale(1.055);
  transition:transform 1.45s cubic-bezier(.16,1,.3,1);
  transition-delay:var(--product-motion-delay,0ms);
}

.product-section.product-motion-enabled .product-motion-target.is-visible{
  opacity:1;
  filter:none;
  transform:translate3d(0,0,0) scale(1);
}

.product-section.product-motion-enabled .product-motion-target.product-motion-media.is-visible img{
  transform:scale(1);
}

/* Keep product card geometry visible/stable while text and media animate inside it. */
.product-section.product-motion-enabled .product-masonry{
  overflow:hidden;
}

/* Slightly slower, more editorial motion on the section title, like the reference site. */
.product-section.product-motion-enabled .section-head.product-motion-target{
  transition-duration:1.05s,1.35s,1.05s;
}

@media (max-width:860px){
  .product-section.product-motion-enabled .product-motion-target.product-motion-left{
    --product-motion-x:-28px;
  }
  .product-section.product-motion-enabled .product-motion-target.product-motion-right{
    --product-motion-x:28px;
  }
}

@media (prefers-reduced-motion:reduce){
  .product-section.product-motion-enabled .product-motion-target,
  .product-section.product-motion-enabled .product-motion-target.product-motion-media img{
    opacity:1 !important;
    filter:none !important;
    transform:none !important;
    transition:none !important;
  }
}


/* PC adaptive convergence v95 */
@media (min-width:769px){
  body:not(.mobile-site){
    --pc-content-max:1248px;
    --pc-header-max:1320px;
    --pc-gutter:clamp(20px,1.7vw,24px);
  }

  body:not(.mobile-site) .container{
    width:100%;
    max-width:var(--pc-content-max);
    padding-left:var(--pc-gutter);
    padding-right:var(--pc-gutter);
    margin-left:auto;
    margin-right:auto;
  }

  /* Header: stable from 1366 through large desktop screens. */
  body:not(.mobile-site) .site-header .container{
    max-width:var(--pc-header-max);
    gap:clamp(10px,1.2vw,20px);
  }

  body:not(.mobile-site) .site-logo-img{
    width:clamp(176px,13.2vw,190px);
    height:58px;
  }

  body:not(.mobile-site) .main-nav{
    flex:1 1 auto;
    justify-content:center;
    min-width:0;
  }

  body:not(.mobile-site) .main-nav a{
    padding-left:clamp(8px,.72vw,12px);
    padding-right:clamp(8px,.72vw,12px);
    font-size:clamp(14px,1vw,15px);
  }

  body:not(.mobile-site) .header-phone{
    min-width:clamp(188px,14.8vw,202px);
  }

  body:not(.mobile-site) .header-phone .label{
    font-size:clamp(20px,1.55vw,22px);
  }

  /* Global desktop rhythm scales slightly, but never grows without limit. */
  body:not(.mobile-site) .section{
    padding-top:clamp(48px,3.4vw,66px);
    padding-bottom:clamp(48px,3.4vw,66px);
  }

  body:not(.mobile-site) .section--tight{
    padding-top:clamp(30px,2.15vw,40px);
    padding-bottom:clamp(30px,2.15vw,40px);
  }

  body:not(.mobile-site) .section-head{
    margin-bottom:clamp(26px,2vw,34px);
  }

  body:not(.mobile-site) .section-head h2{
    font-size:clamp(28px,1.75vw,34px);
    line-height:1.35;
  }

  body:not(.mobile-site) .eyebrow{
    font-size:clamp(13px,.78vw,14px);
  }

  /*
   * Homepage keeps the intended full-screen feel through Full HD,
   * but stops growing vertically on 2K/4K CSS viewports.
   */
  body:not(.mobile-site) .hero--home{
    height:min(100vh,1080px);
    height:min(100dvh,1080px);
    min-height:640px;
  }

  body:not(.mobile-site) .hero--home .hero-text{
    max-width:clamp(430px,32vw,560px);
  }

  body:not(.mobile-site) .hero--home h1{
    font-size:clamp(30px,2.15vw,42px);
  }

  body:not(.mobile-site) .hero--home .hero-eyebrow{
    font-size:clamp(13px,.85vw,15px);
  }

  body:not(.mobile-site) .hero--home .hero-badge{
    font-size:clamp(13px,.82vw,14px);
  }

  /* Inner page banners: consistent visual height from laptop to 2K/4K. */
  body:not(.mobile-site) .hero--inner{
    height:clamp(320px,18.75vw,380px);
    min-height:0;
  }

  body:not(.mobile-site) .hero--inner h1{
    font-size:clamp(30px,2.1vw,42px);
  }

  body:not(.mobile-site) .hero--inner .lede{
    font-size:clamp(14px,.9vw,16px);
  }

  body:not(.mobile-site) .hero--inner .container{
    padding-left:var(--pc-gutter);
    padding-right:var(--pc-gutter);
  }

  /* Generated news/contact banners previously grew with their image ratio. */
  body:not(.mobile-site) .news-generated-hero,
  body:not(.mobile-site) .contact-generated-hero{
    height:clamp(320px,18.75vw,380px);
    min-height:0;
    aspect-ratio:auto;
  }

  /* About uses a very wide source artwork: preserve it but cap large-screen height. */
  body:not(.mobile-site) .about-upload-hero{
    height:clamp(300px,23.45vw,430px);
    min-height:0;
    aspect-ratio:auto;
  }

  body:not(.mobile-site) .about-upload-hero-bg{
    background-size:cover;
    background-position:center center;
  }

  /* Home/product grids keep their desktop structure without stretching on large screens. */
  body:not(.mobile-site) .product-masonry,
  body:not(.mobile-site) .workshop-grid,
  body:not(.mobile-site) .walkin-block,
  body:not(.mobile-site) .labels-material-list,
  body:not(.mobile-site) .boxes-detail-grid--reference{
    min-width:0;
  }

  body:not(.mobile-site) .product-masonry img,
  body:not(.mobile-site) .workshop-card img,
  body:not(.mobile-site) .photo-card img,
  body:not(.mobile-site) .boxes-quality-media img{
    max-width:100%;
  }

  body:not(.mobile-site) .walkin-hero{
    min-height:clamp(470px,37vw,520px);
  }

  /* Long-form pages stay comfortably readable on 2K/4K. */
  body:not(.mobile-site) .news-detail-article{
    max-width:960px;
  }

  body:not(.mobile-site) .news-detail-body{
    font-size:clamp(15px,.9vw,16px);
  }

  body:not(.mobile-site) .contact-thanks-content{
    max-width:760px;
  }
}

/* 1366/1440 class desktops: save header width without changing the design. */
@media (min-width:1081px) and (max-width:1439px){
  body:not(.mobile-site) .site-header .container{
    width:calc(100% - 28px);
    max-width:none;
    padding-left:10px;
    padding-right:10px;
    gap:8px;
  }

  body:not(.mobile-site) .site-logo-img{
    width:176px;
  }

  body:not(.mobile-site) .main-nav a{
    padding-left:8px;
    padding-right:8px;
    font-size:14px;
  }

  body:not(.mobile-site) .header-phone{
    min-width:188px;
    padding-left:7px;
    padding-right:9px;
  }

  body:not(.mobile-site) .header-phone .label{
    font-size:20px;
  }
}

/* Large desktop: do not let visual modules scale endlessly. */
@media (min-width:1920px){
  body:not(.mobile-site) .container{
    max-width:1248px;
  }

  body:not(.mobile-site) .site-header .container{
    max-width:1320px;
  }

  body:not(.mobile-site) .section{
    padding-top:64px;
    padding-bottom:64px;
  }

  body:not(.mobile-site) .section--tight{
    padding-top:38px;
    padding-bottom:38px;
  }
}

@media (min-width:2560px){
  body:not(.mobile-site) .hero--home{
    height:1080px;
    min-height:1080px;
  }

  body:not(.mobile-site) .hero--inner,
  body:not(.mobile-site) .news-generated-hero,
  body:not(.mobile-site) .contact-generated-hero{
    height:380px;
  }

  body:not(.mobile-site) .about-upload-hero{
    height:430px;
  }
}


/* PC homepage resolution convergence v96 */
@media (min-width:769px){
  

  /* Hero text keeps the same relative position as the viewport changes. */
  body.pc-home .hero--home .container{
    max-width:1248px;
    padding-left:clamp(32px,3.4vw,54px);
    padding-right:clamp(32px,3.4vw,54px);
  }

  body.pc-home .hero--home .hero-text{
    width:min(100%,520px);
  }

  body.pc-home .hero--home h1{
    font-size:clamp(31px,2.05vw,40px);
    line-height:1.3;
  }

  body.pc-home .hero--home .hero-badges{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:clamp(10px,.85vw,14px);
    margin-top:clamp(20px,1.8vw,28px);
  }

  body.pc-home .hero--home .hero-badge{
    width:auto;
    min-height:26px;
    white-space:nowrap;
  }

  /* About: keep text and 2×2 gallery visually balanced on 1366–4K. */
  body.pc-home main > .section:first-of-type .container.two-col{
    max-width:1180px;
    grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
    gap:clamp(30px,3vw,48px);
  }

  body.pc-home main > .section:first-of-type .grid-2{
    gap:clamp(10px,1.15vw,16px);
  }

  body.pc-home main > .section:first-of-type .photo-card .ph{
    aspect-ratio:4 / 3;
  }

  body.pc-home main > .section:first-of-type .social-cta-list{
    gap:12px;
    margin-top:clamp(20px,1.8vw,26px);
  }

  /* Product center remains the reference masonry but scales its internal padding. */
  body.pc-home .product-section > .container{
    max-width:1200px;
  }

  body.pc-home .product-section .pm-card{
    padding:clamp(26px,2vw,30px) clamp(26px,2.25vw,34px);
  }

  body.pc-home .product-section .pm-02 .text,
  body.pc-home .product-section .pm-03 .text,
  body.pc-home .product-section .pm-04 .text{
    padding:clamp(26px,2vw,30px) clamp(26px,2.25vw,34px);
  }

  body.pc-home .product-section .pm-card h3{
    font-size:clamp(17px,1.12vw,18px);
  }

  body.pc-home .product-section .pm-card p{
    font-size:clamp(12.5px,.82vw,13px);
    line-height:1.82;
  }

  body.pc-home .service-cta{
    min-height:clamp(240px,18vw,265px);
    grid-template-columns:minmax(300px,38%) minmax(0,62%);
    padding:clamp(28px,2.4vw,34px) clamp(34px,3.2vw,48px);
  }

  body.pc-home .service-cta-copy h3{
    font-size:clamp(22px,1.55vw,25px);
  }

  body.pc-home .service-cta-features{
    gap:clamp(8px,1vw,14px);
  }

  body.pc-home .service-cta-feature h4{
    font-size:clamp(15px,1.05vw,17px);
  }

  /* Workshop width and gaps remain constant in visual density. */
  body.pc-home .workshop-section{
    padding-top:clamp(52px,4vw,64px);
    padding-bottom:clamp(58px,4.5vw,72px);
  }

  body.pc-home .workshop-section .container{
    max-width:1180px;
  }

  body.pc-home .workshop-grid{
    column-gap:clamp(18px,1.8vw,26px);
    row-gap:clamp(26px,2.1vw,32px);
  }

  body.pc-home .workshop-copy{
    padding-top:clamp(15px,1.25vw,20px);
  }

  body.pc-home .workshop-copy h3{
    font-size:clamp(15px,1vw,16px);
  }

  body.pc-home .workshop-copy p{
    font-size:clamp(12px,.8vw,12.5px);
    line-height:1.85;
  }

  /* Walk-in hero and overlapping sample strip scale together. */
  body.pc-home .walkin-section > .container{
    max-width:1200px;
  }

  body.pc-home .walkin-hero{
    min-height:clamp(450px,36vw,520px);
  }

  body.pc-home .walkin-copy{
    left:clamp(62px,7.6%,92px);
    top:clamp(72px,6.25vw,90px);
    width:min(350px,34%);
  }

  body.pc-home .walkin-desc{
    width:min(330px,100%);
    margin-bottom:clamp(30px,3vw,44px);
  }

  body.pc-home .walkin-block .sample-swiper--source{
    width:calc(100% - clamp(112px,11vw,160px));
    margin-top:clamp(-80px,-5.5vw,-58px);
  }

  body.pc-home .walkin-block + .stats{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:clamp(10px,1vw,16px);
    margin-top:clamp(62px,5.8vw,84px);
  }

  /* Culture cards keep a stable card width and readable density. */
  body.pc-home main > .section:last-of-type > .container{
    max-width:1180px;
  }

  body.pc-home .culture-banner--light{
    padding:clamp(20px,1.7vw,26px) clamp(34px,5.5vw,64px) clamp(26px,2vw,32px);
  }

  body.pc-home .culture-grid{
    gap:clamp(12px,1.25vw,18px);
  }

  body.pc-home .culture-banner--light .glass-card{
    min-width:0;
    padding:clamp(18px,1.5vw,22px) 10px;
  }
}

/* 1366/1440 desktop: slightly tighter internals, same overall design. */
@media (min-width:1081px) and (max-width:1439px){
  body.pc-home main > .section:first-of-type .container.two-col{
    max-width:1140px;
    gap:30px;
  }

  body.pc-home .product-section > .container,
  body.pc-home .walkin-section > .container{
    max-width:1160px;
  }

  body.pc-home .service-cta{
    grid-template-columns:36% 64%;
    padding-left:32px;
    padding-right:32px;
  }

  body.pc-home .service-cta-feature p{
    white-space:normal;
    line-height:1.45;
  }

  body.pc-home .workshop-section .container,
  body.pc-home main > .section:last-of-type > .container{
    max-width:1140px;
  }
}

/* Full HD and larger: stop modules from visually spreading out. */
@media (min-width:1600px){
  body.pc-home main > .section:first-of-type .container.two-col,
  body.pc-home .product-section > .container,
  body.pc-home .walkin-section > .container{
    max-width:1200px;
  }

  body.pc-home .workshop-section .container,
  body.pc-home main > .section:last-of-type > .container{
    max-width:1180px;
  }
}


/* PC product pages resolution convergence v97 */
@media (min-width:769px){
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes{
    --product-page-max:1200px;
  }

  body.pc-labels main > section > .container,
  body.pc-bags main > section > .container,
  body.pc-boxes main > section > .container{
    max-width:var(--product-page-max);
  }

  body.pc-labels .hero--inner .container,
  body.pc-bags .hero--inner .container,
  body.pc-boxes .hero--inner .container{
    max-width:1248px;
  }

  /* ---------- Labels ---------- */
  body.pc-labels .labels-hero-ref .inner-hero-bg{
    background-size:cover;
    background-position:center center;
  }

  body.pc-labels .labels-hero-ref .labels-hero-copy{
    max-width:min(60vw,740px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-title-row{
    gap:clamp(14px,1.45vw,22px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-title-row h1{
    font-size:clamp(34px,2.45vw,42px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-title-row span{
    font-size:clamp(21px,1.55vw,26px);
  }

  body.pc-labels .labels-hero-ref .lede{
    max-width:700px;
    font-size:clamp(13.5px,.9vw,15px);
  }

  body.pc-labels .labels-hero-ref .lede strong{
    font-size:clamp(20px,1.45vw,24px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-features{
    margin-top:clamp(15px,1.4vw,20px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-feature{
    width:clamp(112px,9.2vw,132px);
    min-height:clamp(76px,6.2vw,88px);
  }

  body.pc-labels .labels-hero-ref .labels-hero-feature svg{
    width:clamp(36px,2.9vw,42px);
    height:clamp(36px,2.9vw,42px);
    flex-basis:clamp(36px,2.9vw,42px);
  }

  body.pc-labels .labels-hero-ref + .section > .container{
    max-width:1160px;
  }

  body.pc-labels .labels-hero-ref + .section .grid[style*="grid-template-columns"]{
    gap:clamp(24px,2.6vw,38px);
    align-items:stretch;
  }

  body.pc-labels .labels-material-section .container,
  body.pc-labels .labels-craft-section .container,
  body.pc-labels .labels-print-section .container,
  body.pc-labels .label-elements .container,
  body.pc-labels .labels-service-section .container,
  body.pc-labels .labels-team-section .container{
    max-width:1160px;
  }

  body.pc-labels .labels-material-list{
    gap:clamp(10px,1vw,14px);
  }

  body.pc-labels .labels-material-card{
    gap:clamp(12px,1.2vw,18px);
    padding:clamp(8px,.7vw,10px);
    min-height:clamp(156px,11.5vw,172px);
  }

  body.pc-labels .labels-material-media{
    min-height:clamp(138px,10.3vw,152px);
  }

  body.pc-labels .labels-craft-section .craft-desc{
    margin-bottom:clamp(28px,2.45vw,36px);
    padding-left:clamp(28px,3vw,42px);
    padding-right:clamp(28px,3vw,42px);
  }

  body.pc-labels .labels-print-section.section--tight{
    min-height:clamp(330px,25vw,360px);
  }

  body.pc-labels .labels-print-layout{
    grid-template-columns:minmax(260px,300px) minmax(0,1fr);
    gap:clamp(24px,2.3vw,32px);
  }

  body.pc-labels .labels-service-flow{
    grid-template-columns:repeat(5,minmax(126px,146px));
    gap:clamp(14px,1.6vw,24px);
    justify-content:space-between;
  }

  body.pc-labels .labels-service-flow .flow-node{
    width:100%;
    max-width:146px;
    aspect-ratio:1;
    height:auto;
  }

  body.pc-labels .labels-service-flow .flow-node span,
  body.pc-labels .labels-service-flow .flow-node small{
    font-size:clamp(18px,1.45vw,22px);
  }

  body.pc-labels .labels-guarantee-grid{
    gap:clamp(12px,1.25vw,18px);
  }

  body.pc-labels .labels-guarantee-card{
    min-height:clamp(218px,17vw,248px);
    padding-left:clamp(12px,1.25vw,18px);
    padding-right:clamp(12px,1.25vw,18px);
  }

  body.pc-labels .labels-guarantee-card h4{
    font-size:clamp(28px,2vw,34px);
  }

  body.pc-labels .labels-guarantee-card p{
    font-size:clamp(16px,1.25vw,21px);
  }

  body.pc-labels .labels-team-gallery{
    gap:clamp(12px,1.3vw,18px);
  }

  body.pc-labels .labels-team-benefits{
    column-gap:clamp(42px,5vw,72px);
    row-gap:clamp(52px,4.8vw,70px);
    margin-top:clamp(54px,5vw,72px);
  }

  body.pc-labels .labels-team-benefit h4{
    font-size:clamp(21px,1.55vw,25px);
  }

  /* ---------- Bags + Boxes product galleries ---------- */
  body.pc-bags .bags-hero-ref + .section > .container,
  body.pc-boxes .boxes-hero-ref + .section > .container{
    max-width:1160px;
  }

  body.pc-bags .bags-hero-ref + .section .grid[style*="grid-template-columns"],
  body.pc-boxes .boxes-hero-ref + .section .grid[style*="grid-template-columns"]{
    grid-template-columns:minmax(0,1.28fr) minmax(0,1fr) !important;
    gap:clamp(14px,1.45vw,20px);
  }

  body.pc-bags .bags-hero-ref + .section .grid-2,
  body.pc-boxes .boxes-hero-ref + .section .grid-2{
    gap:clamp(10px,1vw,14px);
  }

  body.pc-bags .bags-hero-ref + .section .photo-card,
  body.pc-boxes .boxes-hero-ref + .section .photo-card{
    min-width:0;
  }

  body.pc-bags .bags-hero-ref h1,
  body.pc-boxes .boxes-hero-ref h1{
    font-size:clamp(31px,2.1vw,40px);
  }

  body.pc-bags .bags-hero-ref .hero-text,
  body.pc-boxes .boxes-hero-ref .hero-text{
    max-width:min(48vw,580px);
  }

  body.pc-bags .bags-hero-ref .hero-badges{
    gap:clamp(12px,1.2vw,18px);
  }

  /* ---------- Bags ---------- */
  body.pc-bags .tech-compare{
    max-width:1160px;
    min-height:clamp(390px,29vw,420px);
    margin-left:auto;
    margin-right:auto;
    padding:clamp(44px,3.7vw,54px) clamp(44px,5vw,70px) clamp(52px,4vw,58px);
    gap:clamp(30px,3vw,42px);
  }

  body.pc-bags .tech-copy h2{
    font-size:clamp(28px,2vw,32px);
  }

  body.pc-bags .tech-sub{
    margin-top:clamp(16px,1.5vw,22px);
    font-size:clamp(15px,1.05vw,17px);
  }

  body.pc-bags .tech-note{
    margin-top:clamp(58px,6vw,86px);
    padding-left:clamp(20px,2vw,28px);
    padding-right:clamp(20px,2vw,28px);
    font-size:clamp(16px,1.15vw,18px);
  }

  body.pc-bags .tech-option{
    min-height:clamp(270px,20vw,292px);
    padding:clamp(26px,2.2vw,32px) clamp(28px,2.6vw,38px);
  }

  body.pc-bags .tech-option .ic{
    width:clamp(62px,5vw,74px);
    height:clamp(62px,5vw,74px);
  }

  body.pc-bags .app-section{
    padding-top:clamp(52px,4.4vw,64px);
    padding-bottom:clamp(52px,4.4vw,64px);
  }

  body.pc-bags .app-section > .container{
    max-width:1080px;
  }

  body.pc-bags .app-section .grid.grid-3{
    gap:clamp(16px,1.6vw,24px);
  }

  body.pc-bags .case-card .body{
    padding:clamp(16px,1.4vw,20px);
  }

  body.pc-bags .bags-benefits-section .container{
    max-width:1160px;
  }

  body.pc-bags .bags-benefits-grid{
    column-gap:clamp(48px,6vw,86px);
    row-gap:clamp(52px,5vw,70px);
  }

  body.pc-bags .bags-benefit-item h4{
    font-size:clamp(25px,1.85vw,30px);
  }

  /* ---------- Boxes ---------- */
  body.pc-boxes .boxes-quality-section .container,
  body.pc-boxes .boxes-promise-section .container{
    max-width:1160px;
  }

  body.pc-boxes .boxes-quality-title{
    margin-bottom:clamp(26px,2.5vw,36px);
    font-size:clamp(31px,2.35vw,38px);
  }

  body.pc-boxes .boxes-quality-row + .boxes-quality-row{
    margin-top:clamp(20px,2vw,28px);
  }

  body.pc-boxes .boxes-quality-copy{
    padding:clamp(22px,2vw,28px) clamp(28px,2.7vw,38px);
  }

  body.pc-boxes .boxes-quality-copy h3{
    font-size:clamp(22px,1.65vw,26px);
  }

  body.pc-boxes .boxes-quality-copy > p,
  body.pc-boxes .boxes-quality-points p{
    font-size:clamp(13px,.9vw,14px);
  }

  body.pc-boxes .boxes-promise-main{
    margin-top:clamp(26px,2.35vw,34px);
    font-size:clamp(27px,2vw,32px);
  }

  body.pc-boxes .boxes-promise-sub{
    font-size:clamp(18px,1.3vw,21px);
  }

  body.pc-boxes .boxes-promise-panel{
    min-height:clamp(160px,12vw,174px);
    padding:clamp(24px,2vw,28px) 24px 34px;
  }

  body.pc-boxes .boxes-promise-panel h3{
    font-size:clamp(31px,2.35vw,38px);
  }

  body.pc-boxes .boxes-promise-panel p{
    font-size:clamp(17px,1.25vw,20px);
  }

  body.pc-boxes .boxes-detail-section .container{
    max-width:1160px;
  }

  body.pc-boxes .boxes-detail-grid--reference{
    max-width:1070px;
    gap:clamp(18px,1.8vw,26px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card{
    min-height:clamp(198px,15.3vw,218px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card .ph{
    min-height:clamp(198px,15.3vw,218px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card .txt{
    padding:clamp(15px,1.25vw,18px) clamp(18px,1.7vw,24px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card h3{
    font-size:clamp(24px,1.75vw,28px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card b{
    font-size:clamp(18px,1.25vw,20px);
  }

  body.pc-boxes .boxes-detail-grid--reference .boxes-detail-card p{
    font-size:clamp(13.5px,.95vw,15px);
  }

  body.pc-boxes .boxes-detail-cta{
    min-height:clamp(176px,13.4vw,190px);
    margin-top:clamp(34px,3.1vw,44px);
  }

  body.pc-boxes .boxes-detail-cta h3{
    font-size:clamp(33px,2.5vw,40px);
  }

  body.pc-boxes .boxes-detail-cta p{
    font-size:clamp(17px,1.3vw,20px);
  }

  body.pc-boxes .bags-benefits-section .container{
    max-width:1160px;
  }

  body.pc-boxes .bags-benefits-grid{
    column-gap:clamp(48px,6vw,86px);
    row-gap:clamp(52px,5vw,70px);
  }

  body.pc-boxes .bags-benefit-item h4{
    font-size:clamp(25px,1.85vw,30px);
  }
}

/* 1366/1440 desktop density correction. */
@media (min-width:1081px) and (max-width:1439px){
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes{
    --product-page-max:1160px;
  }

  body.pc-labels .hero--inner .container,
  body.pc-bags .hero--inner .container,
  body.pc-boxes .hero--inner .container{
    max-width:1180px;
  }

  body.pc-labels .labels-service-section .container{
    max-width:1040px;
  }

  body.pc-labels .labels-service-flow{
    grid-template-columns:repeat(5,132px);
  }

  body.pc-labels .labels-service-flow .flow-node{
    max-width:132px;
  }

  body.pc-labels .labels-guarantee-card h4{
    font-size:29px;
  }

  body.pc-labels .labels-guarantee-card p{
    font-size:17px;
  }

  body.pc-bags .tech-compare{
    max-width:1120px;
  }

  body.pc-bags .app-section > .container{
    max-width:1020px;
  }

  body.pc-boxes .boxes-quality-section .container,
  body.pc-boxes .boxes-promise-section .container,
  body.pc-boxes .boxes-detail-section .container{
    max-width:1120px;
  }
}

/* Full HD and above: keep visual modules capped instead of stretching. */
@media (min-width:1600px){
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes{
    --product-page-max:1200px;
  }
}


/* PC secondary pages resolution convergence v98 */
@media (min-width:769px){
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --secondary-page-max:1200px;
  }

  body.pc-about main > section > .container,
  body.pc-news main > section > .container,
  body.pc-contact main > section > .container{
    max-width:var(--secondary-page-max);
  }

  body.pc-news-detail .news-detail-section > .container{
    max-width:1160px;
  }

  /* ---------- About ---------- */
  body.pc-about .about-upload-hero{
    height:clamp(300px,23.45vw,430px);
    min-height:0;
    aspect-ratio:auto;
  }

  body.pc-about .about-upload-hero-bg{
    background-size:cover;
    background-position:center center;
  }

  body.pc-about .about-quality-section > .container{
    max-width:1160px;
  }

  body.pc-about .about-quality-section .section-head{
    margin-bottom:clamp(24px,2.1vw,32px);
  }

  body.pc-about .about-quality-section .section-head h2{
    font-size:clamp(29px,2.1vw,34px);
  }

  body.pc-about .about-quality-section .value-block{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }

  body.pc-about .about-quality-section .value-block .ph{
    height:clamp(228px,18vw,260px);
  }

  body.pc-about .about-quality-section .value-block > div:not(.ph){
    padding:clamp(20px,1.8vw,24px) clamp(24px,2.2vw,30px);
  }

  body.pc-about .about-quality-section .value-block h3{
    font-size:clamp(19px,1.4vw,22px);
  }

  body.pc-about .about-quality-section .value-block p{
    font-size:clamp(13px,.9vw,14px);
    line-height:1.78;
  }

  body.pc-about .section--alt .stats{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:clamp(10px,1.2vw,18px);
  }

  body.pc-about .about-culture-section{
    min-height:clamp(390px,30vw,432px);
  }

  body.pc-about .about-culture-inner{
    max-width:900px;
    padding-top:clamp(34px,2.8vw,40px);
    padding-bottom:clamp(40px,3.4vw,48px);
  }

  body.pc-about .about-culture-heading{
    margin-bottom:clamp(42px,4vw,64px);
  }

  body.pc-about .about-culture-heading h2{
    font-size:clamp(27px,1.9vw,31px);
  }

  body.pc-about .about-culture-grid{
    gap:clamp(12px,1.2vw,16px);
  }

  body.pc-about .about-culture-card{
    min-height:clamp(196px,15vw,220px);
    padding:clamp(24px,2vw,31px) clamp(14px,1.25vw,18px) clamp(20px,1.7vw,24px);
  }

  body.pc-about .about-culture-card h3{
    font-size:clamp(15px,1vw,16px);
  }

  body.pc-about .about-culture-card p{
    font-size:clamp(10.5px,.72vw,11px);
  }

  /* ---------- News list ---------- */
  body.pc-news .news-generated-hero,
  body.pc-news-detail .news-generated-hero{
    height:clamp(320px,18.75vw,380px);
    min-height:0;
    aspect-ratio:auto;
  }

  body.pc-news .news-generated-hero .container,
  body.pc-news-detail .news-generated-hero .container,
  body.pc-contact .contact-generated-hero .container{
    max-width:1248px;
  }

  body.pc-news .news-generated-hero .hero-text,
  body.pc-news-detail .news-generated-hero .hero-text{
    max-width:min(48vw,620px);
  }

  body.pc-news .news-generated-hero h1,
  body.pc-news-detail .news-generated-hero h1{
    font-size:clamp(31px,2.15vw,42px);
  }

  body.pc-news main > .section > .container{
    max-width:1100px;
  }

  body.pc-news .gallery-tabs{
    margin-bottom:clamp(24px,2.2vw,32px);
  }

  body.pc-news .news-item{
    grid-template-columns:clamp(220px,18vw,260px) minmax(0,1fr) auto;
    gap:clamp(20px,1.8vw,26px);
    padding:clamp(22px,1.9vw,28px) 0;
  }

  body.pc-news .news-item h4{
    font-size:clamp(16px,1.05vw,17px);
  }

  body.pc-news .news-item p{
    font-size:clamp(12.5px,.82vw,13px);
    line-height:1.82;
  }

  body.pc-news .news-date{
    padding-left:clamp(18px,1.8vw,26px);
  }

  /* ---------- News detail ---------- */
  body.pc-news-detail .news-detail-article{
    max-width:940px;
  }

  body.pc-news-detail .news-detail-breadcrumb{
    margin-bottom:clamp(20px,1.7vw,24px);
  }

  body.pc-news-detail .news-detail-header{
    padding-top:clamp(8px,.8vw,10px);
    padding-bottom:clamp(22px,1.8vw,26px);
  }

  body.pc-news-detail .news-detail-header h1{
    max-width:840px;
    font-size:clamp(28px,2vw,32px);
  }

  body.pc-news-detail .news-detail-meta{
    margin-top:clamp(13px,1vw,16px);
  }

  body.pc-news-detail .news-detail-lead{
    margin:clamp(24px,2vw,28px) 0;
    padding:clamp(16px,1.25vw,18px) clamp(18px,1.55vw,22px);
    font-size:clamp(14px,.95vw,15px);
  }

  body.pc-news-detail .news-detail-cover{
    margin-bottom:clamp(24px,2.1vw,30px);
  }

  body.pc-news-detail .news-detail-cover img{
    max-height:520px;
    object-fit:cover;
  }

  body.pc-news-detail .news-detail-body{
    font-size:clamp(15px,.95vw,16px);
    line-height:1.95;
  }

  body.pc-news-detail .news-detail-body h2{
    margin-top:clamp(28px,2.35vw,34px);
    font-size:clamp(20px,1.35vw,22px);
  }

  body.pc-news-detail .news-detail-nav{
    gap:clamp(10px,1vw,14px);
    margin-top:clamp(36px,3vw,44px);
  }

  /* ---------- Contact ---------- */
  body.pc-contact .contact-generated-hero{
    height:clamp(320px,18.75vw,380px);
    min-height:0;
    aspect-ratio:auto;
  }

  body.pc-contact .contact-generated-hero .hero-text{
    max-width:min(45vw,560px);
  }

  body.pc-contact .contact-generated-hero h1{
    font-size:clamp(31px,2.15vw,42px);
  }

  body.pc-contact #contact-info > .container{
    max-width:1120px;
  }

  body.pc-contact .contact-intro{
    grid-template-columns:clamp(82px,6.6vw,96px) minmax(0,1fr);
    gap:clamp(18px,1.7vw,24px);
  }

  body.pc-contact .contact-avatar{
    width:clamp(82px,6.6vw,96px);
    height:clamp(82px,6.6vw,96px);
  }

  body.pc-contact .contact-intro h3{
    font-size:clamp(18px,1.2vw,19px);
  }

  body.pc-contact .contact-intro p{
    font-size:clamp(13px,.88vw,13.5px);
    line-height:1.95;
  }

  body.pc-contact .contact-cardgrid{
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:clamp(20px,2vw,28px);
    margin-top:clamp(28px,2.5vw,36px);
    align-items:stretch;
  }

  body.pc-contact .contact-card,
  body.pc-contact .contact-map{
    min-width:0;
  }

  body.pc-contact .contact-card .head{
    padding:clamp(14px,1.1vw,16px) clamp(18px,1.5vw,22px);
  }

  body.pc-contact .contact-card .body{
    padding:clamp(18px,1.55vw,22px);
    gap:clamp(13px,1.1vw,16px);
  }

  body.pc-contact .contact-map{
    min-height:clamp(260px,20vw,310px);
  }

  body.pc-contact .contact-thanks-section,
  body.pc-contact .contact-thanks-inner{
    min-height:clamp(410px,31vw,458px);
  }

  body.pc-contact .contact-thanks-inner{
    max-width:1200px;
    padding-left:24px;
    padding-right:24px;
  }

  body.pc-contact .contact-thanks-content{
    max-width:760px;
  }

  body.pc-contact .contact-thanks-heading{
    margin-bottom:clamp(26px,2.3vw,34px);
  }

  body.pc-contact .contact-thanks-heading h2{
    font-size:clamp(29px,2.15vw,34px);
  }

  body.pc-contact .contact-thanks-copy p{
    font-size:clamp(13px,.88vw,14px);
    line-height:1.72;
  }

  body.pc-contact .contact-thanks-phone{
    margin-top:clamp(26px,2.3vw,34px);
    font-size:clamp(14px,.95vw,15px);
  }
}

/* 1366/1440 desktops */
@media (min-width:1081px) and (max-width:1439px){
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --secondary-page-max:1160px;
  }

  body.pc-about .about-quality-section > .container{
    max-width:1120px;
  }

  body.pc-about .about-culture-inner{
    max-width:860px;
  }

  body.pc-news main > .section > .container{
    max-width:1040px;
  }

  body.pc-news-detail .news-detail-section > .container{
    max-width:1080px;
  }

  body.pc-news-detail .news-detail-article{
    max-width:900px;
  }

  body.pc-contact #contact-info > .container{
    max-width:1080px;
  }
}

/* Full HD and larger: keep reading widths bounded. */
@media (min-width:1600px){
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --secondary-page-max:1200px;
  }

  body.pc-news main > .section > .container{
    max-width:1100px;
  }

  body.pc-news-detail .news-detail-article{
    max-width:940px;
  }

  body.pc-contact #contact-info > .container{
    max-width:1120px;
  }
}


/* Semantic body-shell architecture v102 */
/* ==========================================================================
   Semantic body shell
   body > header + nav + main + footer
   ========================================================================== */

@media (min-width:769px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:calc(100vw - 32px);
    --page-content-width:min(1200px,calc(100vw - 80px));
    --header-bar-height:68px;
    --header-logo-slot:clamp(210px,16vw,300px);
    --header-phone-slot:clamp(210px,16vw,300px);

    width:var(--page-body-width);
    max-width:100vw;
    min-width:0;
    margin-left:auto;
    margin-right:auto;
    overflow-x:hidden;
    background:#fff;
  }

  body.pc-home > header,
  body.pc-labels > header,
  body.pc-bags > header,
  body.pc-boxes > header,
  body.pc-about > header,
  body.pc-news > header,
  body.pc-news-detail > header,
  body.pc-contact > header,
  body.pc-home > nav.site-nav,
  body.pc-labels > nav.site-nav,
  body.pc-bags > nav.site-nav,
  body.pc-boxes > nav.site-nav,
  body.pc-about > nav.site-nav,
  body.pc-news > nav.site-nav,
  body.pc-news-detail > nav.site-nav,
  body.pc-contact > nav.site-nav,
  body.pc-home > main,
  body.pc-labels > main,
  body.pc-bags > main,
  body.pc-boxes > main,
  body.pc-about > main,
  body.pc-news > main,
  body.pc-news-detail > main,
  body.pc-contact > main,
  body.pc-home > footer,
  body.pc-labels > footer,
  body.pc-bags > footer,
  body.pc-boxes > footer,
  body.pc-about > footer,
  body.pc-news > footer,
  body.pc-news-detail > footer,
  body.pc-contact > footer{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }

  /* Fixed top regions use the same responsive width as body. */
  body.pc-home > .site-header,
  body.pc-labels > .site-header,
  body.pc-bags > .site-header,
  body.pc-boxes > .site-header,
  body.pc-about > .site-header,
  body.pc-news > .site-header,
  body.pc-news-detail > .site-header,
  body.pc-contact > .site-header{
    left:50%;
    right:auto;
    width:var(--page-body-width);
    max-width:100vw;
    transform:translateX(-50%);
  }

  body.pc-home > .site-nav,
  body.pc-labels > .site-nav,
  body.pc-bags > .site-nav,
  body.pc-boxes > .site-nav,
  body.pc-about > .site-nav,
  body.pc-news > .site-nav,
  body.pc-news-detail > .site-nav,
  body.pc-contact > .site-nav{
    position:fixed;
    top:0;
    left:50%;
    z-index:201;
    width:var(--page-body-width);
    max-width:100vw;
    height:var(--header-bar-height);
    transform:translateX(-50%);
    background:transparent;
    pointer-events:none;
  }

  body.pc-home > .site-nav > .container,
  body.pc-labels > .site-nav > .container,
  body.pc-bags > .site-nav > .container,
  body.pc-boxes > .site-nav > .container,
  body.pc-about > .site-nav > .container,
  body.pc-news > .site-nav > .container,
  body.pc-news-detail > .site-nav > .container,
  body.pc-contact > .site-nav > .container{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:100%;
    height:var(--header-bar-height);
    margin:0;
    padding-left:var(--header-logo-slot);
    padding-right:var(--header-phone-slot);
    box-sizing:border-box;
  }


  /* Header and nav share one bar height; nav reserves semantic side slots. */
  body.pc-home > .site-header > .container,
  body.pc-labels > .site-header > .container,
  body.pc-bags > .site-header > .container,
  body.pc-boxes > .site-header > .container,
  body.pc-about > .site-header > .container,
  body.pc-news > .site-header > .container,
  body.pc-news-detail > .site-header > .container,
  body.pc-contact > .site-header > .container{
    height:var(--header-bar-height);
  }

  body.pc-home > .site-nav .main-nav,
  body.pc-labels > .site-nav .main-nav,
  body.pc-bags > .site-nav .main-nav,
  body.pc-boxes > .site-nav .main-nav,
  body.pc-about > .site-nav .main-nav,
  body.pc-news > .site-nav .main-nav,
  body.pc-news-detail > .site-nav .main-nav,
  body.pc-contact > .site-nav .main-nav{
    pointer-events:auto;
  }

  /* Header/footer content aligns to the responsive content container. */
  body.pc-home > .site-header > .container,
  body.pc-labels > .site-header > .container,
  body.pc-bags > .site-header > .container,
  body.pc-boxes > .site-header > .container,
  body.pc-about > .site-header > .container,
  body.pc-news > .site-header > .container,
  body.pc-news-detail > .site-header > .container,
  body.pc-contact > .site-header > .container,
  body.pc-home > .site-footer > .container,
  body.pc-labels > .site-footer > .container,
  body.pc-bags > .site-footer > .container,
  body.pc-boxes > .site-footer > .container,
  body.pc-about > .site-footer > .container,
  body.pc-news > .site-footer > .container,
  body.pc-news-detail > .site-footer > .container,
  body.pc-contact > .site-footer > .container,
  body.pc-home .footer-bottom > .container,
  body.pc-labels .footer-bottom > .container,
  body.pc-bags .footer-bottom > .container,
  body.pc-boxes .footer-bottom > .container,
  body.pc-about .footer-bottom > .container,
  body.pc-news .footer-bottom > .container,
  body.pc-news-detail .footer-bottom > .container,
  body.pc-contact .footer-bottom > .container{
    width:var(--page-content-width);
    max-width:100%;
    min-width:0;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right:0;
    box-sizing:border-box;
  }

  /*
   * MAIN is always exactly the body width.
   * Every business section and banner is therefore bounded by body.
   */
  body.pc-home > main,
  body.pc-labels > main,
  body.pc-bags > main,
  body.pc-boxes > main,
  body.pc-about > main,
  body.pc-news > main,
  body.pc-news-detail > main,
  body.pc-contact > main{
    margin:0;
    overflow-x:hidden;
    background:#fff;
  }

  body.pc-labels > main,
  body.pc-bags > main,
  body.pc-boxes > main,
  body.pc-about > main,
  body.pc-news > main,
  body.pc-news-detail > main,
  body.pc-contact > main{
    padding-top:var(--header-bar-height);
  }

  body.pc-home > main > section,
  body.pc-labels > main > section,
  body.pc-bags > main > section,
  body.pc-boxes > main > section,
  body.pc-about > main > section,
  body.pc-news > main > section,
  body.pc-news-detail > main > section,
  body.pc-contact > main > section{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }

  body.pc-home main > section > .container,
  body.pc-labels main > section > .container,
  body.pc-bags main > section > .container,
  body.pc-boxes main > section > .container,
  body.pc-about main > section > .container,
  body.pc-news main > section > .container,
  body.pc-news-detail main > section > .container,
  body.pc-contact main > section > .container{
    width:var(--page-content-width);
    max-width:100%;
    min-width:0;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right:0;
    box-sizing:border-box;
  }

  /* Full-bleed visuals are full only inside body, never beyond body. */
  body.pc-home :is(.hero,.hero--home,.hero--inner),
  body.pc-labels :is(.hero,.hero--home,.hero--inner),
  body.pc-bags :is(.hero,.hero--home,.hero--inner),
  body.pc-boxes :is(.hero,.hero--home,.hero--inner),
  body.pc-about :is(.hero,.hero--home,.hero--inner,.about-upload-hero,.about-culture-section),
  body.pc-news :is(.hero,.hero--home,.hero--inner),
  body.pc-news-detail :is(.hero,.hero--home,.hero--inner),
  body.pc-contact :is(.hero,.hero--home,.hero--inner,.contact-thanks-section){
    width:100%;
    max-width:100%;
    margin-left:0;
    margin-right:0;
    box-sizing:border-box;
    overflow:hidden;
  }

  body.pc-home .hero--home{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:16 / 4.7;
  }

  body.pc-home .hero--home :is(.hero-swiper,.swiper-viewport,.swiper-track,.swiper-slide),
  body.pc-home .hero--home .swiper-slide :is(img,video){
    width:100%;
    max-width:100%;
    height:100%;
  }

  body.pc-home .hero--home .swiper-slide :is(img,video){
    object-fit:cover;
  }

  body.pc-home .hero--home .swiper-slide > .container,
  body.pc-labels .hero--inner > .container,
  body.pc-bags .hero--inner > .container,
  body.pc-boxes .hero--inner > .container,
  body.pc-news .hero--inner > .container,
  body.pc-news-detail .hero--inner > .container,
  body.pc-contact .hero--inner > .container{
    width:var(--page-content-width);
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right:0;
  }

  body.pc-home main :is(img,video,iframe),
  body.pc-labels main :is(img,video,iframe),
  body.pc-bags main :is(img,video,iframe),
  body.pc-boxes main :is(img,video,iframe),
  body.pc-about main :is(img,video,iframe),
  body.pc-news main :is(img,video,iframe),
  body.pc-news-detail main :is(img,video,iframe),
  body.pc-contact main :is(img,video,iframe){
    max-width:100%;
  }

  /* Nested modules may shrink within the semantic shell, never overflow it. */
  body:is(.pc-home,.pc-labels,.pc-bags,.pc-boxes,.pc-about,.pc-news,.pc-news-detail,.pc-contact) main :is(
    .grid,.grid-2,.grid-3,.grid-4,.grid-6,
    .product-masonry,.product-center-block,.service-cta,
    .workshop-grid,.workshop-card,.walkin-block,.walkin-hero,
    .sample-swiper,.media-swiper,.swiper-viewport,
    .labels-material-list,.labels-material-card,.labels-material-media,
    .labels-service-flow,.labels-guarantee-grid,.labels-team-gallery,.labels-team-benefits,
    .tech-compare,.tech-panel,.app-section,.bags-benefits-grid,
    .boxes-quality-row,.boxes-promise-panel,.boxes-detail-grid,.boxes-detail-grid--reference,
    .boxes-detail-card,.boxes-detail-cta,.value-block,.stats,.about-culture-grid,
    .news-item,.news-detail-article,.news-detail-nav,
    .contact-intro,.contact-cardgrid,.contact-card,.contact-map,.contact-thanks-content
  ){
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }

}

@media (min-width:1600px) and (max-width:1919px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(1440px,calc(100vw - 48px));
    --page-content-width:min(1280px,calc(var(--page-body-width) - 64px));
  }
}

@media (min-width:1920px) and (max-width:2559px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(1680px,calc(100vw - 64px));
    --page-content-width:min(1480px,calc(var(--page-body-width) - 72px));
  }
}

@media (min-width:2560px) and (max-width:3199px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(2048px,calc(100vw - 80px));
    --page-content-width:min(1800px,calc(var(--page-body-width) - 88px));
  }
}

@media (min-width:3200px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(2560px,calc(100vw - 96px));
    --page-content-width:min(2200px,calc(var(--page-body-width) - 104px));
  }
}


/* PC compact header/navigation geometry v109 */
/*
 * The site switches to dedicated mobile pages at 768px. 769-1080px is
 * therefore still desktop UI, but it needs denser header geometry to keep
 * all seven navigation items between the logo and hotline without overlap.
 */
@media (min-width:769px) and (max-width:899px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --header-logo-slot:155px;
    --header-phone-slot:155px;
  }

  body:not(.mobile-site) .site-header .container{
    gap:6px;
  }

  body:not(.mobile-site) .site-logo-img{
    width:145px;
    height:50px;
  }

  body:not(.mobile-site) .header-phone{
    min-width:145px;
    height:42px;
    padding-left:5px;
    padding-right:6px;
    gap:1px;
  }

  body:not(.mobile-site) .header-phone::before{
    width:8px;
    flex-basis:8px;
    margin-right:-4px;
    transform:translateX(1px) scale(.9);
  }

  body:not(.mobile-site) .header-phone svg{
    width:19px;
    height:19px;
    flex-basis:19px;
  }

  body:not(.mobile-site) .header-phone .label{
    font-size:14px;
  }

  body:not(.mobile-site) .header-phone .tag{
    top:-8px;
    right:4px;
    padding:1px 5px;
    font-size:8px;
  }

  body:not(.mobile-site) .main-nav{
    gap:1px;
  }

  body:not(.mobile-site) .main-nav a{
    padding-left:clamp(3px,.45vw,4px);
    padding-right:clamp(3px,.45vw,4px);
    font-size:clamp(10.5px,1.3vw,11.5px);
  }
}

@media (min-width:900px) and (max-width:1080px){
  body:not(.mobile-site) .site-header .container{
    gap:8px;
  }

  body:not(.mobile-site) .site-logo-img{
    width:clamp(160px,17vw,176px);
  }

  body:not(.mobile-site) .header-phone{
    min-width:clamp(168px,18.5vw,188px);
    padding-left:6px;
    padding-right:8px;
  }

  body:not(.mobile-site) .header-phone .label{
    font-size:clamp(17px,1.9vw,20px);
  }

  body:not(.mobile-site) .main-nav{
    gap:1px;
  }

  body:not(.mobile-site) .main-nav a{
    padding-left:clamp(4px,.55vw,6px);
    padding-right:clamp(4px,.55vw,6px);
    font-size:clamp(11.5px,1.25vw,13px);
  }
}


/* Header scroll enlargement motion v103 */
@media (min-width:769px){
  .site-header{
    --logo-scroll-scale:1;
    --phone-scroll-scale:1;
  }

  .site-header .logo{
    position:relative;
    transform:scale(var(--logo-scroll-scale));
    transform-origin:left center;
    transition:transform .16s cubic-bezier(.22,.7,.2,1);
    will-change:transform;
  }

  .site-header .header-phone{
    position:relative;
    transform:scale(var(--phone-scroll-scale));
    transform-origin:right center;
    transition:transform .16s cubic-bezier(.22,.7,.2,1);
    will-change:transform;
  }

  .site-header .site-logo-img{
    backface-visibility:hidden;
  }
}

@media (prefers-reduced-motion:reduce){
  .site-header .logo,
  .site-header .header-phone{
    transition:none !important;
  }
}


/* PC large-screen component scaling v108 */
/*
 * Component-only enlargement for wide desktops.
 * Page/body/header widths remain owned by the v102 semantic shell.
 */
@media (min-width:2200px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-module-width:min(clamp(1360px,46vw,1760px),var(--page-content-width));
    --page-reading-width:min(clamp(1040px,34vw,1320px),var(--page-content-width));
    --page-wide-gap:clamp(28px,1.5vw,46px);
  }

  body.pc-home .footer-nav--brand,
  body.pc-labels .footer-nav--brand,
  body.pc-bags .footer-nav--brand,
  body.pc-boxes .footer-nav--brand,
  body.pc-about .footer-nav--brand,
  body.pc-news .footer-nav--brand,
  body.pc-news-detail .footer-nav--brand,
  body.pc-contact .footer-nav--brand{
    gap:clamp(64px,5vw,120px);
  }

  /* Homepage */
  body.pc-home main > .section:first-of-type .container.two-col,
  body.pc-home .product-section > .container,
  body.pc-home .workshop-section .container,
  body.pc-home .walkin-section > .container,
  body.pc-home main > .section:last-of-type > .container{
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-home main > .section:first-of-type .container.two-col{
    grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
    gap:clamp(54px,3.2vw,90px);
  }

  body.pc-home .product-masonry{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  }

  body.pc-home .product-section .pm-card,
  body.pc-home .product-section .pm-02 .text,
  body.pc-home .product-section .pm-03 .text,
  body.pc-home .product-section .pm-04 .text{
    padding:clamp(34px,1.55vw,48px) clamp(36px,1.75vw,54px);
  }

  body.pc-home .product-section .pm-card h3{
    font-size:clamp(19px,.72vw,22px);
  }

  body.pc-home .product-section .pm-card p{
    font-size:clamp(13px,.5vw,15px);
  }

  body.pc-home .service-cta{
    min-height:clamp(285px,10vw,360px);
    padding:clamp(42px,1.8vw,58px) clamp(54px,2.2vw,72px);
  }

  body.pc-home .service-cta-copy h3{
    font-size:clamp(27px,1vw,32px);
  }

  body.pc-home .workshop-head h2{
    font-size:clamp(32px,1.15vw,38px);
  }

  body.pc-home .workshop-copy h3{
    font-size:clamp(17px,.65vw,20px);
  }

  body.pc-home .workshop-copy p{
    font-size:clamp(13px,.5vw,15px);
  }

  body.pc-home .walkin-hero{
    min-height:clamp(560px,17vw,650px);
  }

  body.pc-home .walkin-copy{
    left:clamp(90px,6.5%,140px);
    top:clamp(92px,3.1vw,118px);
    width:min(430px,30%);
  }

  body.pc-home .walkin-copy h2{
    font-size:clamp(24px,.9vw,30px);
  }

  body.pc-home .walkin-desc{
    width:min(410px,100%);
  }

  body.pc-home .walkin-desc p{
    font-size:clamp(12.5px,.47vw,14px);
  }

  body.pc-home .walkin-block .sample-swiper--source{
    width:calc(100% - clamp(160px,8vw,260px));
    margin-top:clamp(-100px,-3vw,-72px);
  }

  body.pc-home .walkin-block + .stats{
    max-width:var(--page-module-width);
    margin-left:auto;
    margin-right:auto;
  }

  body.pc-home .culture-banner--light{
    padding-left:clamp(70px,4vw,120px);
    padding-right:clamp(70px,4vw,120px);
  }

  /* Product pages */
  body.pc-labels main > section > .container,
  body.pc-bags main > section > .container,
  body.pc-boxes main > section > .container{
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-labels .labels-hero-ref + .section > .container,
  body.pc-labels .labels-material-section .container,
  body.pc-labels .labels-craft-section .container,
  body.pc-labels .labels-print-section .container,
  body.pc-labels .label-elements .container,
  body.pc-labels .labels-team-section .container{
    max-width:var(--page-module-width);
  }

  body.pc-labels .labels-material-card{
    min-height:clamp(190px,7vw,260px);
  }

  body.pc-labels .labels-material-media{
    min-height:clamp(170px,6.3vw,235px);
  }

  body.pc-labels .labels-service-flow,
  body.pc-labels .labels-guarantee-grid,
  body.pc-labels .labels-team-gallery,
  body.pc-labels .labels-team-benefits{
    max-width:var(--page-module-width);
    margin-left:auto;
    margin-right:auto;
  }

  body.pc-bags .bags-hero-ref + .section > .container,
  body.pc-boxes .boxes-hero-ref + .section > .container,
  body.pc-bags .tech-compare,
  body.pc-bags .app-section > .container,
  body.pc-bags .bags-benefits-section .container,
  body.pc-boxes .bags-benefits-section .container,
  body.pc-boxes .boxes-quality-section .container,
  body.pc-boxes .boxes-promise-section .container,
  body.pc-boxes .boxes-detail-section .container{
    max-width:var(--page-module-width);
  }

  body.pc-bags .bags-benefits-grid,
  body.pc-boxes .bags-benefits-grid{
    column-gap:clamp(76px,4vw,130px);
  }

  body.pc-boxes .boxes-detail-grid--reference{
    max-width:calc(var(--page-module-width) - 120px);
  }

  body.pc-boxes .boxes-detail-cta{
    max-width:calc(var(--page-module-width) - 100px);
  }

  /* About */
  body.pc-about main > section > .container{
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-about .about-quality-section > .container,
  body.pc-about .about-culture-inner{
    max-width:var(--page-module-width);
  }

  body.pc-about .about-quality-section .value-block .ph{
    height:clamp(280px,9vw,350px);
  }

  body.pc-about .about-culture-card{
    min-height:clamp(220px,7.6vw,280px);
  }

  /* News */
  body.pc-news main > .section > .container{
    max-width:min(clamp(1280px,43vw,1640px),var(--page-content-width));
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-news .news-item{
    grid-template-columns:clamp(280px,11vw,380px) minmax(0,1fr) auto;
    gap:clamp(28px,1.45vw,46px);
  }

  body.pc-news .news-item h4{
    font-size:clamp(18px,.7vw,22px);
  }

  body.pc-news .news-item p{
    font-size:clamp(13px,.5vw,15px);
  }

  body.pc-news-detail .news-detail-section > .container{
    max-width:min(clamp(1240px,42vw,1600px),var(--page-content-width));
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-news-detail .news-detail-article{
    max-width:var(--page-reading-width);
  }

  body.pc-news-detail .news-detail-header h1{
    max-width:calc(var(--page-reading-width) - 80px);
    font-size:clamp(32px,1vw,38px);
  }

  body.pc-news-detail .news-detail-body{
    font-size:clamp(16px,.52vw,18px);
  }

  body.pc-news-detail .news-detail-body h2{
    font-size:clamp(22px,.7vw,26px);
  }

  /* Contact */
  body.pc-contact main > section > .container{
    padding-left:var(--page-wide-gap);
    padding-right:var(--page-wide-gap);
  }

  body.pc-contact #contact-info > .container{
    max-width:min(clamp(1360px,46vw,1760px),var(--page-content-width));
  }

  body.pc-contact .contact-cardgrid{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  }

  body.pc-contact .contact-map{
    min-height:clamp(340px,11vw,430px);
  }

  body.pc-contact .contact-thanks-content{
    max-width:min(clamp(760px,26vw,1000px),var(--page-content-width));
  }
}


/* 2K and 4K visual scale optimization v104 */
/*
 * The semantic body shell remains the hard outer boundary.
 * On 2K/4K displays we use a percentage-based body width so the site does
 * not collapse into a narrow centered column.
 */
@media (min-width:2560px) and (max-width:3199px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(90vw,calc(100vw - 96px));
    --page-content-width:min(84vw,calc(var(--page-body-width) - 120px));
    --header-bar-height:80px;
  }

  /* Override historical 1100-1248px module caps on ultra-wide screens. */
  body.pc-home > main .container,
  body.pc-labels > main .container,
  body.pc-bags > main .container,
  body.pc-boxes > main .container,
  body.pc-about > main .container,
  body.pc-news > main .container,
  body.pc-news-detail > main .container,
  body.pc-contact > main .container{
    width:var(--page-content-width) !important;
    max-width:100% !important;
    min-width:0;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box;
  }

  body.pc-home > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-labels > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-bags > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-boxes > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-about > main > :is(.hero,.hero--home,.hero--inner,.about-upload-hero,.about-culture-section),
  body.pc-news > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-news-detail > main > :is(.hero,.hero--home,.hero--inner),
  body.pc-contact > main > :is(.hero,.hero--home,.hero--inner,.contact-thanks-section){
    width:100% !important;
    max-width:100% !important;
  }

  /* Major nested visual modules may fill content width, never body width. */
  body.pc-home > main :is(
    .product-center-block,
    .product-masonry,
    .service-cta,
    .workshop-grid,
    .walkin-block,
    .walkin-hero,
    .culture-banner
  ),
  body.pc-labels > main :is(
    .labels-material-list,
    .labels-service-flow,
    .labels-guarantee-grid,
    .labels-team-gallery,
    .labels-team-benefits
  ),
  body.pc-bags > main :is(
    .tech-compare,
    .app-section,
    .bags-benefits-grid
  ),
  body.pc-boxes > main :is(
    .boxes-quality-row,
    .boxes-promise-panel,
    .boxes-detail-grid--reference,
    .boxes-detail-cta,
    .bags-benefits-grid
  ){
    width:100%;
    max-width:100% !important;
    min-width:0;
    box-sizing:border-box;
  }

  .site-header .site-logo-img{
    width:225px;
    height:68px;
  }

  .site-header .header-phone{
    min-width:235px;
    height:50px;
    padding-left:12px;
    padding-right:14px;
  }

  .site-header .header-phone .label{
    font-size:25px;
  }

  .site-nav .main-nav a{
    padding-left:14px;
    padding-right:14px;
    font-size:17px;
  }

  /* Shared typography: avoid tiny 13-14px copy on a true 4K CSS viewport. */
  body.pc-home .section-head h2,
  body.pc-labels .section-head h2,
  body.pc-bags .section-head h2,
  body.pc-boxes .section-head h2,
  body.pc-about .section-head h2,
  body.pc-news .section-head h2,
  body.pc-contact .section-head h2{
    font-size:clamp(36px,1.15vw,44px);
  }

  body.pc-home .eyebrow,
  body.pc-labels .eyebrow,
  body.pc-bags .eyebrow,
  body.pc-boxes .eyebrow,
  body.pc-about .eyebrow,
  body.pc-news .eyebrow,
  body.pc-contact .eyebrow{
    font-size:clamp(15px,.5vw,18px);
  }

  body.pc-home .section,
  body.pc-labels .section,
  body.pc-bags .section,
  body.pc-boxes .section,
  body.pc-about .section,
  body.pc-news .section,
  body.pc-contact .section{
    padding-top:clamp(68px,2.2vw,86px);
    padding-bottom:clamp(68px,2.2vw,86px);
  }

  /* Homepage-specific scale correction visible in the supplied 4K capture. */
  body.pc-home main > .section:first-of-type .container.two-col{
    max-width:100% !important;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:clamp(56px,2.3vw,90px);
  }

  body.pc-home main > .section:first-of-type .reveal:first-child h2{
    font-size:clamp(36px,1.05vw,42px) !important;
  }

  body.pc-home main > .section:first-of-type .reveal:first-child p{
    font-size:clamp(16px,.5vw,18px) !important;
    line-height:1.9 !important;
  }

  body.pc-home .product-section .pm-card,
  body.pc-home .product-section .pm-02 .text,
  body.pc-home .product-section .pm-03 .text,
  body.pc-home .product-section .pm-04 .text{
    padding:clamp(38px,1.3vw,52px) clamp(42px,1.5vw,60px);
  }

  body.pc-home .product-section .pm-card .num{
    font-size:clamp(29px,.9vw,34px);
  }

  body.pc-home .product-section .pm-card h3{
    font-size:clamp(22px,.7vw,26px);
  }

  body.pc-home .product-section .pm-card p{
    font-size:clamp(15px,.48vw,17px);
  }

  body.pc-home .service-cta{
    min-height:clamp(310px,10vw,390px);
    padding:clamp(48px,1.6vw,64px) clamp(60px,2vw,82px);
  }

  body.pc-home .service-cta-copy h3{
    font-size:clamp(29px,.95vw,35px);
  }

  body.pc-home .service-cta-copy p,
  body.pc-home .service-cta-feature p{
    font-size:clamp(14px,.45vw,16px);
  }

  body.pc-home .service-cta-feature h4{
    font-size:clamp(18px,.58vw,21px);
  }

  body.pc-home .workshop-head h2{
    font-size:clamp(36px,1.1vw,42px);
  }

  body.pc-home .workshop-grid{
    column-gap:clamp(28px,1.2vw,46px);
    row-gap:clamp(38px,1.5vw,56px);
  }

  body.pc-home .workshop-copy h3{
    font-size:clamp(18px,.6vw,22px);
  }

  body.pc-home .workshop-copy p{
    font-size:clamp(14px,.46vw,16px);
  }

  body.pc-home .walkin-hero{
    min-height:clamp(620px,18vw,760px);
  }

  body.pc-home .walkin-copy{
    width:min(520px,31%);
    left:clamp(110px,6%,180px);
    top:clamp(100px,3vw,140px);
  }

  body.pc-home .walkin-copy h2{
    font-size:clamp(30px,.95vw,36px);
  }

  body.pc-home .walkin-desc{
    width:min(500px,100%);
  }

  body.pc-home .walkin-desc p{
    font-size:clamp(15px,.48vw,17px);
  }

  body.pc-home .walkin-block + .stats .n{
    font-size:clamp(30px,.95vw,36px);
  }

  body.pc-home .walkin-block + .stats .l{
    font-size:clamp(13px,.42vw,15px);
  }

  body.pc-home .culture-banner--light{
    padding:clamp(34px,1.2vw,48px) clamp(80px,3vw,120px) clamp(40px,1.4vw,56px);
  }

  body.pc-home .culture-banner--light > h2{
    font-size:clamp(34px,1.05vw,40px);
  }

  body.pc-home .culture-grid .glass-card h4{
    font-size:clamp(17px,.55vw,20px);
  }

  body.pc-home .culture-grid .glass-card p{
    font-size:clamp(12px,.4vw,14px);
  }

  /* Footer should visually match the enlarged body instead of shrinking. */
  .site-footer .footer-grid{
    gap:clamp(44px,2vw,76px);
  }

  .site-footer .footer-col h5{
    font-size:clamp(17px,.55vw,20px);
  }

  .site-footer .footer-col p,
  .site-footer .footer-contact-sub{
    font-size:clamp(13px,.42vw,15px);
    line-height:1.85;
  }

  .site-footer .footer-contact-row{
    font-size:clamp(15px,.48vw,17px);
  }
}


/* 4K typography and spacing rebalance v105 */
@media (min-width:3200px){
  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    --page-body-width:min(94vw,calc(100vw - 96px));
    --page-content-width:min(86vw,calc(var(--page-body-width) - 144px));
    --header-bar-height:88px;
  }

  body.pc-home,
  body.pc-labels,
  body.pc-bags,
  body.pc-boxes,
  body.pc-about,
  body.pc-news,
  body.pc-news-detail,
  body.pc-contact{
    width:var(--page-body-width) !important;
    max-width:100vw !important;
  }

  body.pc-home > main,
  body.pc-labels > main,
  body.pc-bags > main,
  body.pc-boxes > main,
  body.pc-about > main,
  body.pc-news > main,
  body.pc-news-detail > main,
  body.pc-contact > main{
    width:100% !important;
    max-width:100% !important;
  }

  body.pc-home > main > section > .container,
  body.pc-labels > main > section > .container,
  body.pc-bags > main > section > .container,
  body.pc-boxes > main > section > .container,
  body.pc-about > main > section > .container,
  body.pc-news > main > section > .container,
  body.pc-news-detail > main > section > .container,
  body.pc-contact > main > section > .container{
    width:var(--page-content-width) !important;
    max-width:calc(100% - 96px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.pc-home > .site-header > .container,
  body.pc-labels > .site-header > .container,
  body.pc-bags > .site-header > .container,
  body.pc-boxes > .site-header > .container,
  body.pc-about > .site-header > .container,
  body.pc-news > .site-header > .container,
  body.pc-news-detail > .site-header > .container,
  body.pc-contact > .site-header > .container,
  body.pc-home > .site-footer > .container,
  body.pc-labels > .site-footer > .container,
  body.pc-bags > .site-footer > .container,
  body.pc-boxes > .site-footer > .container,
  body.pc-about > .site-footer > .container,
  body.pc-news > .site-footer > .container,
  body.pc-news-detail > .site-footer > .container,
  body.pc-contact > .site-footer > .container,
  body.pc-home .footer-bottom > .container,
  body.pc-labels .footer-bottom > .container,
  body.pc-bags .footer-bottom > .container,
  body.pc-boxes .footer-bottom > .container,
  body.pc-about .footer-bottom > .container,
  body.pc-news .footer-bottom > .container,
  body.pc-news-detail .footer-bottom > .container,
  body.pc-contact .footer-bottom > .container{
    width:var(--page-content-width) !important;
    max-width:calc(100% - 96px) !important;
  }

  /* Global 4K type scale */
  body.pc-home .section-head,
  body.pc-labels .section-head,
  body.pc-bags .section-head,
  body.pc-boxes .section-head,
  body.pc-about .section-head,
  body.pc-news .section-head,
  body.pc-contact .section-head{
    margin-bottom:32px;
  }

  body.pc-home .section-head h2,
  body.pc-labels .section-head h2,
  body.pc-bags .section-head h2,
  body.pc-boxes .section-head h2,
  body.pc-about .section-head h2,
  body.pc-news .section-head h2,
  body.pc-contact .section-head h2{
    font-size:44px !important;
    line-height:1.32;
  }

  body.pc-home .eyebrow,
  body.pc-labels .eyebrow,
  body.pc-bags .eyebrow,
  body.pc-boxes .eyebrow,
  body.pc-about .eyebrow,
  body.pc-news .eyebrow,
  body.pc-contact .eyebrow{
    margin-top:10px;
    font-size:18px !important;
    line-height:1.65;
  }

  body.pc-home .section,
  body.pc-labels .section,
  body.pc-bags .section,
  body.pc-boxes .section,
  body.pc-about .section,
  body.pc-news .section,
  body.pc-contact .section{
    padding-top:64px !important;
    padding-bottom:64px !important;
  }

  body.pc-home .section--tight,
  body.pc-labels .section--tight,
  body.pc-bags .section--tight,
  body.pc-boxes .section--tight{
    padding-top:48px !important;
    padding-bottom:48px !important;
  }

  .site-header .site-logo-img{
    width:260px !important;
    height:76px !important;
  }

  .site-header .header-phone{
    min-width:270px !important;
    height:56px !important;
    padding-left:14px !important;
    padding-right:16px !important;
  }

  .site-header .header-phone .label{
    font-size:29px !important;
  }

  .site-nav .main-nav a{
    padding:10px 16px !important;
    font-size:20px !important;
  }

  /* Homepage: tighter vertical rhythm, larger readable content */
  body.pc-home main > .section:first-of-type .container.two-col{
    width:var(--page-content-width) !important;
    max-width:calc(100% - 96px) !important;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) !important;
    gap:72px !important;
    align-items:center;
  }

  body.pc-home main > .section:first-of-type .reveal:first-child h2{
    margin-bottom:18px !important;
    font-size:42px !important;
    line-height:1.35 !important;
  }

  body.pc-home main > .section:first-of-type .reveal:first-child p{
    font-size:18px !important;
    line-height:1.9 !important;
  }

  body.pc-home .social-cta-list{
    margin-top:22px !important;
    gap:14px !important;
  }

  body.pc-home .social-cta{
    min-height:48px;
    padding:12px 16px;
    font-size:16px;
  }

  body.pc-home .product-section > .container,
  body.pc-home .workshop-section > .container,
  body.pc-home .walkin-section > .container,
  body.pc-home main > .section:last-of-type > .container{
    width:var(--page-content-width) !important;
    max-width:calc(100% - 96px) !important;
  }

  body.pc-home .product-section .pm-card,
  body.pc-home .product-section .pm-02 .text,
  body.pc-home .product-section .pm-03 .text,
  body.pc-home .product-section .pm-04 .text{
    padding:40px 48px !important;
  }

  body.pc-home .product-section .pm-card .num{
    font-size:32px !important;
  }

  body.pc-home .product-section .pm-card h3{
    margin-top:8px;
    margin-bottom:12px;
    font-size:25px !important;
    line-height:1.4;
  }

  body.pc-home .product-section .pm-card p{
    font-size:17px !important;
    line-height:1.8 !important;
  }

  body.pc-home .service-cta{
    min-height:300px !important;
    padding:44px 58px !important;
  }

  body.pc-home .service-cta-copy h3{
    font-size:32px !important;
  }

  body.pc-home .service-cta-copy p{
    font-size:16px !important;
    line-height:1.75;
  }

  body.pc-home .service-cta-feature h4{
    font-size:20px !important;
  }

  body.pc-home .service-cta-feature p{
    font-size:15px !important;
    line-height:1.6;
  }

  body.pc-home .workshop-head{
    margin-bottom:30px !important;
  }

  body.pc-home .workshop-head h2{
    font-size:42px !important;
  }

  body.pc-home .workshop-grid{
    column-gap:32px !important;
    row-gap:34px !important;
  }

  body.pc-home .workshop-copy{
    padding-top:14px !important;
  }

  body.pc-home .workshop-copy h3{
    font-size:21px !important;
    line-height:1.45;
  }

  body.pc-home .workshop-copy p{
    margin-top:8px;
    font-size:16px !important;
    line-height:1.75 !important;
  }

  body.pc-home .walkin-section{
    padding-top:58px !important;
    padding-bottom:58px !important;
  }

  body.pc-home .walkin-hero{
    min-height:680px !important;
  }

  body.pc-home .walkin-copy{
    width:min(560px,32%) !important;
    left:120px !important;
    top:100px !important;
  }

  body.pc-home .walkin-copy h2{
    font-size:34px !important;
  }

  body.pc-home .walkin-desc{
    width:min(540px,100%) !important;
  }

  body.pc-home .walkin-desc p{
    font-size:17px !important;
    line-height:1.8 !important;
  }

  body.pc-home .walkin-block .sample-swiper--source{
    width:calc(100% - 220px) !important;
    margin-top:-86px !important;
  }

  body.pc-home .walkin-block + .stats{
    margin-top:70px !important;
    gap:18px !important;
  }

  body.pc-home .walkin-block + .stats .n{
    font-size:34px !important;
  }

  body.pc-home .walkin-block + .stats .l{
    margin-top:6px;
    font-size:15px !important;
  }

  body.pc-home .culture-banner--light{
    padding:30px 80px 38px !important;
  }

  body.pc-home .culture-banner--light > h2{
    font-size:38px !important;
  }

  body.pc-home .culture-grid{
    gap:16px !important;
    margin-top:22px !important;
  }

  body.pc-home .culture-banner--light .glass-card{
    padding:22px 14px !important;
  }

  body.pc-home .culture-grid .glass-card h4{
    font-size:19px !important;
  }

  body.pc-home .culture-grid .glass-card p{
    margin-top:6px;
    font-size:14px !important;
    line-height:1.65;
  }

  /* About / product / news / contact shared 4K text readability */
  body.pc-labels main p,
  body.pc-bags main p,
  body.pc-boxes main p,
  body.pc-about main p,
  body.pc-news main p,
  body.pc-contact main p{
    font-size:max(16px,1em);
  }

  body.pc-news-detail .news-detail-article{
    max-width:min(1500px,60vw) !important;
  }

  body.pc-news-detail .news-detail-header h1{
    font-size:40px !important;
  }

  body.pc-news-detail .news-detail-body{
    font-size:19px !important;
    line-height:1.95 !important;
  }

  body.pc-news-detail .news-detail-body h2{
    font-size:27px !important;
  }

  /* Footer: larger type, but less empty vertical space */
  .site-footer{
    padding-top:42px !important;
  }

  .site-footer .footer-nav{
    margin-bottom:30px !important;
  }

  .site-footer .footer-nav-links a{
    font-size:15px !important;
  }

  .site-footer .footer-grid{
    gap:54px !important;
    padding-bottom:36px !important;
  }

  .site-footer .footer-col h5{
    margin-bottom:14px !important;
    font-size:20px !important;
  }

  .site-footer .footer-col p,
  .site-footer .footer-contact-sub{
    font-size:15px !important;
    line-height:1.8 !important;
  }

  .site-footer .footer-contact-row{
    font-size:17px !important;
  }

  .site-footer .footer-qr{
    width:128px !important;
    height:128px !important;
  }

  .footer-bottom{
    padding-top:12px !important;
    padding-bottom:12px !important;
    font-size:14px !important;
  }
}

/* R48: screenshot-matched PC homepage hero copy.
   Two white title lines + three vertical white selling-point pills. */
@media (min-width:901px){
  body.pc-home .hero--home .swiper-slide > .container{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  body.pc-home .hero--home .scrim{
    background:linear-gradient(90deg,rgba(0,164,222,.94) 0%,rgba(0,164,222,.88) 36%,rgba(0,164,222,.50) 58%,rgba(0,164,222,.13) 76%,rgba(0,164,222,0) 88%);
  }
  body.pc-home .hero--home .hero-text--slide-1{
    width:auto;
    max-width:none;
    margin-left:clamp(52px,8vw,168px);
    margin-right:clamp(36px,6vw,120px);
  }
  body.pc-home .hero--home .hero-title{
    margin:0;
    color:#fff;
    font-weight:500;
    letter-spacing:-.035em;
    text-shadow:0 2px 5px rgba(0,74,120,.20);
  }
  body.pc-home .hero--home .hero-title-primary,
  body.pc-home .hero--home .hero-title-secondary{display:block;}
  body.pc-home .hero--home .hero-title-primary{
    font-size:clamp(48px,3.8vw,68px);
    line-height:1.05;
  }
  body.pc-home .hero--home .hero-title-secondary{
    margin-top:12px;
    font-size:clamp(32px,2.55vw,46px);
    line-height:1.12;
    letter-spacing:-.025em;
    white-space:nowrap;
  }
  body.pc-home .hero--home .hero-badges{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    flex-wrap:nowrap;
    gap:10px;
    margin-top:clamp(30px,3vw,42px);
  }
  body.pc-home .hero--home .hero-badge{
    display:inline-flex;
    width:max-content;
    min-height:42px;
    align-items:center;
    gap:10px;
    padding:6px 18px 6px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.96);
    box-shadow:0 1px 2px rgba(0,75,120,.08);
    color:#40506a;
    font-size:clamp(16px,1.18vw,19px);
    font-weight:400;
    line-height:1.25;
    opacity:1;
    text-shadow:none;
  }
  body.pc-home .hero--home .hero-badge i{
    width:30px;
    min-width:30px;
    flex:0 0 30px;
    font-size:27px;
    line-height:1;
    color:#3d48a8;
    text-align:center;
  }
  body.pc-home .hero--home .hero-badge img{
    width:30px;
    height:30px;
    flex:0 0 30px;
    object-fit:contain;
  }
}
@media (min-width:901px) and (max-width:1180px){
  body.pc-home .hero--home .hero-text--slide-1{margin-left:clamp(40px,6vw,72px);}
  body.pc-home .hero--home .hero-title-primary{font-size:46px;}
  body.pc-home .hero--home .hero-title-secondary{font-size:30px;}
  body.pc-home .hero--home .hero-badge{font-size:15px;min-height:40px;}
}

/* ==========================================================================
   Product detail v40 — current Jinya visual system
   ========================================================================== */
.pc-product-detail{
  background:#f5f7fa;
}
.product-detail-page{
  min-height:100vh;
  background:linear-gradient(180deg,#f5f7fa 0,#fff 520px);
  color:var(--ink);
}
.jpd-page{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding:30px 0 72px;
}
.jpd-breadcrumb{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:32px;
  margin-bottom:22px;
  color:#98a1ad;
  font-size:13px;
  line-height:1.6;
}
.jpd-breadcrumb a{color:#6f7b88;transition:color .2s var(--ease);}
.jpd-breadcrumb a:hover{color:var(--blue);}
.jpd-breadcrumb strong{max-width:48vw;color:#7a8490;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.jpd-product-hero{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:54px;
  align-items:start;
  padding:32px;
  border:1px solid #edf0f4;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 55px rgba(15,38,68,.07);
}
.jpd-gallery{min-width:0;}
.jpd-gallery-stage{
  position:relative;
  overflow:hidden;
  border:1px solid #edf0f4;
  border-radius:18px;
  background:linear-gradient(145deg,#fafbfc,#f2f4f7);
}
.jpd-gallery-main{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  aspect-ratio:1.08/1;
  padding:24px;
}
.jpd-gallery-main img,
.jpd-gallery-main video{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:12px;
}
.jpd-gallery-placeholder{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  color:#a9b1bb;
  font-size:14px;
}
.jpd-gallery-placeholder i{font-size:46px;color:#c3c9d1;}
.jpd-gallery-zoom{
  position:absolute;
  right:16px;
  bottom:16px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 13px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#566170;
  font-size:12px;
  cursor:pointer;
  box-shadow:0 7px 22px rgba(15,23,42,.08);
  backdrop-filter:blur(8px);
}
.jpd-gallery-zoom:hover{color:var(--blue);border-color:rgba(0,145,205,.25);}
.jpd-gallery-thumbs{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.jpd-gallery-thumb{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:1/1;
  padding:4px;
  overflow:hidden;
  border:1px solid #e5e9ef;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease);
}
.jpd-gallery-thumb:hover{transform:translateY(-2px);border-color:#9dcfe4;}
.jpd-gallery-thumb.is-active{
  border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(0,145,205,.10);
}
.jpd-gallery-thumb img{width:100%;height:100%;object-fit:cover;border-radius:7px;}
.jpd-video-thumb{display:grid;place-items:center;width:100%;height:100%;border-radius:7px;background:#e9eef4;color:var(--blue);font-size:26px;}

.jpd-product-info{
  position:relative;
  min-width:0;
  padding:8px 4px 0;
}
.jpd-product-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
.jpd-product-kicker span{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 11px;
  border-radius:999px;
  background:#eaf7fc;
  color:#0786ba;
  font-size:12px;
  font-weight:700;
}
.jpd-product-kicker em{
  color:#a0a8b2;
  font-size:11px;
  font-style:normal;
  letter-spacing:.16em;
}
.jpd-product-info h1{
  margin:0;
  color:#202a36;
  font-size:clamp(34px,2.55vw,44px);
  font-weight:700;
  line-height:1.22;
  letter-spacing:-.035em;
}
.jpd-product-subtitle{
  margin:13px 0 0;
  color:#5e6a78;
  font-size:18px;
  line-height:1.6;
}
.jpd-product-summary{
  margin:20px 0 0;
  color:#657180;
  font-size:14px;
  line-height:1.95;
}
.jpd-product-meta{
  display:flex;
  flex-wrap:wrap;
  gap:9px 18px;
  margin-top:20px;
  padding:14px 16px;
  border-radius:12px;
  background:#f7f9fb;
}
.jpd-product-meta span{
  display:flex;
  gap:8px;
  color:#67717e;
  font-size:12.5px;
}
.jpd-product-meta b{color:#303b48;font-weight:700;}
.jpd-summary-card{
  margin-top:20px;
  overflow:hidden;
  border:1px solid #e8edf2;
  border-radius:14px;
}
.jpd-summary-card-title{
  display:flex;
  align-items:baseline;
  gap:10px;
  padding:13px 16px;
  border-bottom:1px solid #edf0f3;
  background:#fbfcfd;
}
.jpd-summary-card-title span{color:#8d98a4;font-size:10px;letter-spacing:.14em;}
.jpd-summary-card-title strong{color:#34404d;font-size:14px;}
.jpd-summary-parameters{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin:0;
}
.jpd-summary-parameter{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
  padding:12px 16px;
  border-bottom:1px solid #f0f2f5;
}
.jpd-summary-parameter:nth-child(odd){border-right:1px solid #f0f2f5;}
.jpd-summary-parameter:nth-last-child(-n+2){border-bottom:0;}
.jpd-summary-parameter dt{color:#8a94a1;font-size:12px;}
.jpd-summary-parameter dd{
  margin:0;
  color:#313d4b;
  font-size:13px;
  font-weight:700;
  text-align:right;
  overflow-wrap:anywhere;
}
.jpd-summary-parameter small{margin-left:3px;color:#7d8793;font-size:11px;font-weight:500;}
.jpd-service-points{
  display:flex;
  flex-wrap:wrap;
  gap:9px 18px;
  margin-top:20px;
  color:#5e6977;
  font-size:12.5px;
}
.jpd-service-points i{margin-right:5px;color:#08a4c8;}
.jpd-product-actions{
  display:flex;
  gap:12px;
  margin-top:22px;
}
.jpd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:0 25px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:14px;
  font-weight:700;
  line-height:1;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);
}
.jpd-btn:hover{transform:translateY(-2px);}
.jpd-btn-primary{
  min-width:150px;
  background:#f48101;
  color:#fff;
  box-shadow:0 10px 24px rgba(244,129,1,.20);
}
.jpd-btn-primary:hover{background:#e87500;color:#fff;box-shadow:0 13px 28px rgba(244,129,1,.26);}
.jpd-btn-secondary{
  min-width:138px;
  border-color:#dce2e8;
  background:#fff;
  color:#34404d;
}
.jpd-btn-secondary:hover{border-color:#aab6c2;color:var(--blue);}
.jpd-action-note{
  margin:14px 0 0;
  color:#9aa3ad;
  font-size:11.5px;
  line-height:1.6;
}
.jpd-action-note i{margin-right:4px;color:#91a1af;}

.jpd-detail-nav{
  position:sticky;
  top:74px;
  z-index:20;
  margin:26px 0 0;
  border:1px solid #e9edf2;
  border-radius:14px;
  background:rgba(255,255,255,.94);
  box-shadow:0 9px 26px rgba(15,38,68,.06);
  backdrop-filter:blur(12px);
}
.jpd-detail-nav-inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:34px;
  min-height:58px;
  padding:0 24px;
  overflow-x:auto;
}
.jpd-detail-nav a{
  position:relative;
  flex:0 0 auto;
  padding:20px 2px 17px;
  color:#5e6976;
  font-size:13px;
  font-weight:600;
}
.jpd-detail-nav a::after{
  content:"";
  position:absolute;
  left:50%;
  right:50%;
  bottom:0;
  height:2px;
  background:#f48101;
  transition:left .2s var(--ease),right .2s var(--ease);
}
.jpd-detail-nav a:hover{color:#222d39;}
.jpd-detail-nav a:hover::after{left:0;right:0;}

.jpd-section{
  scroll-margin-top:155px;
  margin-top:62px;
}
.jpd-section-heading{
  margin-bottom:28px;
  text-align:center;
}
.jpd-section-heading>span,
.jpd-section-heading>div>span{
  display:block;
  margin-bottom:8px;
  color:#0a9ac7;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
}
.jpd-section-heading h2{
  margin:0;
  color:#27323e;
  font-size:30px;
  font-weight:700;
  letter-spacing:.02em;
}
.jpd-section-heading p{
  max-width:640px;
  margin:10px auto 0;
  color:#89939f;
  font-size:13px;
  line-height:1.75;
}
.jpd-section-heading-row{
  display:flex;
  align-items:end;
  justify-content:space-between;
  text-align:left;
}
.jpd-section-heading-row>div{text-align:left;}

.jpd-introduction{
  padding:44px;
  border-radius:22px;
  background:#f8fafb;
}
.jpd-intro-row{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  gap:46px;
  align-items:center;
  padding:28px 0;
}
.jpd-intro-row:first-of-type{padding-top:0;}
.jpd-intro-row:last-child{padding-bottom:0;}
.jpd-intro-row.is-reverse .jpd-rich-text{order:2;}
.jpd-intro-row.is-reverse figure{order:1;}
.jpd-intro-row.is-text-only{display:block;}
.jpd-intro-row figure{
  margin:0;
  overflow:hidden;
  border-radius:16px;
  background:#edf1f4;
}
.jpd-intro-row figure img{display:block;width:100%;aspect-ratio:1.34/1;object-fit:cover;}
.jpd-rich-text,
.jpd-rich-panel{
  color:#63707e;
  font-size:14px;
  line-height:2;
}
.jpd-rich-text h3,
.jpd-rich-panel h2,
.jpd-rich-panel h3{
  margin:0 0 14px;
  color:#2d3946;
  font-size:22px;
  line-height:1.45;
}
.jpd-rich-text p,.jpd-rich-panel p{margin:0 0 13px;}
.jpd-rich-text ul,.jpd-rich-panel ul,.jpd-rich-text ol,.jpd-rich-panel ol{padding-left:20px;margin:12px 0;}
.jpd-rich-text img,.jpd-rich-panel img{max-width:100%;height:auto;border-radius:12px;}
.jpd-intro-subtitle{color:#0a9ac7!important;font-size:12px!important;letter-spacing:.08em;}
.jpd-rich-panel{
  padding:32px;
  border:1px solid #edf0f3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 30px rgba(15,38,68,.04);
}

.jpd-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.jpd-feature-card{
  position:relative;
  min-height:150px;
  padding:26px 24px 22px;
  overflow:hidden;
  border:1px solid #e8edf1;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,38,68,.04);
}
.jpd-feature-card em{
  position:absolute;
  right:18px;
  top:10px;
  color:#edf2f5;
  font-size:48px;
  font-style:normal;
  font-weight:800;
  line-height:1;
}
.jpd-feature-card i{position:relative;color:#0aa2c8;font-size:22px;}
.jpd-feature-card p{position:relative;margin:20px 0 0;color:#566372;font-size:14px;line-height:1.75;}

.jpd-parameter-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.jpd-parameter-group{
  overflow:hidden;
  border:1px solid #e7ecf1;
  border-radius:16px;
  background:#fff;
}
.jpd-parameter-group h3{
  margin:0;
  padding:15px 20px;
  border-bottom:1px solid #eaf0f3;
  background:#f7fafb;
  color:#33404d;
  font-size:15px;
}
.jpd-parameter-group dl{margin:0;}
.jpd-parameter-group dl div{
  display:grid;
  grid-template-columns:140px 1fr;
  min-height:48px;
  border-bottom:1px solid #f0f2f4;
}
.jpd-parameter-group dl div:last-child{border-bottom:0;}
.jpd-parameter-group dt,
.jpd-parameter-group dd{
  display:flex;
  align-items:center;
  margin:0;
  padding:11px 16px;
  font-size:13px;
}
.jpd-parameter-group dt{background:#fbfcfd;color:#7b8693;}
.jpd-parameter-group dd{color:#34404c;font-weight:600;}
.jpd-parameter-group small{margin-left:4px;color:#8a94a0;font-size:11px;}

.jpd-application-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.jpd-application-card{
  min-height:126px;
  padding:21px;
  border-radius:15px;
  background:linear-gradient(145deg,#f6fbfd,#eef8fb);
  border:1px solid #dff0f5;
}
.jpd-application-card span{color:#9bcbd8;font-size:24px;font-weight:800;}
.jpd-application-card p{margin:15px 0 0;color:#53616f;font-size:13px;line-height:1.75;}

.jpd-process-list{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  padding:0;
  margin:0;
  list-style:none;
}
.jpd-process-list li{
  position:relative;
  min-height:190px;
  padding:24px 20px;
  border:1px solid #e8edf1;
  border-radius:16px;
  background:#fff;
}
.jpd-process-list li::after{
  content:"";
  position:absolute;
  top:43px;
  left:calc(100% + 4px);
  width:7px;
  height:1px;
  background:#b9c6cf;
}
.jpd-process-list li:last-child::after{display:none;}
.jpd-process-number{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:#eef8fb;
  color:#089bc5;
  font-size:12px;
  font-weight:800;
}
.jpd-process-list h3{margin:18px 0 0;color:#35414e;font-size:15px;}
.jpd-process-list p{margin:9px 0 0;color:#7a8591;font-size:12.5px;line-height:1.75;}
.jpd-process-list figure{margin:16px 0 0;overflow:hidden;border-radius:9px;}
.jpd-process-list figure img{display:block;width:100%;aspect-ratio:1.5/1;object-fit:cover;}

.jpd-note-list{display:grid;gap:12px;}
.jpd-note-list article{
  display:flex;
  gap:14px;
  padding:18px 20px;
  border-left:3px solid #f3a64f;
  border-radius:10px;
  background:#fff9f2;
}
.jpd-note-list i{margin-top:4px;color:#f48101;}
.jpd-note-list h3{margin:0 0 6px;color:#37424e;font-size:14px;}
.jpd-note-list p{margin:0;color:#6f7a86;font-size:13px;line-height:1.7;}
.jpd-custom-sections{display:grid;gap:18px;}
.jpd-custom-image{display:block;width:100%;margin:16px 0 0;}

.jpd-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:38px;
  padding:38px 44px;
  border-radius:22px;
  background:linear-gradient(120deg,#058fbc 0%,#08a9cf 48%,#22b7d1 100%);
  color:#fff;
  box-shadow:0 16px 42px rgba(0,137,185,.18);
}
.jpd-cta-copy>span{display:block;margin-bottom:8px;color:rgba(255,255,255,.72);font-size:10px;letter-spacing:.18em;}
.jpd-cta h2{margin:0;color:#fff;font-size:28px;}
.jpd-cta p{max-width:650px;margin:10px 0 0;color:rgba(255,255,255,.84);font-size:13px;line-height:1.8;}
.jpd-cta-hotline{display:flex;align-items:center;gap:9px;margin-top:16px;color:#fff;}
.jpd-cta-hotline i{font-size:18px;}
.jpd-cta-hotline span{font-size:12px;opacity:.72;}
.jpd-cta-hotline strong{font-size:20px;letter-spacing:.02em;}
.jpd-cta-actions{display:flex;gap:10px;flex:0 0 auto;}
.jpd-btn-light{background:#fff;color:#078caf;}
.jpd-btn-outline-light{border-color:rgba(255,255,255,.5);color:#fff;background:transparent;}
.jpd-btn-light:hover{color:#078caf;box-shadow:0 10px 24px rgba(0,0,0,.12);}
.jpd-btn-outline-light:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08);}

.jpd-more-link{display:inline-flex;align-items:center;gap:7px;color:#687482;font-size:13px;}
.jpd-more-link:hover{color:#f48101;}
.jpd-related-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.jpd-related-card{
  overflow:hidden;
  border:1px solid #e8edf2;
  border-radius:16px;
  background:#fff;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.jpd-related-card:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(15,38,68,.09);}
.jpd-related-image{
  display:block;
  overflow:hidden;
  aspect-ratio:1.18/1;
  background:#f3f5f7;
}
.jpd-related-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s var(--ease);}
.jpd-related-card:hover .jpd-related-image img{transform:scale(1.045);}
.jpd-related-placeholder{display:grid;place-items:center;width:100%;height:100%;color:#b3bbc5;font-size:34px;}
.jpd-related-body{padding:18px;}
.jpd-related-body h3{margin:0;color:#303b47;font-size:16px;line-height:1.5;}
.jpd-related-body h3 a{color:inherit;}
.jpd-related-body p{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  min-height:42px;
  margin:9px 0 0;
  color:#818b96;
  font-size:12px;
  line-height:1.7;
}
.jpd-related-link{display:inline-flex;align-items:center;gap:7px;margin-top:13px;color:#0b9cc3;font-size:12px;font-weight:600;}

.jpd-product-nav{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:20px;
  align-items:center;
  margin-top:52px;
  padding:22px 0 0;
  border-top:1px solid #e8edf1;
}
.jpd-product-nav-item{min-width:0;}
.jpd-product-nav-item span{display:block;margin-bottom:6px;color:#a0a9b2;font-size:11px;}
.jpd-product-nav-item a,
.jpd-product-nav-item em{
  display:block;
  overflow:hidden;
  color:#52606d;
  font-size:13px;
  font-style:normal;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.jpd-product-nav-item a:hover{color:var(--blue);}
.jpd-product-nav-next{text-align:right;}
.jpd-product-nav-back{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:10px 15px;
  border-radius:999px;
  background:#f2f5f7;
  color:#65717d;
  font-size:12px;
}

.jpd-media-preview{
  position:fixed;
  inset:0;
  z-index:10010;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:44px;
  background:rgba(5,13,23,.86);
  backdrop-filter:blur(5px);
}
.jpd-media-preview[hidden]{display:none!important;}
.jpd-media-preview-content{
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(1120px,90vw);
  height:min(780px,82vh);
}
.jpd-media-preview-content img,
.jpd-media-preview-content video{
  display:block;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  border-radius:10px;
}
.jpd-media-preview-close{
  position:absolute;
  right:30px;
  top:25px;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:18px;
  cursor:pointer;
}

@media (max-width:1100px){
  .jpd-product-hero{grid-template-columns:minmax(0,1fr) minmax(340px,.9fr);gap:34px;padding:26px;}
  .jpd-gallery-thumbs{grid-template-columns:repeat(5,minmax(0,1fr));}
  .jpd-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .jpd-application-grid,.jpd-process-list{grid-template-columns:repeat(2,minmax(0,1fr));}
  .jpd-process-list li:nth-child(2n)::after{display:none;}
  .jpd-related-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:820px){
  .jpd-page{width:min(100% - 28px,720px);padding-top:20px;}
  .jpd-product-hero{grid-template-columns:1fr;gap:28px;padding:20px;border-radius:18px;}
  .jpd-gallery-main{aspect-ratio:1.15/1;padding:16px;}
  .jpd-product-info{padding:0;}
  .jpd-product-info h1{font-size:31px;}
  .jpd-detail-nav{top:62px;}
  .jpd-detail-nav-inner{justify-content:flex-start;gap:24px;}
  .jpd-introduction{padding:26px;}
  .jpd-intro-row{grid-template-columns:1fr;gap:22px;}
  .jpd-intro-row.is-reverse .jpd-rich-text,
  .jpd-intro-row.is-reverse figure{order:initial;}
  .jpd-parameter-groups{grid-template-columns:1fr;}
  .jpd-cta{align-items:flex-start;flex-direction:column;padding:30px;}
}
@media (max-width:560px){
  .jpd-page{width:calc(100% - 20px);padding-bottom:48px;}
  .jpd-breadcrumb{font-size:12px;}
  .jpd-product-hero{padding:14px;}
  .jpd-gallery-stage{border-radius:13px;}
  .jpd-gallery-thumbs{grid-template-columns:repeat(4,minmax(0,1fr));}
  .jpd-gallery-zoom span{display:none;}
  .jpd-product-info h1{font-size:27px;}
  .jpd-product-subtitle{font-size:16px;}
  .jpd-summary-parameters{grid-template-columns:1fr;}
  .jpd-summary-parameter:nth-child(odd){border-right:0;}
  .jpd-summary-parameter:nth-last-child(-n+2){border-bottom:1px solid #f0f2f5;}
  .jpd-summary-parameter:last-child{border-bottom:0;}
  .jpd-product-actions{flex-direction:column;}
  .jpd-btn{width:100%;}
  .jpd-detail-nav-inner{min-height:52px;padding:0 16px;}
  .jpd-detail-nav a{padding:17px 0 14px;}
  .jpd-section{margin-top:46px;}
  .jpd-section-heading h2{font-size:25px;}
  .jpd-introduction{padding:20px 16px;}
  .jpd-rich-panel{padding:22px 18px;}
  .jpd-feature-grid,.jpd-application-grid,.jpd-process-list,.jpd-related-grid{grid-template-columns:1fr;}
  .jpd-process-list li::after{display:none;}
  .jpd-parameter-group dl div{grid-template-columns:108px 1fr;}
  .jpd-cta{padding:26px 20px;border-radius:17px;}
  .jpd-cta h2{font-size:24px;}
  .jpd-cta-actions{width:100%;flex-direction:column;}
  .jpd-product-nav{grid-template-columns:1fr 1fr;}
  .jpd-product-nav-back{grid-column:1/-1;grid-row:2;justify-self:center;}
  .jpd-media-preview{padding:20px;}
  .jpd-media-preview-close{right:14px;top:14px;}
}

/* Header/footer backend configuration bridge v110 */
.main-nav a:hover,
.main-nav a.active{
  background:var(--cms-nav-active-bg,var(--blue));
  color:#fff;
}
.header-phone{
  background:var(--cms-hotline-bg,#ef202d);
}
.header-phone .label,
.header-phone .cms-hotline-icon{
  color:var(--cms-hotline-number-color,#ffd65a);
}
.header-phone .tag{
  background:var(--cms-hotline-badge-bg,#ffb918);
  color:var(--cms-hotline-badge-color,#333);
}
.header-phone img.cms-hotline-icon{
  display:block;
  object-fit:contain;
}
.header-phone i.cms-hotline-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.float-side i{
  display:block;
  font-size:20px;
  line-height:1;
}
@media (min-width:769px){
  body:not(.mobile-site) .site-header .site-logo-img{
    width:var(--cms-logo-top-width,190px)!important;
    height:auto;
    max-height:58px;
  }
  body:not(.mobile-site) .site-header.is-scrolled .site-logo-img{
    width:var(--cms-logo-scrolled-width,var(--cms-logo-top-width,190px))!important;
  }
  body:not(.mobile-site) .site-header .header-phone{
    min-width:min(var(--cms-hotline-current-width,var(--cms-hotline-top-width,300px)),300px)!important;
    width:min(var(--cms-hotline-current-width,var(--cms-hotline-top-width,300px)),300px)!important;
    transform:translateY(var(--cms-hotline-current-offset,var(--cms-hotline-top-offset,0))) scale(var(--phone-scroll-scale,1));
    transition:background-color .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease);
  }
  body:not(.mobile-site) .site-header .header-phone .label{
    font-size:var(--cms-hotline-current-number-size,var(--cms-hotline-number-top-size,22px))!important;
    font-weight:var(--cms-hotline-number-weight,700);
  }
  body:not(.mobile-site) .site-header .header-phone .cms-hotline-icon{
    width:var(--cms-hotline-current-icon-size,var(--cms-hotline-icon-top-size,23px))!important;
    height:var(--cms-hotline-current-icon-size,var(--cms-hotline-icon-top-size,23px))!important;
    flex-basis:var(--cms-hotline-current-icon-size,var(--cms-hotline-icon-top-size,23px))!important;
    font-size:var(--cms-hotline-current-icon-size,var(--cms-hotline-icon-top-size,23px))!important;
  }
  body:not(.mobile-site) .site-header .header-phone .tag{
    font-size:var(--cms-hotline-current-badge-size,var(--cms-hotline-badge-top-size,10px))!important;
  }
}

@media (min-width:769px){
  body:not(.mobile-site) .site-header--layout-balanced .site-logo-img{
    width:min(var(--cms-logo-top-width,190px),180px)!important;
  }
  body:not(.mobile-site) .site-header--layout-balanced.is-scrolled .site-logo-img{
    width:min(var(--cms-logo-scrolled-width,180px),170px)!important;
  }
  body:not(.mobile-site) .site-header--layout-balanced .header-phone{
    min-width:min(var(--cms-hotline-top-width,202px),280px)!important;
  }
  body:not(.mobile-site) .site-header--layout-balanced.is-scrolled .header-phone{
    min-width:min(var(--cms-hotline-scrolled-width,202px),250px)!important;
  }
  body:not(.mobile-site) .site-header--layout-compact .site-logo-img{
    width:min(var(--cms-logo-top-width,190px),160px)!important;
  }
  body:not(.mobile-site) .site-header--layout-compact.is-scrolled .site-logo-img{
    width:min(var(--cms-logo-scrolled-width,180px),150px)!important;
  }
  body:not(.mobile-site) .site-header--layout-compact .header-phone{
    min-width:min(var(--cms-hotline-top-width,202px),240px)!important;
  }
  body:not(.mobile-site) .site-header--layout-compact.is-scrolled .header-phone{
    min-width:min(var(--cms-hotline-scrolled-width,202px),220px)!important;
  }
}

/* Banner image fidelity v111: banners must render the uploaded artwork directly.
 * Do not place dark/light/gradient masks over homepage or inner-page banners. */
.hero--photo .scrim,
.hero--inner::after,
.labels-hero-ref::after,
.bags-hero-ref::after,
.boxes-hero-ref::after,
.news-generated-hero::after,
.contact-generated-hero::after{
  content:none !important;
  display:none !important;
  background:none !important;
}
.hero--inner .inner-hero-bg,
.labels-hero-ref .inner-hero-bg,
.bags-hero-ref .inner-hero-bg,
.boxes-hero-ref .inner-hero-bg,
.news-generated-hero .news-generated-hero-bg,
.contact-generated-hero .contact-generated-hero-bg,
.about-upload-hero-bg{
  opacity:1 !important;
}