:root{
  --navy:#071d3c;
  --navy2:#0c2d57;
  --gold:#c88b1e;
  --gold2:#e0af4d;
  --text:#102033;
  --muted:#627083;
  --line:#e7e9ed;
  --soft:#f6f7f9;
  --white:#fff;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Noto Sans JP",sans-serif;color:var(--text);background:#fff}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
.wrap{width:min(var(--max),calc(100% - 42px));margin:auto}

/* HEADER */
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid rgba(7,29,60,.08)}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{width:165px;flex:0 0 auto}
.brand img{width:100%;height:64px;object-fit:contain;object-position:left center}
.nav{display:flex;align-items:center;gap:20px;font-size:12px;font-weight:700}
.nav>a{position:relative;padding:31px 0}
.nav>a:not(.nav-contact):hover,.nav>a.active{color:var(--gold)}
.nav>a.active::after{content:"";position:absolute;left:0;right:0;bottom:19px;height:2px;background:var(--gold)}
.nav-contact{background:var(--navy);color:#fff;padding:12px 15px!important;border-radius:3px}
.menu-btn{display:none;border:0;background:var(--navy);color:#fff;padding:8px 12px;font-size:22px;border-radius:3px}

/* HERO */
.hero{min-height:530px;position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:url("assets/hero.jpg") right center/cover no-repeat}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.94) 28%,rgba(255,255,255,.47) 52%,rgba(255,255,255,.05) 74%)}
.hero-inner{min-height:530px;display:flex;align-items:center;position:relative;z-index:2}
.hero-copy{width:50%;padding:45px 0}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:.17em;color:var(--navy)}
.hero h1{font-size:44px;line-height:1.34;margin:10px 0 18px;color:var(--navy)}
.hero h1 span{color:var(--gold)}
.hero-lead{font-size:14px;line-height:1.9}
.hero-points{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:520px;margin-top:25px}
.hero-points article{background:rgba(255,255,255,.9);text-align:center;padding:19px 12px;border:1px solid rgba(7,29,60,.06);box-shadow:0 10px 30px rgba(7,29,60,.05);border-radius:4px}
.point-icon{font-size:30px;color:var(--navy)}
.hero-points h3{font-size:13px;margin:8px 0 3px}
.hero-points p{font-size:9px;margin:0;color:var(--muted)}

/* STATS */
.stats-bar{background:var(--navy);color:#fff}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stats-grid>div{display:flex;align-items:center;justify-content:center;gap:16px;padding:24px 10px;border-right:1px solid rgba(255,255,255,.2)}
.stats-grid>div:last-child{border-right:0}
.stats-grid b{font-size:30px}
.stats-grid p{margin:0;font-size:11px}
.stats-grid strong{display:block;font-size:20px;margin-top:2px}

/* GLOBAL */
.section{padding:62px 0}
.soft{background:var(--soft)}
.section-title{display:flex;align-items:center;gap:15px;margin-bottom:28px}
.section-title h2{font-size:26px;margin:0;color:var(--navy)}
.section-title>span,.section-title>div>span{display:block;width:34px;height:2px;background:var(--gold)}
.section-title.center{justify-content:center}
.section-intro{text-align:center;font-size:12px;line-height:1.9;color:#566273;margin:-10px auto 28px;max-width:760px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 20px;background:var(--navy);color:#fff;border-radius:3px;font-size:11px;font-weight:700;transition:.2s}
.btn:hover{transform:translateY(-2px);background:var(--navy2)}
.btn.gold{background:var(--gold);color:#fff}
.btn.small{padding:10px 14px}

/* SERVICES */
.services{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1.2fr auto 1fr auto 1fr;align-items:start;gap:12px}
.services article{text-align:center}
.circle{width:72px;height:72px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;margin:auto;font-size:32px}
.services h3{font-size:13px;margin:11px 0 5px}
.services p{font-size:9px;line-height:1.6;color:var(--muted);max-width:130px;margin:auto}
.services i{font-style:normal;font-size:33px;color:var(--gold);padding-top:17px}

/* ABOUT */
.about{display:grid;grid-template-columns:50% 50%;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.about-photo img{width:100%;height:100%;min-height:400px;object-fit:cover}
.about-copy{padding:55px clamp(30px,5vw,80px);display:flex;flex-direction:column;justify-content:center}
.about-copy p{font-size:13px;line-height:1.95;color:#455267;max-width:650px}
.about-copy .btn{width:max-content;margin-top:12px}

/* PRODUCTS */
.tabs{display:grid;grid-template-columns:repeat(5,1fr);margin-bottom:24px;border:1px solid #d9dde4;border-radius:4px;overflow:hidden}
.tab{border:0;border-right:1px solid #d9dde4;background:#fff;padding:12px;font-family:inherit;font-size:11px;font-weight:700;color:var(--navy);cursor:pointer}
.tab:last-child{border-right:0}
.tab.active{background:var(--navy);color:#fff}
.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.product-card{border:1px solid var(--line);border-radius:4px;background:#fff;padding:12px;transition:.2s}
.product-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(7,29,60,.08)}
.product-card.hide{display:none}
.product-card img{width:100%;aspect-ratio:4/5;object-fit:contain;background:#fafafa}
.product-card h3{font-size:13px;margin:12px 0 6px;text-align:center}
.product-card p{font-size:10px;line-height:1.65;color:var(--muted);margin:0}
.product-cta{margin-top:30px;min-height:150px;border-radius:5px;padding:28px 32px;display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(90deg,rgba(7,29,60,.98),rgba(7,29,60,.76)),url("assets/quality.jpg") center/cover no-repeat;color:#fff}
.product-cta h3{font-size:21px;margin:0 0 7px}
.product-cta p{font-size:11px;margin:0}

/* FACILITIES */
.facility-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.facility-grid article{background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.facility-grid img{width:100%;height:170px;object-fit:cover}
.facility-grid h3{font-size:13px;text-align:center;margin:11px 8px 6px}
.facility-grid p{font-size:9.5px;line-height:1.6;color:var(--muted);text-align:center;margin:0 12px 14px}

/* QUALITY */
.quality-grid{display:grid;grid-template-columns:31% 69%;gap:38px;align-items:center}
.quality-copy p{font-size:12px;line-height:1.9;color:#4c5868}
.quality-visual{border:1px solid var(--line);border-radius:4px;overflow:hidden}
.quality-visual>img{width:100%;height:230px;object-fit:cover}
.quality-steps{display:grid;grid-template-columns:repeat(4,1fr);background:#fff}
.quality-steps span{text-align:center;padding:14px 8px;border-right:1px solid var(--line);font-size:25px;color:var(--navy)}
.quality-steps span:last-child{border-right:0}
.quality-steps small{display:block;font-size:9px;margin-top:5px;color:var(--text)}

/* RECRUIT */
.recruit{position:relative;min-height:350px;color:#fff;overflow:hidden}
.recruit-bg{position:absolute;inset:0;background:url("assets/recruit.jpg") center/cover no-repeat}
.recruit-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,29,60,.98),rgba(7,29,60,.86) 42%,rgba(7,29,60,.25) 76%)}
.recruit-inner{position:relative;z-index:2;min-height:350px;display:flex;align-items:center}
.recruit-copy{max-width:650px}
.gold-text{color:var(--gold2)}
.recruit h2{font-size:31px;margin:3px 0 7px}
.recruit h3{font-size:23px;margin:0 0 20px}
.recruit-points{display:grid;grid-template-columns:repeat(2,max-content);gap:10px 30px;font-size:13px;margin-bottom:23px}

/* NEWS */
.heading-between{justify-content:space-between}
.heading-between>div{display:flex;align-items:center;gap:15px}
.news-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:35px;align-items:center}
.news-list a{display:grid;grid-template-columns:95px 85px 1fr;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:10px}
.news-list time{color:var(--gold);font-weight:600}
.news-list b{background:var(--navy);color:#fff;padding:4px 7px;border-radius:2px;font-size:8px;width:max-content}
.news-grid>img{width:100%;height:210px;object-fit:cover}

/* FOOTER */
footer{background:var(--navy);color:#fff;padding:42px 0 14px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(5,1fr) 1.35fr .95fr;gap:24px}
.footer-brand img{width:155px;height:95px;object-fit:contain;background:#fff;border-radius:3px}
.footer-brand p{font-size:7px;color:#cfd8e4}
.footer-grid h4{font-size:11px;margin:0 0 11px}
.footer-grid a,.footer-grid p{display:block;font-size:9px;line-height:1.7;color:#d9e2ed;margin:4px 0}
.copyright{text-align:center;border-top:1px solid rgba(255,255,255,.11);margin-top:28px;padding-top:14px;font-size:8px;color:#aebbd0}


.social-icons{
  display:flex;
  gap:10px;
  margin-top:14px;
}
.social{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid!important;
  place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.28);
  color:#fff!important;
  font-size:15px!important;
  font-weight:800;
  line-height:1;
  transition:.2s ease;
}
.social:hover{
  transform:translateY(-2px);
  background:var(--gold);
  border-color:var(--gold);
}
.social.tiktok{font-size:17px!important}
.social.wechat{font-size:18px!important}

.line-block{
  text-align:center;
  min-width:120px;
}
.line-block h4{
  margin-bottom:8px;
  white-space:nowrap;
}
.line-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#06c755;
  color:#fff;
  font-size:11px;
  font-weight:800;
  border-radius:999px;
  padding:5px 12px;
  margin-bottom:8px;
}
.qr-placeholder{
  width:92px;
  height:92px;
  margin:0 auto 7px;
  background:
    linear-gradient(90deg,#071d3c 10%,transparent 10% 20%,#071d3c 20% 30%,transparent 30% 40%,#071d3c 40% 50%,transparent 50% 60%,#071d3c 60% 70%,transparent 70% 80%,#071d3c 80% 90%,transparent 90%),
    linear-gradient(#071d3c 10%,#fff 10% 20%,#071d3c 20% 30%,#fff 30% 40%,#071d3c 40% 50%,#fff 50% 60%,#071d3c 60% 70%,#fff 70% 80%,#071d3c 80% 90%,#fff 90%);
  border:6px solid #fff;
  box-shadow:0 0 0 1px rgba(255,255,255,.3);
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
}
.qr-placeholder span{
  background:#fff;
  color:var(--navy);
  font-weight:900;
  font-size:17px;
  padding:3px 6px;
  z-index:2;
}
.qr-placeholder small{
  position:absolute;
  bottom:3px;
  right:4px;
  background:#06c755;
  color:#fff;
  font-size:7px;
  font-weight:800;
  padding:2px 4px;
}
.line-block p{
  text-align:center;
  font-size:8px!important;
  color:#d9e2ed!important;
}

/* RESPONSIVE */
@media(max-width:1120px){
  .nav{gap:12px;font-size:10px}
  .services{grid-template-columns:repeat(3,1fr);row-gap:35px}
  .services i{display:none}
  .product-grid{grid-template-columns:repeat(4,1fr)}
  .facility-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:860px){
  .header-inner{min-height:72px}
  .brand{width:135px}
  .brand img{height:54px}
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;padding:18px 22px;flex-direction:column;align-items:stretch;box-shadow:0 16px 30px rgba(0,0,0,.12)}
  .nav.open{display:flex}
  .nav>a{padding:9px 0}
  .nav>a.active::after{bottom:1px}
  .hero{min-height:690px}
  .hero-bg{background-position:64% center}
  .hero-shade{background:linear-gradient(0deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.95) 48%,rgba(255,255,255,.12) 77%)}
  .hero-inner{min-height:690px;align-items:flex-end}
  .hero-copy{width:100%;padding:330px 0 38px}
  .hero h1{font-size:35px}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .about{grid-template-columns:1fr}
  .about-photo img{min-height:300px}
  .product-grid{grid-template-columns:repeat(3,1fr)}
  .facility-grid{grid-template-columns:repeat(2,1fr)}
  .quality-grid,.news-grid{grid-template-columns:1fr}
  .recruit-shade{background:linear-gradient(90deg,rgba(7,29,60,.95),rgba(7,29,60,.72))}
}
@media(max-width:590px){
  .wrap{width:min(var(--max),calc(100% - 28px))}
  .section{padding:44px 0}
  .hero h1{font-size:29px}
  .hero-points{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr 1fr}
  .stats-grid>div{padding:16px 6px}
  .stats-grid strong{font-size:15px}
  .services{grid-template-columns:repeat(2,1fr)}
  .section-title h2{font-size:22px}
  .tabs{grid-template-columns:1fr 1fr}
  .tab{border-bottom:1px solid #d9dde4}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .facility-grid{grid-template-columns:1fr}
  .facility-grid img{height:230px}
  .quality-steps{grid-template-columns:repeat(2,1fr)}
  .product-cta{flex-direction:column;align-items:flex-start}
  .recruit-points{grid-template-columns:1fr}
  .news-list a{grid-template-columns:78px 72px 1fr;font-size:9px}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}


/* LANGUAGE SELECT */
.lang-select-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-width:126px;
}
.lang-select{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(7,29,60,.22);
  border-radius:3px;
  background:#fff;
  color:var(--navy);
  padding:10px 34px 10px 12px;
  font-family:inherit;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
  outline:none;
  transition:.2s ease;
}
.lang-select:hover,
.lang-select:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(200,139,30,.08);
}
.lang-arrow{
  position:absolute;
  right:11px;
  top:50%;
  transform:translateY(-54%);
  color:var(--gold);
  font-size:16px;
  font-weight:800;
  pointer-events:none;
  transition:.2s ease;
}
.lang-select-wrap:hover .lang-arrow{
  transform:translateY(-54%) translateY(2px);
}
.gold-title{color:var(--gold)!important}

@media(max-width:860px){
  .lang-select-wrap{width:100%}
  .lang-select{min-height:44px;font-size:12px}
}


/* PRODUCT FULLSCREEN VIEWER */
.product-card img{
  cursor:zoom-in;
}
.product-viewer{
  position:fixed;
  inset:0;
  z-index:5000;
  background:rgba(4,13,29,.94);
  backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility .22s ease;
}
.product-viewer.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.viewer-stage{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:34px 24px 26px;
}
.viewer-stage img{
  max-width:min(92vw,1200px);
  max-height:78vh;
  width:auto;
  height:auto;
  object-fit:contain;
  background:#fff;
  border-radius:5px;
  box-shadow:0 24px 80px rgba(0,0,0,.4);
  transform:scale(.96);
  transition:transform .22s ease;
}
.product-viewer.open .viewer-stage img{
  transform:scale(1);
}
.viewer-caption{
  margin-top:16px;
  text-align:center;
  color:#fff;
  max-width:760px;
}
.viewer-caption h3{
  margin:0 0 6px;
  font-size:20px;
}
.viewer-caption p{
  margin:0;
  font-size:12px;
  line-height:1.7;
  color:#d7dfeb;
}
.viewer-close{
  position:absolute;
  top:18px;
  right:22px;
  z-index:2;
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:30px;
  line-height:1;
  cursor:pointer;
  transition:.2s ease;
}
.viewer-close:hover{
  background:var(--gold);
  border-color:var(--gold);
}
body.viewer-open{
  overflow:hidden;
}

@media(max-width:700px){
  .viewer-stage{
    padding:68px 14px 22px;
  }
  .viewer-stage img{
    max-width:94vw;
    max-height:72vh;
  }
  .viewer-caption h3{font-size:17px}
  .viewer-caption p{font-size:11px}
}


/* ===== LANGUAGE FLAGS (FINAL) ===== */
.lang-select-wrap,
.lang-select,
.lang-arrow{
  display:none !important;
}

.flag-language-switch{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:88px;
  padding:5px 8px;
  border:1px solid rgba(7,29,60,.12);
  border-radius:999px;
  background:#fff;
  box-shadow:0 4px 14px rgba(7,29,60,.06);
}

.flag-lang{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  margin:0;
  padding:2px;
  line-height:1;
  cursor:pointer;
  opacity:.42;
  transform:scale(.94);
  transition:opacity .18s ease, transform .18s ease, filter .18s ease;
}

.flag-lang .flag-icon{
  display:block;
  font-size:26px;
  line-height:1;
}

.flag-lang:hover{
  opacity:.85;
  transform:scale(1.06);
}

.flag-lang.active{
  opacity:1;
  transform:scale(1.12);
  filter:saturate(1.1);
}

.flag-divider{
  color:#c5cad1;
  font-size:12px;
  user-select:none;
}

@media(max-width:860px){
  .flag-language-switch{
    width:max-content;
    min-width:94px;
    margin-top:4px;
  }
}

/* ===== PRODUCT IMAGE VIEWER (FINAL) ===== */
.product-card img{
  cursor:zoom-in !important;
}

.product-viewer{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
}

.product-viewer.open{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

.viewer-stage img{
  max-width:92vw !important;
  max-height:80vh !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
}

/* FACILITY IMAGE HOVER ZOOM */
.facility-grid article { overflow: hidden; }
.facility-grid article img {
  display: block;
  width: 100%;
  transition: transform .45s ease, filter .45s ease;
  transform-origin: center center;
}
.facility-grid article:hover img {
  transform: scale(1.10);
  filter: brightness(1.03);
}
@media (hover:none), (pointer:coarse) {
  .facility-grid article:hover img {
    transform: none;
    filter: none;
  }
}


/* ===== SERVICE PROCESS FULLSCREEN VIEWER ===== */
.service-step .circle{
  cursor:zoom-in;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.service-step .circle:hover{
  transform:scale(1.10);
  box-shadow:0 14px 34px rgba(7,29,60,.24);
  background:var(--navy2);
}

.service-viewer{
  position:fixed;
  inset:0;
  z-index:100000;
  background:rgba(4,13,29,.95);
  backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility .22s ease;
}
.service-viewer.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.service-viewer-stage{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:70px 24px 28px;
}
.service-viewer-stage img{
  max-width:94vw;
  max-height:78vh;
  width:auto;
  height:auto;
  object-fit:contain;
  background:#fff;
  border-radius:5px;
  box-shadow:0 28px 90px rgba(0,0,0,.46);
  transform:scale(.96);
  transition:transform .22s ease;
}
.service-viewer.open .service-viewer-stage img{
  transform:scale(1);
}
.service-viewer-caption{
  max-width:780px;
  text-align:center;
  color:#fff;
  margin-top:16px;
}
.service-viewer-caption h3{
  margin:0 0 6px;
  font-size:22px;
}
.service-viewer-caption p{
  margin:0;
  color:#d8e1ed;
  font-size:12px;
  line-height:1.8;
}
.service-viewer-close{
  position:absolute;
  z-index:2;
  top:18px;
  right:22px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.09);
  color:#fff;
  font-size:31px;
  cursor:pointer;
  transition:.2s ease;
}
.service-viewer-close:hover{
  background:var(--gold);
  border-color:var(--gold);
}
body.service-viewer-open{
  overflow:hidden;
}

@media(max-width:700px){
  .service-viewer-stage{padding:68px 12px 24px}
  .service-viewer-stage img{max-width:96vw;max-height:72vh}
  .service-viewer-caption h3{font-size:18px}
  .service-viewer-caption p{font-size:11px}
}


/* ===== FACILITY TITLE -> FULLSCREEN IMAGE ===== */
.facility-title{
  cursor:zoom-in;
  transition:color .18s ease, transform .18s ease;
}
.facility-title:hover{
  color:var(--gold);
  transform:translateY(-1px);
}

.facility-viewer{
  position:fixed;
  inset:0;
  z-index:100001;
  background:rgba(4,13,29,.95);
  backdrop-filter:blur(8px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility .22s ease;
}
.facility-viewer.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.facility-viewer-stage{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:70px 24px 28px;
}
.facility-viewer-stage img{
  max-width:94vw;
  max-height:80vh;
  width:auto;
  height:auto;
  object-fit:contain;
  background:#fff;
  border-radius:5px;
  box-shadow:0 28px 90px rgba(0,0,0,.46);
  transform:scale(.96);
  transition:transform .22s ease;
}
.facility-viewer.open .facility-viewer-stage img{
  transform:scale(1);
}
.facility-viewer-caption{
  max-width:780px;
  text-align:center;
  color:#fff;
  margin-top:16px;
}
.facility-viewer-caption h3{
  margin:0 0 6px;
  font-size:22px;
}
.facility-viewer-caption p{
  margin:0;
  color:#d8e1ed;
  font-size:12px;
  line-height:1.8;
}
.facility-viewer-close{
  position:absolute;
  z-index:2;
  top:18px;
  right:22px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.09);
  color:#fff;
  font-size:31px;
  cursor:pointer;
  transition:.2s ease;
}
.facility-viewer-close:hover{
  background:var(--gold);
  border-color:var(--gold);
}
body.facility-viewer-open{
  overflow:hidden;
}

@media(max-width:700px){
  .facility-viewer-stage{padding:68px 12px 24px}
  .facility-viewer-stage img{max-width:96vw;max-height:74vh}
  .facility-viewer-caption h3{font-size:18px}
  .facility-viewer-caption p{font-size:11px}
}


/* ===== ABOUT / KTS GARMENT 5-IMAGE SLIDER ===== */
.about-slider{
  position:relative;
  min-height:400px;
  overflow:hidden;
  background:#eef1f5;
}
.about-slides{
  position:absolute;
  inset:0;
}
.about-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .65s ease, visibility .65s ease;
}
.about-slide.active{
  opacity:1;
  visibility:visible;
}
.about-slide img{
  width:100%;
  height:100%;
  min-height:400px;
  object-fit:cover;
  transform:scale(1.02);
  transition:transform 5s ease;
}
.about-slide.active img{
  transform:scale(1.08);
}
.about-prev,
.about-next{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.55);
  background:rgba(7,29,60,.55);
  color:#fff;
  font-size:28px;
  line-height:1;
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:.2s ease;
}
.about-prev{left:16px}
.about-next{right:16px}
.about-prev:hover,
.about-next:hover{
  background:var(--gold);
  border-color:var(--gold);
}
.about-dots{
  position:absolute;
  left:50%;
  bottom:17px;
  transform:translateX(-50%);
  z-index:3;
  display:flex;
  gap:8px;
}
.about-dots button{
  width:9px;
  height:9px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.9);
  background:rgba(255,255,255,.35);
  padding:0;
  cursor:pointer;
  transition:.2s ease;
}
.about-dots button.active{
  width:24px;
  border-radius:999px;
  background:var(--gold);
  border-color:var(--gold);
}
@media(max-width:860px){
  .about-slider,
  .about-slide img{
    min-height:310px;
  }
}
@media(max-width:590px){
  .about-slider,
  .about-slide img{
    min-height:260px;
  }
  .about-prev,
  .about-next{
    width:36px;
    height:36px;
    font-size:24px;
  }
}


/* =========================================================
   PROFESSIONAL SVG ICON SYSTEM
   ========================================================= */
.svg-sprite{
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}
.point-icon svg,
.circle svg,
.stat-icon svg,
.quality-steps svg{
  width:1em;
  height:1em;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.point-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}
.point-icon svg{font-size:33px}
.stat-icon{
  display:flex!important;
  align-items:center;
  justify-content:center;
  color:#fff;
}
.stat-icon svg{font-size:31px}
.circle svg{font-size:30px}
.quality-steps span{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.quality-steps svg{
  width:30px;
  height:30px;
  margin-bottom:5px;
}

/* Refine service icons */
.circle{
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 24px rgba(7,29,60,.14);
}
.service-step:hover .circle{
  transform:translateY(-3px) scale(1.06);
  box-shadow:0 16px 34px rgba(7,29,60,.20);
}

/* =========================================================
   NEWS: VERTICAL SCROLL + VIDEO
   ========================================================= */
.news-grid{
  align-items:stretch;
}
.news-list{
  max-height:255px;
  overflow-y:auto;
  padding-right:12px;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:var(--gold) #edf0f4;
}
.news-list::-webkit-scrollbar{
  width:7px;
}
.news-list::-webkit-scrollbar-track{
  background:#edf0f4;
  border-radius:10px;
}
.news-list::-webkit-scrollbar-thumb{
  background:linear-gradient(var(--gold),#a96d12);
  border-radius:10px;
}
.news-list::-webkit-scrollbar-thumb:hover{
  background:#a96d12;
}
.news-list a{
  min-height:48px;
  transition:background .18s ease, padding-left .18s ease;
}
.news-list a:hover{
  background:#f6f7f9;
  padding-left:7px;
}

.news-video{
  position:relative;
  min-height:255px;
  background:#061a35;
  border-radius:5px;
  overflow:hidden;
  box-shadow:0 14px 34px rgba(7,29,60,.12);
}
.news-video video{
  width:100%;
  height:255px;
  display:block;
  object-fit:cover;
  background:#071d3c;
}
.video-label{
  position:absolute;
  left:14px;
  bottom:13px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 11px;
  border-radius:3px;
  background:rgba(7,29,60,.82);
  color:#fff;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  pointer-events:none;
}
.video-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#d79a22;
  box-shadow:0 0 0 4px rgba(215,154,34,.18);
}

@media(max-width:860px){
  .news-list{max-height:285px}
  .news-video,
  .news-video video{height:280px}
}


/* =========================================================
   FINAL FOOTER SOCIAL ICONS + REAL LINE QR
   ========================================================= */
.social-icons{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
}
.social-icons .social{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid!important;
  place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.25);
  color:#fff!important;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.social-icons .social svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.social-icons .facebook svg{
  fill:currentColor;
  stroke:none;
}
.social-icons .youtube svg rect{
  fill:none;
}
.social-icons .youtube svg path{
  fill:currentColor;
  stroke:none;
}
.social-icons .social:hover{
  transform:translateY(-2px);
  background:var(--gold);
  border-color:var(--gold);
}

.line-block{
  text-align:center;
}
.line-qr-card{
  width:104px;
  height:104px;
  background:#fff;
  margin:8px auto 7px;
  padding:5px;
  border-radius:4px;
  box-shadow:0 0 0 1px rgba(255,255,255,.28);
}
.line-qr-image{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:#fff;
}
.line-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#06c755;
  color:#fff;
  font-size:9px;
  font-weight:800;
  border-radius:999px;
  padding:5px 10px;
  letter-spacing:.05em;
}
@media(max-width:700px){
  .line-qr-card{
    width:96px;
    height:96px;
  }
}

/* Slight polish for the company intro video */
.news-video{
  border:1px solid rgba(7,29,60,.08);
}
.news-video video{
  cursor:pointer;
}


/* ===== NEWS COMPANY INTRO VIDEO - FIXED ===== */
.news-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:34px;
  align-items:stretch;
}
.company-intro-video{
  position:relative;
  width:100%;
  min-height:255px;
  border-radius:6px;
  overflow:hidden;
  background:#061a35;
  box-shadow:0 14px 34px rgba(7,29,60,.14);
}
.company-intro-video video{
  display:block;
  width:100%;
  height:255px;
  object-fit:cover;
  background:#061a35;
}
.company-intro-video .video-title{
  position:absolute;
  left:14px;
  bottom:14px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  background:rgba(5,24,50,.84);
  color:#fff;
  border-radius:4px;
  pointer-events:none;
  backdrop-filter:blur(6px);
}
.video-play-icon{
  width:28px;
  height:28px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--gold);
  font-size:11px;
}
.company-intro-video .video-title strong{
  display:block;
  font-size:11px;
}
.company-intro-video .video-title small{
  display:block;
  margin-top:2px;
  font-size:7.5px;
  letter-spacing:.08em;
  opacity:.8;
}
@media(max-width:860px){
  .news-grid{grid-template-columns:1fr}
  .company-intro-video,
  .company-intro-video video{min-height:280px;height:280px}
}

/* Professional sewing-machine icon */
.sewing-machine-icon svg{
  width:42px;
  height:42px;
  display:block;
}
.sewing-machine-icon{
  color:inherit;
}

/* Refined process / stable-supply icons */
.pro-process-icon svg,
.pro-supply-icon svg {
  display:block;
  margin:auto;
}
.pro-process-icon,
.pro-supply-icon {
  line-height:1;
}

/* ===== MODERN FULL-COLOR ICON SYSTEM ===== */
.modern-icon,.modern-process,.modern-stat,.modern-quality-step{
  transition:transform .25s ease,box-shadow .25s ease;
}
.modern-icon svg{width:48px!important;height:48px!important;filter:drop-shadow(0 7px 8px rgba(7,29,60,.15))}
.hero-points article:hover .modern-icon{transform:translateY(-4px) scale(1.06)}
.modern-process{
  border:none!important;background:transparent!important;box-shadow:none!important;
  width:78px!important;height:78px!important;display:grid!important;place-items:center!important;
}
.modern-process svg{width:72px!important;height:72px!important;filter:drop-shadow(0 8px 10px rgba(7,29,60,.16))}
.service-step:hover .modern-process{transform:translateY(-5px) scale(1.07)!important;box-shadow:none!important}
.modern-stat{
  width:48px;height:48px;border-radius:15px;display:grid!important;place-items:center!important;
  margin:0 auto 7px;box-shadow:0 8px 18px rgba(0,0,0,.12)
}
.modern-stat svg{width:25px!important;height:25px!important;color:#fff}
.stat-navy{background:linear-gradient(135deg,#0b315d,#17528a)}
.stat-blue{background:linear-gradient(135deg,#2f80ed,#56ccf2)}
.stat-gold{background:linear-gradient(135deg,#d89018,#f5c45b)}
.stat-teal{background:linear-gradient(135deg,#149c86,#4fd1b5)}
.stats-grid>div:hover .modern-stat{transform:translateY(-4px)}
.modern-quality-step{
  border-radius:12px;padding:10px 8px!important;color:#fff!important;
  box-shadow:0 7px 16px rgba(7,29,60,.12)
}
.modern-quality-step svg{color:#fff!important}
.modern-quality-step small{color:#fff!important}
.q-blue{background:linear-gradient(135deg,#3478d4,#62a6f4)}
.q-purple{background:linear-gradient(135deg,#7258cf,#9a85e7)}
.q-green{background:linear-gradient(135deg,#229b70,#55c995)}
.q-gold{background:linear-gradient(135deg,#c98a20,#efb84f)}
.modern-quality-step:hover{transform:translateY(-4px)}

/* ===== ICON REVISION V2 ===== */
.trust-medal-icon svg{width:52px!important;height:52px!important;filter:drop-shadow(0 8px 9px rgba(168,105,12,.18))}
.production-machine-stat{background:transparent!important;box-shadow:none!important;width:54px!important;height:54px!important}
.production-machine-stat svg{width:54px!important;height:54px!important}
.colorful-socials{display:flex;gap:11px;align-items:center;margin-top:14px}
.colorful-socials .social{
  width:38px!important;height:38px!important;padding:0!important;border:0!important;
  background:transparent!important;display:block!important;border-radius:50%;
  box-shadow:0 6px 15px rgba(0,0,0,.16);overflow:hidden;transition:.22s ease
}
.colorful-socials .social svg{display:block;width:100%!important;height:100%!important;fill:none;stroke:none}
.colorful-socials .social:hover{transform:translateY(-4px) scale(1.07);box-shadow:0 10px 22px rgba(0,0,0,.22)}

/* ===== RESTORED CLEAN QUALITY + SOCIAL ICONS ===== */
.quality-steps span,
.quality-steps .modern-quality-step{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  border-radius:0!important;
  padding:0!important;
  transform:none!important;
}
.quality-steps span svg{
  width:30px!important;
  height:30px!important;
  margin-bottom:5px;
  color:inherit!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.quality-steps span small{color:inherit!important}

.social-icons{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
}
.social-icons .social,
.colorful-socials .social{
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.25)!important;
  color:#fff!important;
  box-shadow:none!important;
  overflow:visible!important;
  transition:transform .2s ease,background .2s ease,border-color .2s ease!important;
}
.social-icons .social svg{
  width:17px!important;
  height:17px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.social-icons .facebook svg{
  fill:currentColor!important;
  stroke:none!important;
}
.social-icons .youtube svg rect{fill:none!important}
.social-icons .youtube svg path{fill:currentColor!important;stroke:none!important}
.social-icons .social:hover{
  transform:translateY(-2px)!important;
  background:var(--gold)!important;
  border-color:var(--gold)!important;
}


/* ===== ABOUT KTS GARMENT: HIDE SIDE ARROWS ===== */
.about-prev,
.about-next{
  display:none!important;
}


/* ===== PROFESSIONAL AUTO-SCROLLING NEWS TICKER ===== */
.news-list{
  position:relative;
  height:255px!important;
  max-height:255px!important;
  overflow:hidden!important;
  padding-right:10px;
  scrollbar-width:none!important;
  -ms-overflow-style:none;
  mask-image:linear-gradient(to bottom,transparent 0,#000 8%,#000 92%,transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 8%,#000 92%,transparent 100%);
}
.news-list::-webkit-scrollbar{display:none!important}
.news-scroll-track{
  will-change:transform;
  transform:translate3d(0,0,0);
}
.news-scroll-track a{
  display:grid;
  grid-template-columns:92px 72px minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:58px;
  border-bottom:1px solid rgba(7,29,60,.10);
  transition:background .2s ease,color .2s ease;
}
.news-scroll-track a:hover{
  background:#f6f8fb;
}
.news-list:hover .news-scroll-track{
  /* JS also pauses motion; cursor communicates interaction */
  cursor:pointer;
}
@media(max-width:650px){
  .news-scroll-track a{
    grid-template-columns:82px 66px minmax(0,1fr);
    gap:8px;
    font-size:12px;
  }
}


/* ===== FIXED BRAND LOGO SIZE ON ALL SCREEN WIDTHS ===== */
.site-header .header-inner{
  min-height:88px;
}

.site-header .brand{
  display:flex;
  align-items:center;
  flex:0 0 auto !important;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  height:72px !important;
}

.site-header .brand img{
  display:block;
  width:190px !important;
  min-width:190px !important;
  max-width:190px !important;
  height:72px !important;
  object-fit:contain;
  object-position:left center;
  flex:none !important;
  transform:none !important;
}

/* Keep the logo unchanged on tablet/mobile.
   Navigation adapts instead of shrinking the brand. */
@media (max-width: 1100px){
  .site-header .brand,
  .site-header .brand img{
    width:190px !important;
    min-width:190px !important;
    max-width:190px !important;
  }
  .site-header .brand{height:72px !important;}
  .site-header .brand img{height:72px !important;}
}

@media (max-width: 768px){
  .site-header .header-inner{
    min-height:84px;
  }
  .site-header .brand,
  .site-header .brand img{
    width:190px !important;
    min-width:190px !important;
    max-width:190px !important;
  }
  .site-header .brand{height:72px !important;}
  .site-header .brand img{height:72px !important;}
}

@media (max-width: 420px){
  .site-header .brand,
  .site-header .brand img{
    width:190px !important;
    min-width:190px !important;
    max-width:190px !important;
  }
  .site-header .brand{height:72px !important;}
  .site-header .brand img{height:72px !important;}
}


/* ===== RECRUIT: PROFESSIONAL MONOCHROME BENEFIT ICONS ===== */
.recruit-points{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 22px;
  margin:22px 0 28px;
}
.recruit-points > span{
  display:flex!important;
  align-items:center;
  gap:11px;
  min-height:46px;
  color:#fff;
}
.recruit-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.48);
  border-radius:50%;
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(4px);
}
.recruit-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:#fff;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.recruit-points em{
  font-style:normal;
  font-weight:600;
  letter-spacing:.02em;
}
.recruit-points > span:hover .recruit-icon{
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.85);
  transform:translateY(-2px);
}
.recruit-icon{
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
@media(max-width:650px){
  .recruit-points{
    grid-template-columns:1fr;
    gap:10px;
  }
}

/* ===== RECRUIT ICONS V2 ===== */
.recruit-points em::before,
.recruit-points em::after{
  content:none!important;
}
.recruit-points > span{
  text-decoration:none!important;
}
.recruit-icon svg{
  stroke-width:1.7;
}


/* ===== FOOTER CONTACT UPDATE ===== */
.footer-contact .contact-row{
  display:flex;
  align-items:center;
  gap:9px;
  margin:8px 0;
  line-height:1.65;
}
.footer-contact .contact-address{
  align-items:flex-start;
}
.footer-contact .contact-icon{
  width:22px;
  height:22px;
  min-width:22px;
  display:grid;
  place-items:center;
  margin-top:1px;
  color:inherit;
}
.footer-contact .contact-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
/* Email icon intentionally same visual size as phone icon */
.footer-contact .contact-row:nth-of-type(3) .contact-icon svg{
  width:20px!important;
  height:20px!important;
}
.footer-contact a{
  color:inherit;
  text-decoration:none;
  word-break:break-word;
}
.footer-contact a:hover{
  color:var(--gold);
}
.line-block .line-badge{
  display:none!important;
}


/* ===== LINE OFFICIAL BADGE ===== */
.line-official-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px 7px 8px;
  margin-bottom:12px;
  border:1px solid #06c755;
  border-radius:999px;
  color:#06c755;
  background:rgba(6,199,85,.07);
  font-size:12px;
  font-weight:800;
  letter-spacing:.05em;
  line-height:1;
  white-space:nowrap;
}
.line-official-mark{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  color:#06c755;
}
.line-official-mark svg{
  width:24px;
  height:24px;
  display:block;
}

/* ===== FLOATING PHONE + BACK TO TOP ===== */
.floating-phone{
  position:fixed;left:22px;bottom:24px;z-index:9990;
  width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;
  background:#19a463;color:#fff!important;
  box-shadow:0 8px 25px rgba(0,0,0,.22);
  text-decoration:none;
}
.floating-phone svg{
  width:27px;height:27px;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
  animation:phoneShake 1.8s ease-in-out infinite;
}
.phone-rings{
  position:absolute;inset:-6px;border:2px solid rgba(25,164,99,.42);
  border-radius:50%;animation:ringPulse 1.8s ease-out infinite;
}
.floating-phone-number{
  position:absolute;left:70px;white-space:nowrap;
  background:#0b2749;color:#fff;padding:8px 12px;border-radius:5px;
  font-size:12px;font-weight:700;opacity:0;transform:translateX(-8px);
  pointer-events:none;transition:.22s ease;
}
.floating-phone:hover .floating-phone-number{opacity:1;transform:translateX(0)}
@keyframes phoneShake{
  0%,60%,100%{transform:rotate(0)}
  65%{transform:rotate(-13deg)}
  70%{transform:rotate(13deg)}
  75%{transform:rotate(-10deg)}
  80%{transform:rotate(10deg)}
  85%{transform:rotate(0)}
}
@keyframes ringPulse{
  0%{transform:scale(.9);opacity:.8}
  70%,100%{transform:scale(1.25);opacity:0}
}
.back-to-top{
  position:fixed;right:22px;bottom:24px;z-index:9990;
  width:52px;height:52px;border:0;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#0b2749;color:#fff;box-shadow:0 8px 25px rgba(0,0,0,.2);
  cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);
  transition:.25s ease;
}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top:hover{background:var(--gold);transform:translateY(-3px)}
.back-to-top svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.back-to-top span{font-size:8px;font-weight:800;letter-spacing:.08em;margin-top:-1px}
@media(max-width:600px){
  .floating-phone{left:14px;bottom:16px;width:54px;height:54px}
  .floating-phone-number{display:none}
  .back-to-top{right:14px;bottom:16px;width:48px;height:48px}
}
@media(prefers-reduced-motion:reduce){
  .floating-phone svg,.phone-rings{animation:none}
}

/* ===== KTS FIXED FLOATING CONTROLS V2 ===== */
#floatingCall.kts-floating-call{
  position:fixed!important;
  left:22px!important;
  bottom:24px!important;
  z-index:2147483000!important;
  width:62px!important;height:62px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border-radius:50%!important;
  background:#06c755!important;
  color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 8px 28px rgba(0,0,0,.28)!important;
  opacity:1!important;visibility:visible!important;
  transform:none!important;
  isolation:isolate;
}
#floatingCall.kts-floating-call > svg{
  position:relative;z-index:3;width:29px!important;height:29px!important;
  fill:none!important;stroke:#fff!important;stroke-width:2!important;
  stroke-linecap:round;stroke-linejoin:round;
  animation:ktsPhoneRing 1.5s ease-in-out infinite!important;
}
.kts-call-wave{
  position:absolute;inset:0;border:2px solid #06c755;border-radius:50%;
  z-index:-1;pointer-events:none;animation:ktsWave 1.8s ease-out infinite;
}
.kts-call-wave.wave-2{animation-delay:.6s}
.kts-call-tip{
  position:absolute;left:76px;top:50%;transform:translateY(-50%) translateX(-5px);
  background:#0b2749;color:#fff;padding:9px 13px;border-radius:6px;
  font-size:13px;font-weight:700;white-space:nowrap;
  opacity:0;visibility:hidden;transition:.2s ease;
  box-shadow:0 5px 16px rgba(0,0,0,.18);
}
#floatingCall:hover .kts-call-tip{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}
@keyframes ktsPhoneRing{
  0%,55%,100%{transform:rotate(0)}
  62%{transform:rotate(-16deg)}
  69%{transform:rotate(16deg)}
  76%{transform:rotate(-12deg)}
  83%{transform:rotate(12deg)}
  90%{transform:rotate(0)}
}
@keyframes ktsWave{
  0%{transform:scale(.9);opacity:.75}
  100%{transform:scale(1.55);opacity:0}
}

#ktsBackTop.kts-back-top{
  position:fixed!important;
  right:22px!important;
  bottom:24px!important;
  z-index:2147483000!important;
  width:58px!important;height:58px!important;
  display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;
  border:1px solid rgba(255,255,255,.25)!important;
  border-radius:50%!important;
  background:#0b2749!important;color:#fff!important;
  box-shadow:0 8px 28px rgba(0,0,0,.25)!important;
  cursor:pointer!important;
  opacity:1!important;visibility:visible!important;
  transform:none!important;
  transition:background .2s ease,transform .2s ease!important;
}
#ktsBackTop.kts-back-top:hover{background:#c99635!important;transform:translateY(-4px)!important}
#ktsBackTop svg{
  width:22px!important;height:22px!important;fill:none!important;
  stroke:#fff!important;stroke-width:2.2!important;stroke-linecap:round;stroke-linejoin:round;
}
#ktsBackTop span{display:block!important;font-size:9px!important;font-weight:800!important;line-height:1!important;margin-top:1px}
@media(max-width:600px){
  #floatingCall.kts-floating-call{left:14px!important;bottom:16px!important;width:56px!important;height:56px!important}
  #ktsBackTop.kts-back-top{right:14px!important;bottom:16px!important;width:52px!important;height:52px!important}
  .kts-call-tip{display:none!important}
}


/* ===== BACK TO TOP: SHOW ONLY NEAR BOTTOM ===== */
#ktsBackTop.kts-back-top{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(14px) scale(.96)!important;
}
#ktsBackTop.kts-back-top.kts-show{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
}
#ktsBackTop.kts-back-top.kts-show:hover{
  transform:translateY(-4px) scale(1)!important;
}
.real-sewing-machine{width:80px!important;height:80px!important;border:0!important;background:transparent!important;box-shadow:none!important;display:grid!important;place-items:center!important}.real-sewing-machine svg{width:78px!important;height:78px!important;filter:drop-shadow(0 7px 10px rgba(7,80,105,.16))}.real-sewing-stat{width:58px!important;height:58px!important;background:transparent!important;box-shadow:none!important;display:grid!important;place-items:center!important}.real-sewing-stat svg{width:58px!important;height:58px!important;display:block!important}
/* ===== PRODUCTION LINE: SQUARE SEWING MACHINE ICON ===== */
.real-sewing-stat{
  width:60px!important;
  height:60px!important;
  min-width:60px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:#eefbfe!important;
  box-shadow:0 5px 14px rgba(7,80,105,.12)!important;
}
.real-sewing-stat svg{
  width:60px!important;
  height:60px!important;
}
.real-sewing-stat svg > circle:first-child{
  display:none!important;
}

/* ===== STATS: UNIFORM ICON SIZE & SPACING ===== */
.stats-grid > div{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
}

/* One fixed icon slot for all 4 stats */
.stats-grid > div > b{
  width:64px!important;
  height:64px!important;
  min-width:64px!important;
  min-height:64px!important;
  margin:0 0 12px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  line-height:1!important;
}

/* Normalize every SVG/icon inside the slot */
.stats-grid > div > b svg{
  width:56px!important;
  height:56px!important;
  max-width:56px!important;
  max-height:56px!important;
  display:block!important;
  margin:0!important;
}

/* Production-line sewing machine uses exactly the same outer size */
.stats-grid .real-sewing-stat{
  width:64px!important;
  height:64px!important;
  min-width:64px!important;
  min-height:64px!important;
  margin:0 0 12px!important;
  border-radius:12px!important;
}
.stats-grid .real-sewing-stat svg{
  width:56px!important;
  height:56px!important;
}

/* Equal text spacing */
.stats-grid > div > p{
  margin:0 0 5px!important;
  min-height:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1.4!important;
}
.stats-grid > div > strong{
  margin:0!important;
  line-height:1.35!important;
  min-height:27px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Keep proportions consistent on smaller screens too */
@media(max-width:768px){
  .stats-grid > div > b,
  .stats-grid .real-sewing-stat{
    width:60px!important;
    height:60px!important;
    min-width:60px!important;
    min-height:60px!important;
    margin-bottom:10px!important;
  }
  .stats-grid > div > b svg,
  .stats-grid .real-sewing-stat svg{
    width:52px!important;
    height:52px!important;
  }
}


/* ===== STATS ICONS: SMALLER & MORE REFINED ===== */
.stats-grid > div > b,
.stats-grid .real-sewing-stat{
  width:50px!important;
  height:50px!important;
  min-width:50px!important;
  min-height:50px!important;
  margin:0 0 10px!important;
}

.stats-grid > div > b svg,
.stats-grid .real-sewing-stat svg{
  width:42px!important;
  height:42px!important;
  max-width:42px!important;
  max-height:42px!important;
}

/* Keep production-line square icon visually balanced */
.stats-grid .real-sewing-stat{
  border-radius:10px!important;
}

/* Same size on mobile so the four icons remain visually consistent */
@media(max-width:768px){
  .stats-grid > div > b,
  .stats-grid .real-sewing-stat{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    margin-bottom:9px!important;
  }

  .stats-grid > div > b svg,
  .stats-grid .real-sewing-stat svg{
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
  }
}


/* ===== STATS HOVER: PRODUCTION LINE ICON MOVES LIKE OTHERS ===== */

/* Give every stats icon the same smooth hover transition */
.stats-grid > div > b{
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease!important;
  transform-origin:center center!important;
}

/* All four stats icons lift slightly on hover */
.stats-grid > div:hover > b{
  transform:translateY(-4px) scale(1.05)!important;
}

/* Production line sewing-machine square also gets a subtle machine-motion effect */
.stats-grid > div:hover .real-sewing-stat,
.stats-grid > div:hover .production-machine-stat{
  animation:ktsMachineHover .55s ease-in-out!important;
  box-shadow:0 9px 20px rgba(7,80,105,.18)!important;
}

/* Tiny sewing-machine vibration, professional rather than exaggerated */
@keyframes ktsMachineHover{
  0%{transform:translateY(0) scale(1)}
  25%{transform:translateY(-3px) translateX(-1px) scale(1.04)}
  50%{transform:translateY(-4px) translateX(1px) scale(1.05)}
  75%{transform:translateY(-4px) translateX(-1px) scale(1.05)}
  100%{transform:translateY(-4px) translateX(0) scale(1.05)}
}

/* Keep SVG movement controlled inside the square icon */
.stats-grid > div:hover .real-sewing-stat svg,
.stats-grid > div:hover .production-machine-stat svg{
  animation:ktsSewNeedle .55s ease-in-out!important;
}

@keyframes ktsSewNeedle{
  0%,100%{transform:translateY(0)}
  35%{transform:translateY(1px)}
  70%{transform:translateY(-1px)}
}

@media(prefers-reduced-motion:reduce){
  .stats-grid > div:hover .real-sewing-stat,
  .stats-grid > div:hover .production-machine-stat,
  .stats-grid > div:hover .real-sewing-stat svg,
  .stats-grid > div:hover .production-machine-stat svg{
    animation:none!important;
  }
}


/* ===== STATS: ONE UNIFIED ICON STYLE ===== */
.stats-grid > div > .stat-icon{
  width:50px!important;
  height:50px!important;
  min-width:50px!important;
  min-height:50px!important;
  border-radius:12px!important;
  padding:0!important;
  margin:0 0 10px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  box-shadow:0 6px 15px rgba(7,29,60,.11)!important;
  transition:transform .22s ease,box-shadow .22s ease!important;
}

.stats-grid > div > .stat-icon svg{
  width:50px!important;
  height:50px!important;
  max-width:50px!important;
  max-height:50px!important;
  display:block!important;
  margin:0!important;
}

/* Production-line icon now matches the same rounded-square style */
.stats-grid .stat-production-line{
  border-radius:12px!important;
}

/* Same interaction for all 4 stats — no special sewing-machine vibration */
.stats-grid > div:hover > .stat-icon{
  transform:translateY(-4px) scale(1.05)!important;
  box-shadow:0 10px 22px rgba(7,29,60,.16)!important;
  animation:none!important;
}
.stats-grid > div:hover > .stat-icon svg{
  animation:none!important;
  transform:none!important;
}

/* Disable old production sewing icon treatments if any remain */
.stats-grid .real-sewing-stat,
.stats-grid .production-machine-stat{
  animation:none!important;
}

@media(max-width:768px){
  .stats-grid > div > .stat-icon{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    border-radius:11px!important;
  }
  .stats-grid > div > .stat-icon svg{
    width:48px!important;
    height:48px!important;
    max-width:48px!important;
    max-height:48px!important;
  }
}


/* ===== PRODUCTION LINE ICON: WHITE MONOCHROME TO MATCH OTHER STATS ===== */
.stats-grid .stat-production-line-white{
  width:50px!important;
  height:50px!important;
  min-width:50px!important;
  min-height:50px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:transparent!important;
  box-shadow:0 6px 15px rgba(7,29,60,.11)!important;
}
.stats-grid .stat-production-line-white svg{
  width:50px!important;
  height:50px!important;
  display:block!important;
}
.stats-grid > div:hover .stat-production-line-white{
  transform:translateY(-4px) scale(1.05)!important;
  box-shadow:0 10px 22px rgba(7,29,60,.16)!important;
}
@media(max-width:768px){
  .stats-grid .stat-production-line-white,
  .stats-grid .stat-production-line-white svg{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
  }
}


/* ===== PRODUCTION LINE: MATCH THE OTHER 3 STAT ICONS ===== */
.stats-grid .stat-production-matched{
  width:50px!important;
  height:50px!important;
  min-width:50px!important;
  min-height:50px!important;
  margin:0 0 10px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;

  /* No colored square / no colored background */
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;

  /* Colored icon itself, same clean icon-family feeling */
  color:#1596b8!important;
}

.stats-grid .stat-production-matched svg{
  width:42px!important;
  height:42px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.15!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* Keep the exact same hover motion as the other statistics icons */
.stats-grid > div:hover .stat-production-matched{
  transform:translateY(-4px) scale(1.05)!important;
  animation:none!important;
  box-shadow:none!important;
}

.stats-grid > div:hover .stat-production-matched svg{
  transform:none!important;
  animation:none!important;
}

@media(max-width:768px){
  .stats-grid .stat-production-matched{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
  }
  .stats-grid .stat-production-matched svg{
    width:40px!important;
    height:40px!important;
  }
}


/* ===== STATS: MONOCHROME + EXACTLY EQUAL SIZE ===== */
.stats-grid > div{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
}

.stats-grid > div > .stat-icon.stat-mono{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  max-width:48px!important;
  max-height:48px!important;
  margin:0 0 10px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#1f2937!important;
  overflow:visible!important;
  line-height:1!important;
  transition:transform .2s ease, opacity .2s ease!important;
}

.stats-grid > div > .stat-icon.stat-mono svg{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  max-width:40px!important;
  max-height:40px!important;
  display:block!important;
  fill:none!important;
  stroke:#1f2937!important;
  stroke-width:2.1!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  animation:none!important;
}

/* Identical hover behavior for all four */
.stats-grid > div:hover > .stat-icon.stat-mono{
  transform:translateY(-3px)!important;
  opacity:.72!important;
  animation:none!important;
}

/* Identical text spacing */
.stats-grid > div > p{
  margin:0 0 5px!important;
  min-height:22px!important;
  line-height:1.4!important;
}
.stats-grid > div > strong{
  margin:0!important;
  min-height:26px!important;
  line-height:1.35!important;
}

/* Do NOT resize icons differently on mobile */
@media(max-width:768px){
  .stats-grid > div > .stat-icon.stat-mono{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    max-width:48px!important;
    max-height:48px!important;
  }
  .stats-grid > div > .stat-icon.stat-mono svg{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
  }
}


/* ===== STATS FINAL: PURE WHITE + EXACTLY EQUAL ===== */
.stats-grid > div > .stat-icon.stat-mono{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  max-width:48px!important;
  max-height:48px!important;
  color:#ffffff!important;
  opacity:1!important;
}

.stats-grid > div > .stat-icon.stat-mono svg{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  max-width:40px!important;
  max-height:40px!important;
  fill:none!important;
  stroke:#ffffff!important;
  color:#ffffff!important;
  opacity:1!important;
}

/* Keep all four icons equally visible on hover */
.stats-grid > div:hover > .stat-icon.stat-mono{
  transform:translateY(-3px)!important;
  opacity:1!important;
}

.stats-grid > div:hover > .stat-icon.stat-mono svg{
  stroke:#ffffff!important;
  opacity:1!important;
}


/* ===== PRODUCTION LINE: WHITE SEWING MACHINE ICON ===== */
.stats-grid .stat-sewing-line{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  max-width:48px!important;
  max-height:48px!important;
  color:#fff!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.stats-grid .stat-sewing-line svg{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  max-width:40px!important;
  max-height:40px!important;
  fill:none!important;
  stroke:#fff!important;
  stroke-width:2.05!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.stats-grid > div:hover .stat-sewing-line{
  transform:translateY(-3px)!important;
  opacity:1!important;
}


/* ===== SERVICE FLOW: KEEP EVERY ICON FULLY INSIDE ITS CIRCLE ===== */
.services .service-step .circle{
  width:76px!important;
  height:76px!important;
  min-width:76px!important;
  min-height:76px!important;
  max-width:76px!important;
  max-height:76px!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:12px!important;
  line-height:1!important;
}

/* SVG / image icons are limited to a safe inner area */
.services .service-step .circle svg,
.services .service-step .circle img{
  width:42px!important;
  height:42px!important;
  min-width:0!important;
  min-height:0!important;
  max-width:42px!important;
  max-height:42px!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
  margin:0!important;
  position:static!important;
}

/* Also constrain font/icon-library symbols */
.services .service-step .circle i,
.services .service-step .circle span{
  max-width:42px!important;
  max-height:42px!important;
  font-size:32px!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Sewing-machine icon had its own larger dimensions: override them here */
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:76px!important;
  height:76px!important;
  min-width:76px!important;
  min-height:76px!important;
  max-width:76px!important;
  max-height:76px!important;
  padding:12px!important;
  border-radius:50%!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:46px!important;
  height:46px!important;
  min-width:0!important;
  min-height:0!important;
  max-width:46px!important;
  max-height:46px!important;
  filter:none!important;
}

/* Hover moves the complete circle, never enlarges artwork beyond the border */
.services .service-step:hover .circle{
  transform:translateY(-4px)!important;
  overflow:hidden!important;
}

.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle i,
.services .service-step:hover .circle span{
  transform:none!important;
  scale:1!important;
}

/* Remove old special sewing icon scale on hover */
.services .service-step:hover .real-sewing-machine-icon,
.services .service-step:hover .circle.real-sewing-machine{
  transform:translateY(-4px)!important;
}

@media(max-width:768px){
  .services .service-step .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:70px!important;
    height:70px!important;
    min-width:70px!important;
    min-height:70px!important;
    max-width:70px!important;
    max-height:70px!important;
    padding:11px!important;
  }

  .services .service-step .circle svg,
  .services .service-step .circle img,
  .services .service-step .circle.real-sewing-machine svg,
  .services .service-step .real-sewing-machine-icon svg{
    width:40px!important;
    height:40px!important;
    max-width:40px!important;
    max-height:40px!important;
  }
}

/* ===== SERVICE ICONS V2: LARGE LIKE ORIGINAL, SEWING + QC SAFE INSIDE ===== */
.services .service-step .circle{
  width:86px!important;
  height:86px!important;
  min-width:86px!important;
  min-height:86px!important;
  max-width:86px!important;
  max-height:86px!important;
  padding:8px!important;
  border-radius:50%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Normal service icons: large like the original design */
.services .service-step .circle svg,
.services .service-step .circle img{
  width:56px!important;
  height:56px!important;
  max-width:56px!important;
  max-height:56px!important;
  object-fit:contain!important;
}
.services .service-step .circle > i,
.services .service-step .circle > span{
  font-size:42px!important;
  max-width:58px!important;
  max-height:58px!important;
}

/* Sewing: keep it large, but with enough breathing room */
.services .service-step:has([data-i18n="services.sew"]) .circle,
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:86px!important;
  height:86px!important;
  min-width:86px!important;
  min-height:86px!important;
  max-width:86px!important;
  max-height:86px!important;
  padding:12px!important;
  overflow:hidden!important;
  border-radius:50%!important;
}
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:52px!important;
  height:52px!important;
  max-width:52px!important;
  max-height:52px!important;
  transform:none!important;
  filter:none!important;
}

/* QC / inspection: slightly smaller than normal to prevent magnifier/detail crossing circle */
.services .service-step:has([data-i18n="services.qc"]) .circle{
  padding:12px!important;
  overflow:hidden!important;
}
.services .service-step:has([data-i18n="services.qc"]) .circle svg,
.services .service-step:has([data-i18n="services.qc"]) .circle img{
  width:50px!important;
  height:50px!important;
  max-width:50px!important;
  max-height:50px!important;
}
.services .service-step:has([data-i18n="services.qc"]) .circle > i,
.services .service-step:has([data-i18n="services.qc"]) .circle > span{
  font-size:38px!important;
  max-width:50px!important;
  max-height:50px!important;
}

/* Hover: move circle only. Never scale the artwork inside. */
.services .service-step:hover .circle{
  transform:translateY(-5px)!important;
  overflow:hidden!important;
}
.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle > i,
.services .service-step:hover .circle > span{
  transform:none!important;
  scale:1!important;
}

/* Mobile: still visibly large */
@media(max-width:768px){
  .services .service-step .circle,
  .services .service-step:has([data-i18n="services.sew"]) .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:80px!important;
    height:80px!important;
    min-width:80px!important;
    min-height:80px!important;
    max-width:80px!important;
    max-height:80px!important;
  }
  .services .service-step .circle svg,
  .services .service-step .circle img{
    width:52px!important;
    height:52px!important;
    max-width:52px!important;
    max-height:52px!important;
  }
  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step:has([data-i18n="services.qc"]) .circle svg{
    width:47px!important;
    height:47px!important;
    max-width:47px!important;
    max-height:47px!important;
  }
}


/* =========================================================
   SERVICE FLOW FINAL
   - Outer white circles: LARGE like the original design
   - Inner artwork only: slightly smaller, fully contained
   ========================================================= */

.services .service-step .circle,
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:96px!important;
  height:96px!important;
  min-width:96px!important;
  min-height:96px!important;
  max-width:96px!important;
  max-height:96px!important;

  padding:0!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  overflow:hidden!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  /* Keep the original white-circle visual */
  background:#fff!important;
}

/* All inner SVG / image artwork is smaller than the white circle */
.services .service-step .circle svg,
.services .service-step .circle img,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:58px!important;
  height:58px!important;
  min-width:0!important;
  min-height:0!important;
  max-width:58px!important;
  max-height:58px!important;

  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:0!important;

  transform:none!important;
  scale:1!important;
}

/* Font / icon-library symbols: large, but still inside */
.services .service-step .circle > i,
.services .service-step .circle > span{
  width:60px!important;
  height:60px!important;
  max-width:60px!important;
  max-height:60px!important;
  font-size:46px!important;
  line-height:1!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  margin:0!important;
  transform:none!important;
}

/* Sewing machine: slightly smaller artwork because it is wider */
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:54px!important;
  height:54px!important;
  max-width:54px!important;
  max-height:54px!important;
  filter:none!important;
}

/* Inspection / Quality Control: keep magnifier/details safely inside */
.services .service-step:has([data-i18n="services.qc"]) .circle svg,
.services .service-step:has([data-i18n="services.qc"]) .circle img{
  width:54px!important;
  height:54px!important;
  max-width:54px!important;
  max-height:54px!important;
}

.services .service-step:has([data-i18n="services.qc"]) .circle > i,
.services .service-step:has([data-i18n="services.qc"]) .circle > span{
  width:56px!important;
  height:56px!important;
  max-width:56px!important;
  max-height:56px!important;
  font-size:42px!important;
}

/* Hover: the big white circle moves, inner icon NEVER grows */
.services .service-step:hover .circle,
.services .service-step:hover .circle.real-sewing-machine,
.services .service-step:hover .real-sewing-machine-icon{
  transform:translateY(-6px)!important;
  overflow:hidden!important;
}

.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle > i,
.services .service-step:hover .circle > span,
.services .service-step:hover .circle.real-sewing-machine svg,
.services .service-step:hover .real-sewing-machine-icon svg{
  transform:none!important;
  scale:1!important;
  animation:none!important;
}

/* Mobile: circles remain prominent, only slightly reduced */
@media(max-width:768px){
  .services .service-step .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:88px!important;
    height:88px!important;
    min-width:88px!important;
    min-height:88px!important;
    max-width:88px!important;
    max-height:88px!important;
  }

  .services .service-step .circle svg,
  .services .service-step .circle img{
    width:52px!important;
    height:52px!important;
    max-width:52px!important;
    max-height:52px!important;
  }

  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step:has([data-i18n="services.qc"]) .circle svg{
    width:49px!important;
    height:49px!important;
    max-width:49px!important;
    max-height:49px!important;
  }

  .services .service-step .circle > i,
  .services .service-step .circle > span{
    font-size:42px!important;
  }
}


/* ===== SERVICE ICONS FINAL: LARGER INNER ARTWORK ===== */
.services .service-step .circle,
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:96px!important;
  height:96px!important;
  min-width:96px!important;
  min-height:96px!important;
  max-width:96px!important;
  max-height:96px!important;
  overflow:hidden!important;
  border-radius:50%!important;
}

/* Make normal icons much larger */
.services .service-step .circle svg,
.services .service-step .circle img{
  width:70px!important;
  height:70px!important;
  max-width:70px!important;
  max-height:70px!important;
  object-fit:contain!important;
}

/* Text/icon-font symbols */
.services .service-step .circle > i,
.services .service-step .circle > span{
  width:72px!important;
  height:72px!important;
  max-width:72px!important;
  max-height:72px!important;
  font-size:55px!important;
  line-height:1!important;
}

/* Sewing machine: large but still safely inside the circle */
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:66px!important;
  height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
}

/* Inspection / Quality Control: large but prevent magnifier/details clipping */
.services .service-step:has([data-i18n="services.qc"]) .circle svg,
.services .service-step:has([data-i18n="services.qc"]) .circle img{
  width:65px!important;
  height:65px!important;
  max-width:65px!important;
  max-height:65px!important;
}
.services .service-step:has([data-i18n="services.qc"]) .circle > i,
.services .service-step:has([data-i18n="services.qc"]) .circle > span{
  width:67px!important;
  height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  font-size:51px!important;
}

/* Never enlarge the inner artwork on hover */
.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle > i,
.services .service-step:hover .circle > span{
  transform:none!important;
  scale:1!important;
}

/* Mobile */
@media(max-width:768px){
  .services .service-step .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:88px!important;
    height:88px!important;
    min-width:88px!important;
    min-height:88px!important;
    max-width:88px!important;
    max-height:88px!important;
  }

  .services .service-step .circle svg,
  .services .service-step .circle img{
    width:63px!important;
    height:63px!important;
    max-width:63px!important;
    max-height:63px!important;
  }

  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step:has([data-i18n="services.qc"]) .circle svg{
    width:59px!important;
    height:59px!important;
    max-width:59px!important;
    max-height:59px!important;
  }
}


/* ===== SEWING ICON: SAME WHITE CIRCLE AS ALL SERVICE ICONS ===== */
.services .service-step:has([data-i18n="services.sew"]) .circle,
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:96px!important;
  height:96px!important;
  min-width:96px!important;
  min-height:96px!important;
  max-width:96px!important;
  max-height:96px!important;
  border-radius:50%!important;
  background:#ffffff!important;
  border:2px solid #ffffff!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  box-shadow:0 8px 22px rgba(0,0,0,.10)!important;
}

/* Keep the sewing machine large, centered, and inside the white circle */
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:66px!important;
  height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
  display:block!important;
  margin:0!important;
  transform:none!important;
  filter:none!important;
}

/* Hover moves the whole white circle, exactly like the others */
.services .service-step:hover:has([data-i18n="services.sew"]) .circle,
.services .service-step:hover .circle.real-sewing-machine,
.services .service-step:hover .real-sewing-machine-icon{
  transform:translateY(-6px)!important;
  border-color:#ffffff!important;
  overflow:hidden!important;
}

@media(max-width:768px){
  .services .service-step:has([data-i18n="services.sew"]) .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:88px!important;
    height:88px!important;
    min-width:88px!important;
    min-height:88px!important;
    max-width:88px!important;
    max-height:88px!important;
  }
  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step .circle.real-sewing-machine svg,
  .services .service-step .real-sewing-machine-icon svg{
    width:60px!important;
    height:60px!important;
    max-width:60px!important;
    max-height:60px!important;
  }
}


/* ===== ALL SERVICE ICONS: SAME WHITE CIRCLE AS SEWING ===== */
.services .service-step .circle{
  width:96px!important;
  height:96px!important;
  min-width:96px!important;
  min-height:96px!important;
  max-width:96px!important;
  max-height:96px!important;

  border-radius:50%!important;
  background:#ffffff!important;
  border:2px solid #ffffff!important;
  box-sizing:border-box!important;
  overflow:hidden!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;

  box-shadow:0 8px 22px rgba(0,0,0,.10)!important;
}

/* Keep icon artwork large and centered */
.services .service-step .circle svg,
.services .service-step .circle img{
  width:66px!important;
  height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
  display:block!important;
  margin:0!important;
  object-fit:contain!important;
  transform:none!important;
}

/* For font/icon symbols */
.services .service-step .circle > i,
.services .service-step .circle > span{
  width:66px!important;
  height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
  font-size:50px!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
}

/* Sewing and QC stay safely within the identical white circle */
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:64px!important;
  height:64px!important;
  max-width:64px!important;
  max-height:64px!important;
}

.services .service-step:has([data-i18n="services.qc"]) .circle svg,
.services .service-step:has([data-i18n="services.qc"]) .circle img{
  width:62px!important;
  height:62px!important;
  max-width:62px!important;
  max-height:62px!important;
}

/* Uniform hover effect */
.services .service-step:hover .circle{
  transform:translateY(-6px)!important;
  border-color:#ffffff!important;
  box-shadow:0 13px 28px rgba(0,0,0,.15)!important;
  overflow:hidden!important;
}

.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle > i,
.services .service-step:hover .circle > span{
  transform:none!important;
  scale:1!important;
  animation:none!important;
}

@media(max-width:768px){
  .services .service-step .circle{
    width:88px!important;
    height:88px!important;
    min-width:88px!important;
    min-height:88px!important;
    max-width:88px!important;
    max-height:88px!important;
  }

  .services .service-step .circle svg,
  .services .service-step .circle img{
    width:60px!important;
    height:60px!important;
    max-width:60px!important;
    max-height:60px!important;
  }

  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step:has([data-i18n="services.qc"]) .circle svg{
    width:57px!important;
    height:57px!important;
    max-width:57px!important;
    max-height:57px!important;
  }
}

/* ===== SERVICE ICONS: COMPACT CIRCLE CLOSE TO ARTWORK ===== */
.services .service-step .circle,
.services .service-step .circle.real-sewing-machine,
.services .service-step .real-sewing-machine-icon{
  width:78px!important;height:78px!important;
  min-width:78px!important;min-height:78px!important;
  max-width:78px!important;max-height:78px!important;
  padding:0!important;border-radius:50%!important;
  background:#fff!important;border:2px solid #fff!important;
  overflow:hidden!important;box-sizing:border-box!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  box-shadow:0 6px 16px rgba(0,0,0,.10)!important;
}
.services .service-step .circle svg,
.services .service-step .circle img{
  width:58px!important;height:58px!important;
  max-width:58px!important;max-height:58px!important;
  object-fit:contain!important;transform:none!important;
}
.services .service-step .circle > i,
.services .service-step .circle > span{
  width:58px!important;height:58px!important;
  max-width:58px!important;max-height:58px!important;
  font-size:45px!important;line-height:1!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
/* Wide/detail-heavy icons get a little more safety margin */
.services .service-step:has([data-i18n="services.sew"]) .circle svg,
.services .service-step:has([data-i18n="services.qc"]) .circle svg,
.services .service-step .circle.real-sewing-machine svg,
.services .service-step .real-sewing-machine-icon svg{
  width:54px!important;height:54px!important;
  max-width:54px!important;max-height:54px!important;
}
.services .service-step:hover .circle,
.services .service-step:hover .circle.real-sewing-machine,
.services .service-step:hover .real-sewing-machine-icon{
  transform:translateY(-5px)!important;
  overflow:hidden!important;
}
.services .service-step:hover .circle svg,
.services .service-step:hover .circle img,
.services .service-step:hover .circle > i,
.services .service-step:hover .circle > span{
  transform:none!important;scale:1!important;animation:none!important;
}
@media(max-width:768px){
  .services .service-step .circle,
  .services .service-step .circle.real-sewing-machine,
  .services .service-step .real-sewing-machine-icon{
    width:74px!important;height:74px!important;
    min-width:74px!important;min-height:74px!important;
    max-width:74px!important;max-height:74px!important;
  }
  .services .service-step .circle svg,
  .services .service-step .circle img{
    width:54px!important;height:54px!important;
    max-width:54px!important;max-height:54px!important;
  }
  .services .service-step:has([data-i18n="services.sew"]) .circle svg,
  .services .service-step:has([data-i18n="services.qc"]) .circle svg{
    width:50px!important;height:50px!important;
    max-width:50px!important;max-height:50px!important;
  }
}


/* =========================================================
   KTS GARMENT — FINAL HEADER / FOOTER LOGOS
   Header: blue K logo (transparent PNG)
   Footer: white K logo (transparent PNG)
   ========================================================= */

.site-header .brand{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex:0 0 auto!important;
  width:205px!important;
  min-width:205px!important;
  height:78px!important;
  overflow:visible!important;
}

.site-header .brand .header-logo{
  display:block!important;
  width:205px!important;
  height:78px!important;
  object-fit:contain!important;
  object-position:left center!important;
  flex:none!important;
  background:transparent!important;
}

.footer-brand .footer-logo{
  display:block!important;
  width:205px!important;
  height:auto!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:left center!important;
  background:transparent!important;
  margin:0 0 10px!important;
}

/* Responsive: preserve visual size as much as possible */
@media(max-width:1100px){
  .site-header .brand{
    width:190px!important;
    min-width:190px!important;
    height:74px!important;
  }
  .site-header .brand .header-logo{
    width:190px!important;
    height:74px!important;
  }
}

@media(max-width:768px){
  .site-header .brand{
    width:175px!important;
    min-width:175px!important;
    height:68px!important;
  }
  .site-header .brand .header-logo{
    width:175px!important;
    height:68px!important;
  }
  .footer-brand .footer-logo{
    width:185px!important;
  }
}

@media(max-width:420px){
  .site-header .brand{
    width:165px!important;
    min-width:165px!important;
  }
  .site-header .brand .header-logo{
    width:165px!important;
  }
}


/* ===== FINAL WHITE FOOTER LOGO ===== */
.footer-brand .footer-logo{
  display:block!important;
  width:215px!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:left center!important;
  background:transparent!important;
  margin:0 0 10px!important;
  filter:none!important;
}
@media(max-width:768px){
  .footer-brand .footer-logo{
    width:190px!important;
  }
}


/* ===== FOOTER WHITE LOGO: CLEAR, UNMASKED ===== */
.footer-brand .footer-logo{
  width:225px!important;
  height:auto!important;
  max-width:100%!important;
  display:block!important;
  object-fit:contain!important;
  background:transparent!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  -webkit-mask:none!important;
  mask:none!important;
}
@media(max-width:768px){
  .footer-brand .footer-logo{
    width:195px!important;
  }
}


/* =========================================================
   FINAL KTS LOGO — SAME LOGO IN HEADER + FOOTER
   ========================================================= */
.site-header .brand{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex:0 0 205px!important;
  width:205px!important;
  min-width:205px!important;
  max-width:205px!important;
  height:78px!important;
  overflow:visible!important;
}
.site-header .brand .header-logo{
  display:block!important;
  width:205px!important;
  min-width:205px!important;
  max-width:205px!important;
  height:78px!important;
  object-fit:contain!important;
  object-position:left center!important;
  background:transparent!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}

.footer-brand .footer-logo{
  display:block!important;
  width:220px!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:left center!important;
  background:transparent!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  margin:0 0 10px!important;
}

@media(max-width:1100px){
  .site-header .brand{
    width:190px!important;
    min-width:190px!important;
    max-width:190px!important;
    height:74px!important;
  }
  .site-header .brand .header-logo{
    width:190px!important;
    min-width:190px!important;
    max-width:190px!important;
    height:74px!important;
  }
}
@media(max-width:768px){
  .site-header .brand{
    width:175px!important;
    min-width:175px!important;
    max-width:175px!important;
    height:68px!important;
  }
  .site-header .brand .header-logo{
    width:175px!important;
    min-width:175px!important;
    max-width:175px!important;
    height:68px!important;
  }
  .footer-brand .footer-logo{
    width:195px!important;
  }
}


/* =========================================================
   FOOTER — NEW HORIZONTAL KTS LOGO
   Header remains unchanged.
   ========================================================= */
.footer-brand .footer-logo-new{
  display:block!important;
  width:220px!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:left center!important;
  background:transparent!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  margin:0 0 10px!important;
}

@media(max-width:768px){
  .footer-brand .footer-logo-new{
    width:195px!important;
  }
}


/* ===== FOOTER LOGO + LINE QR FINAL ===== */
.footer-brand{
  align-items:center!important;
  text-align:center!important;
}
.footer-brand .footer-logo-round{
  display:block!important;
  width:182px!important;
  height:182px!important;
  object-fit:contain!important;
  margin:0 auto 12px!important;
  background:transparent!important;
  opacity:1!important;
  filter:none!important;
}
.line-block{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  text-align:center!important;
}
.line-block .line-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:74px!important;
  height:30px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  background:#06c755!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
.line-block .line-qr-image{
  display:block!important;
  width:148px!important;
  height:148px!important;
  object-fit:contain!important;
  box-sizing:border-box!important;
  padding:7px!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(0,0,0,.20)!important;
}
@media(max-width:768px){
  .footer-brand .footer-logo-round{
    width:155px!important;
    height:155px!important;
  }
  .line-block .line-qr-image{
    width:132px!important;
    height:132px!important;
  }
}


/* =========================================================
   FOOTER FINAL
   - Compact lower logo
   - One LINE QR only
   - QR placed at the very end above copyright
   ========================================================= */

.footer-brand .footer-logo-round,
.footer-brand .footer-logo-round-new{
  width:138px!important;
  height:138px!important;
  min-width:138px!important;
  min-height:138px!important;
  max-width:138px!important;
  max-height:138px!important;
  margin:0 auto 10px!important;
  object-fit:contain!important;
}

.footer-line-end{
  width:min(1180px, calc(100% - 40px));
  margin:22px auto 0!important;
  padding:20px 0 18px!important;
  border-top:1px solid rgba(255,255,255,.22)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  text-align:center!important;
}

.footer-line-end .line-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:72px!important;
  height:29px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  background:#06c755!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}

.footer-line-end .line-qr-image{
  display:block!important;
  width:118px!important;
  height:118px!important;
  object-fit:contain!important;
  padding:6px!important;
  box-sizing:border-box!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(0,0,0,.18)!important;
}

/* Old QR containers must never appear. */
footer .line-block,
footer .line-qr-card{
  display:none!important;
}

@media(max-width:768px){
  .footer-brand .footer-logo-round,
  .footer-brand .footer-logo-round-new{
    width:122px!important;
    height:122px!important;
    min-width:122px!important;
    min-height:122px!important;
    max-width:122px!important;
    max-height:122px!important;
  }

  .footer-line-end{
    width:calc(100% - 28px);
    margin-top:16px!important;
    padding-top:17px!important;
  }

  .footer-line-end .line-qr-image{
    width:108px!important;
    height:108px!important;
  }
}


/* =========================================================
   FOOTER FINAL ROW LAYOUT
   - Smaller logo
   - One LINE QR
   - QR stays on the same row, at the far right
   ========================================================= */

footer .footer-grid{
  display:grid!important;
  grid-template-columns:
    minmax(120px, .85fr)
    repeat(5, minmax(105px, .8fr))
    minmax(190px, 1.2fr)
    minmax(125px, .75fr)!important;
  gap:28px!important;
  align-items:start!important;
}

/* Smaller footer logo */
.footer-brand .footer-logo-round,
.footer-brand .footer-logo-round-new,
.footer-brand .footer-logo{
  width:108px!important;
  height:108px!important;
  min-width:108px!important;
  min-height:108px!important;
  max-width:108px!important;
  max-height:108px!important;
  margin:0 auto 10px!important;
  object-fit:contain!important;
}

/* QR belongs to the same footer row and sits at the far right */
.footer-line-end{
  width:auto!important;
  margin:0!important;
  padding:0!important;
  border-top:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  text-align:center!important;
  grid-column:auto!important;
  align-self:start!important;
}

.footer-line-end .line-badge{
  min-width:72px!important;
  height:28px!important;
  padding:0 12px!important;
  font-size:11px!important;
}

.footer-line-end .line-qr-image{
  width:104px!important;
  height:104px!important;
  padding:5px!important;
  border-radius:9px!important;
}

/* Tablet */
@media(max-width:1100px){
  footer .footer-grid{
    grid-template-columns:
      minmax(110px, .9fr)
      repeat(3, minmax(120px, 1fr))
      minmax(170px, 1.2fr)
      minmax(120px, .8fr)!important;
    gap:24px!important;
  }

  .footer-brand .footer-logo-round,
  .footer-brand .footer-logo-round-new,
  .footer-brand .footer-logo{
    width:100px!important;
    height:100px!important;
    min-width:100px!important;
    min-height:100px!important;
    max-width:100px!important;
    max-height:100px!important;
  }
}

/* Mobile: stack cleanly */
@media(max-width:768px){
  footer .footer-grid{
    grid-template-columns:1fr 1fr!important;
    gap:24px 18px!important;
  }

  .footer-brand{
    grid-column:1 / -1!important;
  }

  .footer-contact{
    grid-column:1 / -1!important;
  }

  .footer-line-end{
    grid-column:1 / -1!important;
    margin-top:4px!important;
  }

  .footer-brand .footer-logo-round,
  .footer-brand .footer-logo-round-new,
  .footer-brand .footer-logo{
    width:96px!important;
    height:96px!important;
    min-width:96px!important;
    min-height:96px!important;
    max-width:96px!important;
    max-height:96px!important;
  }

  .footer-line-end .line-qr-image{
    width:98px!important;
    height:98px!important;
  }
}


/* =========================================================
   FOOTER: LINE QR DIRECTLY NEXT TO 連絡先
   ========================================================= */
footer .footer-grid{
  display:grid!important;
  grid-template-columns:
    minmax(115px,.8fr)
    repeat(5,minmax(100px,.72fr))
    minmax(205px,1.25fr)
    minmax(118px,.72fr)!important;
  gap:26px!important;
  align-items:start!important;
}

.footer-contact{
  grid-column:auto!important;
  min-width:0!important;
}

.footer-line-end{
  grid-column:auto!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  align-self:start!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  text-align:center!important;
}

/* Compact logo and QR for a clean single-row footer */
.footer-brand .footer-logo-round,
.footer-brand .footer-logo-round-new,
.footer-brand .footer-logo{
  width:102px!important;
  height:102px!important;
  min-width:102px!important;
  min-height:102px!important;
  max-width:102px!important;
  max-height:102px!important;
}

.footer-line-end .line-badge{
  min-width:70px!important;
  height:27px!important;
  padding:0 12px!important;
  font-size:11px!important;
}

.footer-line-end .line-qr-image{
  width:102px!important;
  height:102px!important;
  padding:5px!important;
  border-radius:9px!important;
}

/* Tablet */
@media(max-width:1100px){
  footer .footer-grid{
    grid-template-columns:
      minmax(105px,.8fr)
      repeat(3,minmax(115px,1fr))
      minmax(190px,1.25fr)
      minmax(112px,.75fr)!important;
    gap:22px!important;
  }
}

/* Mobile */
@media(max-width:768px){
  footer .footer-grid{
    grid-template-columns:1fr 1fr!important;
    gap:22px 16px!important;
  }

  .footer-brand{
    grid-column:1 / -1!important;
  }

  .footer-contact{
    grid-column:1 / 2!important;
  }

  .footer-line-end{
    grid-column:2 / 3!important;
    align-self:start!important;
  }

  .footer-brand .footer-logo-round,
  .footer-brand .footer-logo-round-new,
  .footer-brand .footer-logo{
    width:94px!important;
    height:94px!important;
    min-width:94px!important;
    min-height:94px!important;
    max-width:94px!important;
    max-height:94px!important;
  }

  .footer-line-end .line-qr-image{
    width:96px!important;
    height:96px!important;
  }
}

@media(max-width:480px){
  .footer-contact,
  .footer-line-end{
    grid-column:1 / -1!important;
  }
}