/* Preserve the original routed content; use the deployment site's shared shell. */
html, body { background:#090909; }
body > img:not([data-keep-visible]) { display:none !important; }
#app .layout_header, #app .nav-container, #app footer, #app .layout_footer { display:none !important; }
#app .layout_container { display:block !important; width:100%; height:auto !important; min-height:0 !important; overflow:visible !important; }
#app .layout_main { display:block; width:100%; height:auto !important; min-height:0 !important; flex:none !important; overflow:visible !important; margin-top:0 !important; padding-top:0; }
#app .template-banner { width:100%; height:auto; min-height:0; max-height:none; margin:0; padding:0; background:none; }
#app .template-banner > :not(widestep-hero) { display:none !important; }
#app .template-home { display:flex; flex-direction:column; }
#app .template-home > * { order:3; }
#app .template-home > .template-banner { order:0; }
#app .template-home > .reference-about { order:1; }
#app .template-home > .reference-stats { order:2; }
#app .reference-stats :is(.stats-num,.stats-label) { color:#fff !important; }
widestep-header { position:relative; z-index:10000; isolation:isolate; pointer-events:auto; }
widestep-hero, widestep-footer { display:block; }
widestep-footer { position:relative; z-index:2; margin-top:-1px; background:#090909; }
.mobile-org-pager { display:none; }
.wide-team-section { padding:96px 6vw 88px; background:#0b0b0b; color:#fff; font-family:Arial,Helvetica,sans-serif; }
.wide-team-section .team-heading { max-width:1540px; margin:0 auto 48px; display:grid; grid-template-columns:minmax(340px,.9fr) minmax(420px,1.1fr); gap:7vw; align-items:end; }
.wide-team-section .team-kicker { display:block; margin-bottom:16px; color:#f36817; font-size:15px; font-weight:700; letter-spacing:.18em; }
.wide-team-section .team-heading h2 { margin:0; font-size:clamp(48px,5.2vw,86px); line-height:.9; letter-spacing:-.05em; }
.wide-team-section .team-heading > p { max-width:720px; margin:0 0 5px; color:rgba(255,255,255,.7); font-size:clamp(18px,1.35vw,24px); line-height:1.6; }
.wide-team-section .team-visual { max-width:1540px; height:clamp(430px,45vw,720px); margin:0 auto; overflow:hidden; border-radius:28px; }
.wide-team-section .team-visual img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.wide-team-section .team-visual:hover img { transform:scale(1.025); }
.wide-team-section .team-disciplines { max-width:1540px; margin:0 auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid #333; border-bottom:1px solid #333; }
.wide-team-section .team-disciplines article { min-height:220px; padding:34px 28px; border-right:1px solid #333; transition:background .3s ease,color .3s ease; }
.wide-team-section .team-disciplines article:last-child { border-right:0; }
.wide-team-section .team-disciplines article:hover { background:#f36817; }
.wide-team-section .team-disciplines span { color:#f36817; font-size:13px; font-weight:700; letter-spacing:.12em; }
.wide-team-section .team-disciplines article:hover span { color:#fff; }
.wide-team-section .team-disciplines h3 { margin:28px 0 14px; font-size:clamp(20px,1.5vw,28px); line-height:1.12; }
.wide-team-section .team-disciplines p { margin:0; color:rgba(255,255,255,.62); font-size:16px; line-height:1.5; }
.wide-team-section .team-disciplines article:hover p { color:#fff; }
.wide-team-section .leadership-heading { max-width:1540px; margin:72px auto 28px; display:flex; align-items:end; justify-content:space-between; gap:30px; }
.wide-team-section .leadership-heading span { color:#f36817; font-size:14px; font-weight:700; letter-spacing:.18em; }
.wide-team-section .leadership-heading h3 { margin:0; font-size:clamp(32px,4vw,64px); line-height:1; letter-spacing:-.04em; }
.wide-team-section .team-leadership { max-width:1540px; margin:0 auto; display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.wide-team-section .team-leadership::-webkit-scrollbar { display:none; }
.wide-team-section .leadership-card { --mx:50%; --my:38%; --rx:0deg; --ry:0deg; position:relative; flex:0 0 calc((100% - 54px)/4); min-width:0; scroll-snap-align:center; scroll-snap-stop:always; background:#151515; overflow:hidden; border-radius:18px; opacity:0; cursor:pointer; transform:perspective(1100px) translateY(46px) rotateX(var(--rx)) rotateY(var(--ry)); transition:transform .65s cubic-bezier(.2,.8,.2,1),opacity .65s ease,background .3s ease,box-shadow .5s ease; will-change:transform; }
.wide-team-section .leadership-card::before { content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.24),transparent 34%); opacity:0; mix-blend-mode:screen; transition:opacity .35s ease; }
.wide-team-section .leadership-card::after { content:""; position:absolute; right:-70px; bottom:90px; width:180px; height:8px; background:#f36817; transform:rotate(-42deg) scaleX(0); transform-origin:right; transition:transform .5s cubic-bezier(.2,.8,.2,1); z-index:2; }
.wide-team-section.is-visible .leadership-card { opacity:1; transform:perspective(1100px) translateY(0) rotateX(var(--rx)) rotateY(var(--ry)); }
.wide-team-section.is-visible .leadership-card:nth-child(2) { transition-delay:.1s; }
.wide-team-section.is-visible .leadership-card:nth-child(3) { transition-delay:.2s; }
.wide-team-section.is-visible .leadership-card:nth-child(4) { transition-delay:.3s; }
.wide-team-section.is-visible .leadership-card:nth-child(5) { transition-delay:.4s; }
.wide-team-section.is-visible .leadership-card:nth-child(6) { transition-delay:.5s; }
.wide-team-section.is-visible .leadership-card:nth-child(7) { transition-delay:.6s; }
.wide-team-section.is-visible .leadership-card:nth-child(8) { transition-delay:.7s; }
.wide-team-section .leader-portrait { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center; filter:saturate(.15); transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
.wide-team-section .leadership-card.is-cinematic-active { box-shadow:0 28px 70px rgba(0,0,0,.48),0 0 0 1px rgba(243,104,23,.2); }
.wide-team-section .leadership-card.is-selected::before { opacity:.22; }
.wide-team-section .leadership-card.is-selected::after { transform:rotate(-42deg) scaleX(1); }
.wide-team-section .leadership-card.is-selected .leader-portrait { filter:saturate(1) contrast(1.02); }
.wide-team-section .leadership-card.is-selected .leader-info { background:#f36817; }
.wide-team-section .leadership-card.is-selected .leader-info p { color:#fff; }
.wide-team-section .leadership-card:focus-visible { outline:3px solid #f36817; outline-offset:4px; }
.wide-team-section .leadership-card:hover { background:#f36817; transform:perspective(1100px) translateY(-10px) rotateX(var(--rx)) rotateY(var(--ry)); box-shadow:0 34px 80px rgba(0,0,0,.62),0 0 36px rgba(243,104,23,.18); }
.wide-team-section .leadership-card:hover::before { opacity:1; }
.wide-team-section .leadership-card:hover::after { transform:rotate(-42deg) scaleX(1); }
.wide-team-section .leadership-card:hover .leader-portrait { transform:scale(1.045); filter:saturate(1); }
.wide-team-section .leadership-card.is-cinematic-active .leader-portrait { filter:saturate(.65) contrast(1.03); }
.wide-team-section .leader-brand { position:absolute; top:18px; left:18px; z-index:3; display:block; padding:0; background:transparent; transition:transform .4s ease; }
.wide-team-section .leader-brand img { width:92px; height:48px; object-fit:contain; object-position:left center; }
.wide-team-section .leadership-card:hover .leader-brand { transform:translateY(4px); }
.wide-team-section .leadership-card.is-cinematic-active .leader-brand::after { content:""; position:absolute; left:0; bottom:-7px; width:100%; height:2px; background:linear-gradient(90deg,transparent,#f36817,transparent); animation:leader-scan 2.4s ease-in-out infinite; }
.wide-team-section .leader-info { min-height:118px; padding:22px 22px 20px; transition:background-color .45s cubic-bezier(.2,.8,.2,1),color .35s ease; }
.wide-team-section .leader-info h4 { margin:0 0 9px; font-size:clamp(20px,1.5vw,27px); line-height:1.05; }
.wide-team-section .leader-info p { margin:0; color:rgba(255,255,255,.58); font-size:13px; font-weight:700; letter-spacing:.08em; }
.wide-team-section .leadership-card:hover .leader-info p { color:#fff; }
.wide-team-section .team-controls { max-width:1540px; margin:26px auto 0; display:flex; align-items:center; justify-content:flex-end; gap:14px; }
.wide-team-section .team-controls button { width:48px; height:48px; border:1px solid #555; border-radius:50%; background:transparent; color:#fff; font-size:22px; cursor:pointer; transition:background .25s ease,border-color .25s ease,transform .25s ease; }
.wide-team-section .team-controls button:hover { background:#f36817; border-color:#f36817; transform:scale(1.06); }
.wide-team-section .team-count { min-width:62px; text-align:center; color:#aaa; font-size:13px; font-weight:700; letter-spacing:.08em; }
/* Go Green redesign: clean forest-green and white sustainability system. */
#app[data-site-page="green"] { --green:#55a96a; --green-deep:#164f36; --green-bright:#b9efad; --green-mist:#f1faee; background:#fff; }
#app[data-site-page="green"] .hero-wrapper { position:relative; height:calc(100vh - 100px); min-height:680px; max-height:none; padding:100px 7vw 64px; background:#164f36 url('./assets/go-green-hero-v3.png') center/cover no-repeat; overflow:hidden; }
#app[data-site-page="green"] .hero-wrapper::before { content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(90deg,rgba(16,76,48,.83) 0%,rgba(46,111,67,.56) 43%,rgba(112,174,105,.08) 72%,transparent 100%),linear-gradient(0deg,rgba(17,72,47,.48),transparent 48%); }
#app[data-site-page="green"] .hero-wrapper .bg-pattern,
#app[data-site-page="green"] .hero-wrapper .product-card,
#app[data-site-page="green"] .partners-logo { display:none; }
#app[data-site-page="green"] .hero-wrapper .hero-content { position:relative; z-index:1; width:100%; max-width:1440px; height:100%; margin:0 auto; padding:0; display:flex; align-items:center; }
#app[data-site-page="green"] .hero-wrapper .text-section { max-width:760px; }
#app[data-site-page="green"] .hero-wrapper .est-text { color:#e4ffdc; }
#app[data-site-page="green"] .hero-wrapper .est-text::before { background:#b9efad; }
#app[data-site-page="green"] .hero-wrapper .main-title { font-size:clamp(58px,6vw,104px); line-height:.98; letter-spacing:-.045em; margin:0; }
#app[data-site-page="green"] .hero-wrapper .orange-text { color:#c7f5b9; margin-bottom:18px; }
#app[data-site-page="green"] .hero-wrapper .white-text { color:#fff; }
#app[data-site-page="green"] .hero-wrapper .desc-text { max-width:640px; color:rgba(255,255,255,.88); font-size:clamp(18px,1.45vw,24px); }
#app[data-site-page="green"] .hero-wrapper .btn { border-radius:999px; font-size:18px; }
#app[data-site-page="green"] .hero-wrapper .btn-first { background:#efffe9; border-color:#efffe9; color:#245d3c; }
#app[data-site-page="green"] .hero-wrapper .btn-second { background:rgba(73,139,84,.32); border-color:rgba(239,255,233,.85); color:#fff; backdrop-filter:blur(10px); }
#app[data-site-page="green"] .environmental-section { background:#fff; color:#073f2b; }
#app[data-site-page="green"] .environmental-section .bg-pattern { opacity:.24; filter:hue-rotate(65deg) saturate(.55); }
#app[data-site-page="green"] .environmental-section .line-before,
#app[data-site-page="green"] .environmental-section .line-after { background:#82ce88; }
#app[data-site-page="green"] .environmental-section .section-header h2,
#app[data-site-page="green"] .environmental-section .sub-title,
#app[data-site-page="green"] .environmental-section .stat-value { color:#073f2b; }
#app[data-site-page="green"] .environmental-section .stats-list .stat-item { border-left-color:#82ce88; background:#f1faee; border-radius:0 14px 14px 0; padding:18px 20px; }
#app[data-site-page="green"] .environmental-section .stat-desc,
#app[data-site-page="green"] .environmental-section .desc-text { color:#527064; }
#app[data-site-page="green"] .environmental-section .highlight-text,
#app[data-site-page="green"] .environmental-section .copy-text-list p { color:#18744a; }
#app[data-site-page="green"] .environmental-section .img-col img { box-shadow:0 24px 60px rgba(7,63,43,.16); }
#app[data-site-page="green"] .scroll-text-container { background:#55a96a; }
#app[data-site-page="green"] .scroll-text span { color:#fff; }
#app[data-site-page="green"] .scroll-text span.t { color:#e9ffe3; }

/* Stable Go Green route, based on the working standalone presentation. */
#app[data-site-page="green"] .green-reference-page { background:#f7faf5; color:#103b2b; overflow:hidden; }
#app[data-site-page="green"] .green-reference-hero { position:relative; min-height:calc(100vh - 100px); padding:150px 7vw 80px; display:flex; align-items:center; background:#174f37 url('./assets/go-green-hero-v3.png') center/cover no-repeat; }
#app[data-site-page="green"] .green-reference-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,58,38,.9),rgba(27,92,56,.54) 48%,rgba(27,92,56,.05) 78%); }
#app[data-site-page="green"] .green-reference-copy { position:relative; z-index:1; max-width:880px; color:#fff; }
#app[data-site-page="green"] .green-reference-copy>p,
#app[data-site-page="green"] .green-reference-intro>p,
#app[data-site-page="green"] .green-reference-quote>p { margin:0 0 24px; color:#b9efad; font-weight:800; letter-spacing:.18em; }
#app[data-site-page="green"] .green-reference-copy h1 { margin:0 0 30px; font-size:clamp(58px,6.7vw,112px); line-height:.92; letter-spacing:-.055em; }
#app[data-site-page="green"] .green-reference-copy h1 em { color:#b9efad; font-style:normal; }
#app[data-site-page="green"] .green-reference-copy>span { display:block; max-width:680px; font-size:clamp(18px,1.5vw,25px); line-height:1.55; }
#app[data-site-page="green"] .green-reference-intro { padding:110px 7vw 80px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:end; background:#fff; }
#app[data-site-page="green"] .green-reference-intro h2 { margin:0; font-size:clamp(54px,6vw,100px); line-height:.9; letter-spacing:-.05em; }
#app[data-site-page="green"] .green-reference-intro>span { max-width:720px; color:#557065; font-size:clamp(18px,1.4vw,24px); line-height:1.6; }
#app[data-site-page="green"] .green-reference-grid { padding:30px 7vw 120px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; background:#fff; }
#app[data-site-page="green"] .green-reference-grid article { position:relative; min-height:610px; overflow:hidden; border-radius:28px; background:#174f37; color:#fff; }
#app[data-site-page="green"] .green-reference-grid img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
#app[data-site-page="green"] .green-reference-grid article:hover img { transform:scale(1.045); }
#app[data-site-page="green"] .green-reference-grid article>div { position:absolute; inset:auto 0 0; padding:110px 44px 40px; background:linear-gradient(transparent,rgba(6,49,31,.94)); }
#app[data-site-page="green"] .green-reference-grid b { color:#b9efad; letter-spacing:.15em; }
#app[data-site-page="green"] .green-reference-grid h2 { margin:12px 0; font-size:clamp(30px,2.7vw,48px); }
#app[data-site-page="green"] .green-reference-grid p { max-width:680px; margin:0; color:rgba(255,255,255,.84); font-size:18px; line-height:1.55; }
#app[data-site-page="green"] .green-reference-quote { padding:120px 7vw; background:#55a96a; color:#fff; }
#app[data-site-page="green"] .green-reference-quote h2 { margin:0; font-size:clamp(64px,8vw,140px); line-height:.88; letter-spacing:-.06em; }
/* Shared spacing and typography follow the template, with original content intact. */
#app .layout_main { font-family:Arial,Helvetica,sans-serif; }
#app :is(.portfolio-header, .hero[data-v-bf53167f], .hero-wrapper, .banner-section) { height:86vh; min-height:650px; max-height:none; margin:0; padding:130px 7vw 70px; box-sizing:border-box; }
#app .portfolio-header .main-title { font-size:clamp(54px,8vw,130px); line-height:.95; letter-spacing:-.055em; }
#app .portfolio-header .portfolio-title { font-size:14px; letter-spacing:.18em; }
#app .portfolio-header .subtitle { font-size:clamp(17px,1.4vw,22px); line-height:1.6; max-width:700px; }
#app .hero[data-v-bf53167f] .hero-content { text-align:left; align-items:flex-start; padding:0; }
#app .hero[data-v-bf53167f] .hero-middle { align-items:flex-start; }
#app .hero[data-v-bf53167f] .hero-title { font-size:clamp(48px,5.3vw,90px); line-height:1.02; letter-spacing:-.04em; }
#app .banner-section .banner-bg { inset:0; height:100%; }
#app .banner-section .banner-content { width:100%; }
#app .banner-section h1 { font-size:clamp(64px,9vw,150px); line-height:.95; letter-spacing:-.06em; }
#app[data-site-page="contact"] .banner-section .banner-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,12,23,.55) 0%,rgba(5,12,23,.27) 42%,rgba(5,12,23,.03) 76%),linear-gradient(0deg,rgba(4,9,16,.14),transparent 52%); pointer-events:none; }
#app[data-site-page="contact"] .banner-section .banner-img { object-position:center 55%; filter:brightness(1.1) saturate(.96) contrast(1.01); }
#app :is(.portfolio-page,.container-box) p { font-family:Arial,Helvetica,sans-serif; }
#app .reference-about .text-item { white-space:normal; }
#app .reference-about { scroll-margin-top:100px; }
#app .reference-about .text-item { transform:none; }
#app .reference-about .text-item .num { font-size:clamp(11px,1.05vw,22px); }
@media(min-width:801px) {
  #app .reference-about .stat-card .text-3 { top:19rem; left:28.5rem; }
  #app .reference-about .text-content { width:54%; padding:2rem; }
  #app .reference-about .text-content .section-tag { font-size:16px; margin-bottom:24px; }
  #app .reference-about .text-content .main-title { font-size:clamp(46px,3.25vw,66px); line-height:1.08; margin-bottom:30px; letter-spacing:-.025em; }
  #app .reference-about .text-content .main-title br:nth-of-type(2) { display:none; }
  #app .reference-about .text-content .desc-paragraph { font-size:clamp(17px,1.15vw,22px); line-height:1.55; margin-bottom:22px; }
  #app .production-center-section .content-left,
  #app .footwear-lab-section .content-right { width:40%; padding:clamp(32px,3.5vw,64px); }
  #app .production-center-section .image-right,
  #app .footwear-lab-section .image-left { width:60%; }
  #app .production-center-section .description,
  #app .footwear-lab-section .description { font-size:clamp(18px,1.25vw,24px); line-height:1.6; }
  #app .approach { height:auto; max-height:none; margin-bottom:0; }
  #app .approach :is(.box1,.box2) { height:clamp(580px,52vw,720px); }
  #app .approach .box2 { margin-top:0; }
  #app .approach .box2 .aside-right img { height:100%; object-fit:cover; }
}
@media(min-width:1200px) {
  #app .reference-about { display:grid; grid-template-columns:46% 54%; align-items:center; }
  #app .reference-about .stats-grid { width:100%; min-width:0; }
  #app .reference-about .text-content { width:100%; min-width:0; padding:2rem 4vw 2rem 1.5rem; box-sizing:border-box; }
  #app .reference-about .text-content .main-title { font-size:clamp(40px,2.7vw,54px); white-space:normal; }
  #app .reference-about .text-content .main-title br:first-of-type { display:block; }
  #app .reference-about .text-content .main-title br:nth-of-type(2) { display:none; }
  #app .reference-about .text-content .desc-paragraph { max-width:920px; }
  #app .reference-about .text-content { transform:translateY(-38px); }
}
@media(max-width:800px) {
  #app[data-site-page="green"] .green-reference-hero { min-height:760px; padding:340px 7% 60px; align-items:flex-end; background-position:58% center; }
  #app[data-site-page="green"] .green-reference-shade { background:linear-gradient(180deg,rgba(13,64,42,.08) 15%,rgba(13,64,42,.92) 72%,#0d402a 100%); }
  #app[data-site-page="green"] .green-reference-copy h1 { font-size:clamp(44px,12vw,64px); }
  #app[data-site-page="green"] .green-reference-intro { padding:72px 7%; grid-template-columns:1fr; gap:26px; }
  #app[data-site-page="green"] .green-reference-intro h2 { font-size:48px; }
  #app[data-site-page="green"] .green-reference-grid { padding:0 5% 70px; grid-template-columns:1fr; }
  #app[data-site-page="green"] .green-reference-grid article { min-height:520px; border-radius:20px; }
  #app[data-site-page="green"] .green-reference-grid article>div { padding:90px 24px 28px; }
  #app[data-site-page="green"] .green-reference-grid p { font-size:16px; }
  #app[data-site-page="green"] .green-reference-quote { padding:80px 7%; }
  .wide-team-section { padding:58px 6% 52px; }
  .wide-team-section .team-heading { display:block; margin-bottom:28px; }
  .wide-team-section .team-heading h2 { font-size:44px; line-height:.92; }
  .wide-team-section .team-heading > p { margin-top:24px; font-size:17px; }
  .wide-team-section .team-visual { height:72vw; min-height:300px; max-height:460px; border-radius:18px; }
  .wide-team-section .team-visual img { object-position:50% center; }
  .wide-team-section .team-disciplines { grid-template-columns:1fr 1fr; }
  .wide-team-section .team-disciplines article { min-height:190px; padding:24px 18px; border-bottom:1px solid #333; }
  .wide-team-section .team-disciplines article:nth-child(2) { border-right:0; }
  .wide-team-section .team-disciplines article:nth-child(n+3) { border-bottom:0; }
  .wide-team-section .team-disciplines h3 { margin:20px 0 10px; font-size:19px; }
  .wide-team-section .team-disciplines p { font-size:14px; }
  .wide-team-section .leadership-heading { display:block; margin:46px 0 22px; }
  .wide-team-section .leadership-heading h3 { margin-top:12px; font-size:36px; }
  .wide-team-section .team-leadership { display:flex; gap:14px; width:calc(100% + 12vw); margin-inline:-6vw; padding:8px 11vw 18px; box-sizing:border-box; overflow-x:auto; overscroll-behavior-inline:contain; touch-action:pan-x pan-y; scroll-padding-inline:11vw; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .wide-team-section .team-leadership::-webkit-scrollbar { display:none; }
  .wide-team-section .leadership-card { flex:0 0 78vw; scroll-snap-align:center; border-radius:16px; }
  .wide-team-section.is-visible .leadership-card { opacity:.42; transform:perspective(1100px) scale(.91) translateY(12px); transition-delay:0s; filter:brightness(.72); }
  .wide-team-section.is-visible .leadership-card.is-selected { z-index:2; opacity:1; filter:brightness(1); transform:perspective(1100px) scale(1) translateY(0); box-shadow:0 24px 58px rgba(0,0,0,.56),0 0 0 1px rgba(243,104,23,.36); }
  .wide-team-section .leadership-card:hover { background:#151515; }
  .wide-team-section .leadership-card.is-selected::before { opacity:.28; }
  .wide-team-section .leadership-card.is-selected::after { transform:rotate(-42deg) scaleX(1); }
  .wide-team-section .leadership-card.is-selected .leader-portrait { filter:saturate(1) contrast(1.02); transform:scale(1.025); }
  .wide-team-section .leadership-card.is-selected .leader-info { background:#f36817; }
  .wide-team-section .leadership-card.is-selected .leader-info p { color:#fff; }
  .wide-team-section .leader-info { min-height:106px; padding:20px; }
  .wide-team-section .leader-info h4 { font-size:24px; }
  .wide-team-section .leader-brand { top:14px; left:14px; padding:0; }
  .wide-team-section .leader-brand img { width:78px; height:42px; }
  .wide-team-section .team-controls { margin-top:16px; justify-content:space-between; }
  #app[data-site-page="green"] .hero-wrapper { height:auto; min-height:760px; padding:110px 7% 58px; background-position:54% center; }
  #app[data-site-page="green"] .hero-wrapper::before { background:linear-gradient(180deg,rgba(22,79,54,.22) 0%,rgba(22,79,54,.4) 30%,rgba(22,79,54,.82) 58%,#164f36 82%); }
  #app[data-site-page="green"] .hero-wrapper .hero-content { min-height:590px; justify-content:flex-end; }
  #app[data-site-page="green"] .hero-wrapper .main-title { font-size:clamp(42px,11vw,62px); line-height:1; }
  #app[data-site-page="green"] .hero-wrapper .desc-text { font-size:17px; }
  #app[data-site-page="green"] .hero-wrapper .button-group { display:grid; grid-template-columns:1fr; width:100%; }
  #app[data-site-page="green"] .hero-wrapper .btn { width:100%; }
  #app .reference-about { scroll-margin-top:76px; }
  #app :is(.portfolio-header, .hero[data-v-bf53167f], .hero-wrapper, .banner-section) { height:auto; min-height:650px; padding:120px 6% 64px; }
  #app .portfolio-header .header-content { width:100%; min-width:0; }
  #app .portfolio-header .main-title { font-size:clamp(44px,12vw,76px); overflow-wrap:anywhere; }
  #app .hero[data-v-bf53167f] .hero-title { font-size:clamp(36px,9vw,64px); }
  #app .hero[data-v-bf53167f] :is(.hero-middle,.hero-title) { width:100%; min-width:0; max-width:100%; overflow-wrap:anywhere; }
  #app .hero[data-v-bf53167f] .hero-title span { letter-spacing:-.03em !important; margin-right:0; display:block; }
  #app .portfolio-header .header-content { padding:0; }
  #app .case-studies-container > .section-title { width:100%; margin:0; padding:0; }
  #app .hero-wrapper .hero-content { width:100%; margin:0; padding:0; flex-direction:column; }
  #app .hero-wrapper .hero-content > * { width:100%; max-width:100%; flex:auto; }
  #app .hero-wrapper h1 { font-size:clamp(36px,9vw,64px); }
  #app .hero-wrapper .button-group { flex-wrap:wrap; gap:12px; }
  #app .hero-wrapper .button-group .btn { margin:0; font-size:15px; min-height:44px; max-width:100%; }
  #app .banner-section h1 { font-size:clamp(52px,14vw,86px); }
  #app[data-site-page="contact"] .banner-section .banner-img { object-position:52% center; }
  #app[data-site-page="contact"] .banner-section .banner-bg::after { background:linear-gradient(180deg,rgba(4,10,19,.17) 0%,rgba(4,10,19,.4) 52%,rgba(4,10,19,.66) 100%); }
  #app :is(.portfolio-page,.container-box) :is(p,li) { font-size:16px; line-height:1.65; overflow-wrap:anywhere; }
  #app :is(.portfolio-page,.container-box) h2 { font-size:30px; line-height:1.2; }
  #app :is(.portfolio-page,.container-box) h3 { font-size:23px; line-height:1.25; }
  #app :is(.case-studies-container,.dna-section,.faq-section,.automation-section,.contact-container,.environmental-section,.process-flow-section) { height:auto; min-height:0; max-height:none; width:100%; padding:48px 6%; box-sizing:border-box; }
  #app .case-studies-container .tab-nav { width:100%; margin:24px 0; gap:12px; }
  #app .case-studies-container .content-section { width:100%; flex-direction:column; gap:24px; padding-bottom:32px; }
  #app .case-studies-container .content-section > * { width:100%; max-width:100%; }
  #app .case-studies-container .custom-tag { font-size:15px; min-height:44px; }
  #app .case-studies-container .carousel-wrapper { width:100%; height:280px; }
  #app .dna-section .dna-header { padding:0; }
  #app .dna-section .dna-cards-container { padding:0; }
  #app .dna-section .dna-card { width:100%; min-height:420px; }
  #app .faq-section .faq-container { width:100%; flex-direction:column; gap:24px; }
  #app .automation-section { display:flex; flex-direction:column; gap:20px; }
  #app .automation-section .image-item { position:relative; inset:auto; width:100%; height:230px; transform:none; }
  #app .automation-section .automation-text { position:relative; inset:auto; order:-1; }
  #app .automation-section .video-bottom-wrapper { position:relative; inset:auto; flex-direction:column; padding:0; gap:24px; }
  #app .automation-section :is(.vertical-line,.divider-line) { display:none; }
  #app .contact-box { width:100%; height:auto; margin:0; flex-direction:column; }
  #app .contact-box :is(.left-box,.right-box) { flex:auto; width:100%; min-width:0; padding:24px; }
  #app .contact-box .left-box { padding:0; }
  #app .contact-box .card { padding:24px; }
  #app .contact-box .item-content { min-width:0; overflow-wrap:anywhere; }
  #app .contact-box input, #app .contact-box textarea { font-size:16px; }
  #app .contact-box .el-col-12 { flex:0 0 100%; max-width:100%; }
  #app .contact-box .el-input__wrapper { min-height:48px; }
  #app .location-banner { height:auto; min-height:0; max-height:none; padding:40px 6%; flex-direction:column; justify-content:flex-start; gap:24px; }
  #app .location-banner > * { width:100%; max-width:100%; flex:auto; text-align:left; align-items:flex-start; }
  #app .location-banner .location-img { order:1; }
  #app .location-banner .location-info { order:2; }
  #app .location-banner .location-img img { width:100%; height:auto; max-width:100%; object-fit:cover; border-radius:18px; }
  #app .location-banner .location-info { padding:8px 0 0; align-items:flex-start; justify-content:flex-start; text-align:left; }
  #app .location-banner .location-icon { width:auto; max-width:42px; height:auto; margin:0 0 14px; }
  #app .location-banner .location-tag { margin:0 0 16px; }
  #app .location-banner .location-title { margin:0 0 16px; }
  #app .location-banner .location-address { margin:0; text-align:left; }
  #app .location-banner .btn { align-self:flex-start; margin-top:24px; }
  #app .contact-section { height:auto; min-height:0; max-height:none; overflow:hidden; padding:48px 6%; background:#f4f4f1; box-sizing:border-box; }
  #app .contact-section .bg-container { position:absolute; inset:0; width:100%; height:100%; }
  #app .contact-section .card-left { position:relative; inset:auto; transform:none; width:100%; max-width:none; margin:0; padding:32px 24px; border-radius:24px; background:#fff; box-sizing:border-box; }
  #app .contact-section .card-left .name { font-size:48px; line-height:1.05; margin:0 0 16px; }
  #app .contact-section .card-left .title { font-size:21px; line-height:1.25; }
  #app .contact-section .card-left .description { font-size:16px; line-height:1.6; margin:20px 0 28px; }
  #app .contact-section .card-left .contact-info { width:100%; max-width:100%; padding-top:22px; font-size:16px; line-height:1.55; overflow-wrap:anywhere; }
  #app .contact-section .card-right { position:relative; inset:auto; width:100%; margin:16px 0 0; padding:28px 24px; border-radius:24px; background:#f36817; box-sizing:border-box; gap:16px; }
  #app .contact-section .card-right .right-item { min-width:0; gap:12px; }
  #app .contact-section .card-right .right-item .icon { width:24px; height:24px; flex:0 0 24px; }
  #app .contact-section .card-right .right-item .text { min-width:0; font-size:16px; line-height:1.35; white-space:normal; overflow-wrap:anywhere; }
  #app .environmental-section .row { flex-direction:column; gap:24px; margin-bottom:48px; }
  #app .environmental-section :is(.text-col,.img-col) { width:100%; max-width:100%; flex:auto; }
  #app .environmental-section img { width:100%; height:auto; }
  #app .environmental-section { overflow:visible; }
  #app .environmental-section > .container { width:100%; margin:0; padding:48px 24px; box-sizing:border-box; }
  #app .environmental-section .section-header { margin-bottom:36px; }
  #app .environmental-section .line-before { width:72px; height:6px; margin-bottom:28px; }
  #app .environmental-section .section-header h2 { font-size:34px; line-height:1.12; overflow-wrap:normal; word-break:normal; }
  #app .environmental-section .row { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:28px; margin:0 0 64px; }
  #app .environmental-section .row > :is(.text-col,.img-col) { width:100%; min-width:0; flex:none; }
  #app .environmental-section .text-col { order:1; }
  #app .environmental-section .img-col { order:2; justify-content:stretch; }
  #app .environmental-section .sub-title { font-size:25px; line-height:1.25; margin:0 0 28px; }
  #app .environmental-section .stats-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 14px; }
  #app .environmental-section .stats-list .stat-item { width:auto; min-width:0; margin:0; padding-left:14px; }
  #app .environmental-section .stats-list .stat-item:nth-child(3) { grid-column:1 / -1; }
  #app .environmental-section .stat-value { font-size:24px; line-height:1.1; }
  #app .environmental-section .stat-desc { display:block; font-size:16px; line-height:1.35; }
  #app .environmental-section .img-col img { width:100%; height:auto; aspect-ratio:1.05; object-fit:cover; border-radius:18px; }
  #app .environmental-section .desc-text, #app .environmental-section .copy-text-list p { font-size:18px; line-height:1.55; }
  #app .environmental-section .line-after { margin:0 0 0 auto; }
  #app .scroll-text-container { position:relative; z-index:1; width:100%; height:96px; overflow:hidden; }
  #app .scroll-text-container .scroll-text-wrapper { height:100%; overflow:hidden; }
  #app .scroll-text-container .scroll-text { height:100%; font-size:48px; line-height:96px; white-space:nowrap; }
  #app .services-wrap .section.services { height:auto; min-height:700px; max-height:none; padding:48px 6%; flex-direction:column; }
  #app .service-content-fixed { position:relative; top:auto; max-width:100%; width:100%; max-height:none; }
  #app .services-wrap .image-card { width:100%; height:280px; max-width:100%; }
  #app .services-wrap .images-slider { width:100%; height:280px; margin-top:24px; overflow:hidden; }
  #app .services-wrap .image-card:not(.current) { display:none; }
  #app .container-box { max-width:100%; overflow-x:clip; }
  #app .services-wrap .progress-bar { position:relative; inset:auto; order:3; width:100%; margin-top:24px; height:12px; }
  #app .services-wrap .progress-step { min-width:0; }
  #app .services-list .service-img { margin-left:0; }
  #app .services-list .service-img img { width:100%; height:auto; }
  #app .services-list { padding:40px 6%; }
  #app .services-list .service-item { flex-direction:column; gap:24px; }
  #app .services-list .service-item > * { width:100%; max-width:100%; }
  #app .service-tags { flex-wrap:wrap; }
  #app :is(.production-center-section,.footwear-lab-section) { height:auto; min-height:0; max-height:none; flex-direction:column; }
  #app :is(.production-center-section .content-left,.production-center-section .image-right,.footwear-lab-section .image-left,.footwear-lab-section .content-right) { width:100%; }
  #app :is(.production-center-section .content-left,.footwear-lab-section .content-right) { padding:48px 6%; }
  #app :is(.production-center-section .image-right,.footwear-lab-section .image-left) { order:1; height:clamp(280px,65vw,440px); }
  #app :is(.production-center-section .content-left,.footwear-lab-section .content-right) { order:2; }
  #app :is(.production-center-section .image-right,.footwear-lab-section .image-left) img { object-position:center; }
  #app .org-section { height:auto; min-height:0; max-height:none; padding:28px 18px 32px; overflow:hidden; }
  #app .org-section .section-header { margin-bottom:14px; padding:12px 4px 18px; }
  #app .org-section .cards-container { min-height:0; height:auto; padding:0; perspective:none; touch-action:pan-y; }
  #app .org-section .org-card { display:none; position:relative; inset:auto; width:100% !important; height:auto; min-height:0; padding:14px; transform:none !important; opacity:0; border-radius:18px; transition:opacity .28s ease,transform .28s ease; }
  #app .org-section .org-card.active { display:block; opacity:1; animation:mobile-card-in .34s ease both; }
  #app .org-section .org-card .card-img { height:210px; margin-bottom:8px; border-radius:14px; }
  #app .org-section .org-card .card-content { padding:10px 8px 14px; }
  #app .org-section .org-card .card-content .card-region { margin-bottom:10px; }
  #app .org-section .org-card .card-content .card-title { font-size:23px; margin-bottom:9px; }
  #app .org-section .org-card .card-content .card-subtitle { font-size:15px; margin-bottom:9px; }
  #app .org-section .org-card .card-content .card-desc { font-size:14px; line-height:1.45; }
  #app .org-section .mobile-org-pager { display:flex; align-items:center; justify-content:center; gap:18px; margin-top:18px; }
  #app .org-section .pager-arrow { width:44px; height:44px; border:1px solid #f36817; border-radius:50%; background:#f36817; color:#fff; font-size:22px; line-height:1; }
  #app .org-section .pager-dots { display:flex; align-items:center; gap:8px; }
  #app .org-section .pager-dot { width:8px; height:8px; padding:0; border:0; border-radius:50%; background:#5d5d5d; }
  #app .org-section .pager-dot.active { width:24px; border-radius:10px; background:#f36817; }
  #app .flow-header { height:auto; padding:0 0 24px; }
  #app .flow-body { height:auto; min-height:640px; }
  #app .timeline-container { width:100%; height:auto; padding:24px; flex-direction:column; gap:32px; }
  #app .timeline-container .timeline-item { width:100%; transform:none; }
}
@keyframes mobile-card-in { from { opacity:0; transform:translateX(20px) scale(.985); } to { opacity:1; transform:translateX(0) scale(1); } }
@keyframes leader-scan { 0%,100% { opacity:.3; transform:scaleX(.28); } 50% { opacity:1; transform:scaleX(1); } }
@media(prefers-reduced-motion:reduce) {
  .wide-team-section .leadership-card,
  .wide-team-section .leader-portrait,
  .wide-team-section .leader-brand { animation:none !important; transition:none !important; transform:none !important; }
}
@media(max-width:360px) {
  #app .environmental-section > .container { padding-inline:20px; }
  #app .environmental-section .section-header h2 { font-size:30px; }
  #app .environmental-section .sub-title { font-size:22px; }
  #app .scroll-text-container { height:80px; }
  #app .scroll-text-container .scroll-text { font-size:40px; line-height:80px; }
}

/* Recognition section removed from site display. */
#app .recognition-section {
  display: none !important;
}


/* General manager contact card removed from site display. */
#app .contact-section {
  display: none !important;
}

/* Shoefabrik services content, adapted to Wide Step's visual system. */
#app .section.services.shoefabrik-services {
  height: auto !important;
  min-height: 100vh;
  max-height: none !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden;
  color: #fff;
  background: #0b0c0e;
}
#app .sf-services-shell { padding: clamp(70px,8vw,140px) 5vw; }
#app .sf-services-intro { display:grid; grid-template-columns:1.1fr .9fr; gap:28px 6vw; padding-bottom:clamp(48px,6vw,90px); border-bottom:1px solid #343434; }
#app .sf-services-intro span { color:#ee6b20; font-weight:800; letter-spacing:.18em; }
#app .sf-services-intro h2 { grid-row:2; margin:0; max-width:820px; font-size:clamp(50px,6.5vw,118px); line-height:.88; letter-spacing:-.055em; }
#app .sf-services-intro p { grid-column:2; grid-row:2; align-self:end; margin:0 0 8px; max-width:680px; color:#b9bbc0; font-size:clamp(18px,1.45vw,28px); line-height:1.55; }
#app .sf-services-stage { display:grid; grid-template-columns:minmax(310px,.72fr) minmax(0,1.7fr); gap:5vw; padding-top:clamp(50px,6vw,90px); }
#app .sf-service-nav { display:flex; flex-direction:column; align-items:stretch; }
#app .sf-service-nav button { display:flex; gap:16px; width:100%; padding:17px 0; border:0; border-bottom:1px solid #292b2e; color:#777b80; background:transparent; font:800 clamp(17px,1.35vw,25px)/1.15 Arial,sans-serif; text-align:left; cursor:pointer; transition:color .3s ease,padding-left .3s ease; }
#app .sf-service-nav button span { flex:0 0 38px; color:#555; font-size:.72em; letter-spacing:.08em; transition:color .3s ease; }
#app .sf-service-nav button:is(:hover,.is-active) { color:#fff; padding-left:12px; }
#app .sf-service-nav button.is-active span { color:#ee6b20; }
#app .sf-service-feature { min-width:0; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(270px,.92fr); min-height:620px; overflow:hidden; border-radius:28px; background:#17181a; box-shadow:0 35px 80px #0008; }
#app .sf-service-image { position:relative; min-height:620px; overflow:hidden; }
#app .sf-service-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 65%,#17181a); pointer-events:none; }
#app .sf-service-image img { width:100%; height:100%; object-fit:cover; display:block; transition:opacity .22s ease,transform .8s cubic-bezier(.2,.8,.2,1); }
#app .sf-service-feature:hover .sf-service-image img { transform:scale(1.035); }
#app .sf-service-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(36px,4vw,72px); transition:opacity .22s ease,transform .22s ease; }
#app .sf-service-number { color:#ee6b20; font-weight:800; letter-spacing:.14em; }
#app .sf-service-copy h3 { margin:26px 0; font-size:clamp(34px,4vw,70px); line-height:.96; letter-spacing:-.04em; overflow-wrap:anywhere; }
#app .sf-service-copy p { margin:0; color:#c5c7ca; font-size:clamp(17px,1.25vw,24px); line-height:1.6; }
#app .sf-service-progress { height:3px; margin-top:54px; overflow:hidden; background:#3a3b3e; }
#app .sf-service-progress i { display:block; width:var(--service-progress); height:100%; background:#ee6b20; transition:width .5s ease; }
#app .shoefabrik-services.is-switching .sf-service-image img,
#app .shoefabrik-services.is-switching .sf-service-copy { opacity:0; transform:translateY(12px); }

@media (max-width: 800px) {
  #app .sf-services-shell { padding:64px 24px; }
  #app .sf-services-intro { display:block; }
  #app .sf-services-intro h2 { margin:18px 0 28px; font-size:clamp(44px,13vw,68px); }
  #app .sf-services-intro p { font-size:17px; }
  #app .sf-services-stage { display:block; padding-top:38px; }
  #app .sf-service-nav { flex-direction:row; gap:8px; padding-bottom:18px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  #app .sf-service-nav::-webkit-scrollbar { display:none; }
  #app .sf-service-nav button { flex:0 0 auto; width:auto; padding:12px 16px; border:1px solid #36383b; border-radius:999px; scroll-snap-align:start; white-space:nowrap; font-size:14px; }
  #app .sf-service-nav button span { flex:auto; font-size:inherit; }
  #app .sf-service-nav button:is(:hover,.is-active) { padding-left:16px; background:#ee6b20; border-color:#ee6b20; }
  #app .sf-service-nav button.is-active span { color:#fff; }
  #app .sf-service-feature { display:block; min-height:0; border-radius:20px; touch-action:pan-y; }
  #app .sf-service-image { min-height:0; aspect-ratio:4/4.55; }
  #app .sf-service-image::after { background:linear-gradient(0deg,#17181a 0,transparent 25%); }
  #app .sf-service-copy { padding:30px 24px 36px; }
  #app .sf-service-copy h3 { margin:18px 0; font-size:38px; }
  #app .sf-service-copy p { font-size:16px; }
  #app .sf-service-progress { margin-top:34px; }
}

/* Restored service feature layout with the site's light texture. */
#app .section.services.shoefabrik-services {
  color:#111820;
  background:#fff url('./assets/bg1-DT0Ot5p7.png') top center/cover repeat-y !important;
}
#app .shoefabrik-services .sf-services-intro { border-color:#d9dcde; }
#app .shoefabrik-services .sf-services-intro h2 { color:#111820; }
#app .shoefabrik-services .sf-services-intro p { color:#596169; }
#app .shoefabrik-services .sf-services-stage { grid-template-columns:minmax(310px,.72fr) minmax(0,1.7fr); gap:5vw; }
#app .shoefabrik-services .sf-service-nav button { color:#666d74; border-color:#d9dcde; }
#app .shoefabrik-services .sf-service-nav button span { color:#a1a6aa; }
#app .shoefabrik-services .sf-service-nav button:is(:hover,.is-active) { color:#111820; }
#app .shoefabrik-services .sf-service-nav button.is-active,
#app .shoefabrik-services .sf-service-nav button.is-active span { color:#ee6b20; }
#app .shoefabrik-services .sf-service-feature { grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr); min-height:640px; overflow:hidden; border-radius:28px; background:rgba(255,255,255,.94); box-shadow:0 30px 80px rgba(22,31,40,.17); }
#app .shoefabrik-services .sf-service-image { min-height:640px; border-radius:0; box-shadow:none; }
#app .shoefabrik-services .sf-service-image::after { display:block; background:linear-gradient(90deg,transparent 68%,rgba(255,255,255,.94)); }
#app .shoefabrik-services .sf-service-copy { justify-content:center; padding:clamp(36px,4vw,72px); }
#app .shoefabrik-services .sf-service-copy h3 { color:#111820; font-size:clamp(34px,4vw,70px); }
#app .shoefabrik-services .sf-service-copy p { color:#303940; font-size:clamp(17px,1.28vw,23px); line-height:1.58; }
#app .shoefabrik-services .sf-service-progress { margin-top:54px; background:#d8dcde; }

@media (max-width:800px) {
  #app .shoefabrik-services .sf-service-nav button { color:#555d63; background:rgba(255,255,255,.9); border-color:#cdd1d4; }
  #app .shoefabrik-services .sf-service-nav button:is(:hover,.is-active) { color:#fff; background:#ee6b20; border-color:#ee6b20; }
  #app .shoefabrik-services .sf-service-feature { display:block; min-height:0; border-radius:20px; }
  #app .shoefabrik-services .sf-service-image { min-height:0; aspect-ratio:4/4.55; }
  #app .shoefabrik-services .sf-service-image::after { background:linear-gradient(0deg,rgba(255,255,255,.94),transparent 24%); }
  #app .shoefabrik-services .sf-service-copy { padding:30px 24px 36px; }
  #app .shoefabrik-services .sf-service-copy h3 { font-size:38px; }
  #app .shoefabrik-services .sf-service-copy p { font-size:16px; }
}

/* Compact service typography and show every source image without cropping. */
#app .shoefabrik-services .sf-service-nav button { font-size:clamp(15px,1.05vw,20px); padding-top:14px; padding-bottom:14px; }
#app .shoefabrik-services .sf-service-image { display:flex; align-items:center; justify-content:center; background:#eceeed; }
#app .shoefabrik-services .sf-service-image img { width:100%; height:100%; object-fit:contain; object-position:center; }
#app .shoefabrik-services .sf-service-copy h3 { font-size:clamp(30px,3.15vw,54px); line-height:1.02; margin:20px 0; }
#app .shoefabrik-services .sf-service-copy p { font-size:clamp(15px,1.05vw,19px); line-height:1.58; }
#app .shoefabrik-services .sf-service-number { font-size:14px; }

@media (max-width:800px) {
  #app .shoefabrik-services .sf-service-nav button { font-size:13px; padding-top:10px; padding-bottom:10px; }
  #app .shoefabrik-services .sf-service-image { aspect-ratio:476/543; }
  #app .shoefabrik-services .sf-service-copy h3 { font-size:30px; }
  #app .shoefabrik-services .sf-service-copy p { font-size:15px; }
}

/* Unite the service index and detail into one balanced panel. */
#app .shoefabrik-services .sf-services-stage {
  grid-template-columns:minmax(300px,31%) minmax(0,69%);
  gap:0;
  overflow:hidden;
  border:1px solid rgba(19,28,36,.12);
  border-radius:28px;
  background:rgba(255,255,255,.92);
  box-shadow:0 28px 75px rgba(24,32,40,.14);
}
#app .shoefabrik-services .sf-service-nav {
  justify-content:center;
  padding:34px clamp(24px,2.4vw,48px);
  border-right:1px solid #d9dcde;
  background:rgba(247,248,248,.78);
}
#app .shoefabrik-services .sf-service-nav button {
  gap:12px;
  padding:16px 4px;
  line-height:1.2;
}
#app .shoefabrik-services .sf-service-nav button:is(:hover,.is-active) { padding-left:10px; }
#app .shoefabrik-services .sf-service-feature {
  grid-template-columns:minmax(0,52%) minmax(0,48%);
  min-height:640px;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
#app .shoefabrik-services .sf-service-image { min-height:640px; }
#app .shoefabrik-services .sf-service-copy { padding:clamp(34px,3.4vw,64px); }
#app .shoefabrik-services .sf-service-copy h3 {
  font-size:clamp(28px,2.45vw,44px);
  line-height:1.04;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
#app .shoefabrik-services .sf-service-copy p { font-size:clamp(15px,1vw,18px); }

@media (max-width:1000px) and (min-width:801px) {
  #app .shoefabrik-services .sf-services-stage { grid-template-columns:34% 66%; }
  #app .shoefabrik-services .sf-service-feature { grid-template-columns:48% 52%; }
  #app .shoefabrik-services .sf-service-nav { padding:28px 20px; }
  #app .shoefabrik-services .sf-service-copy { padding:30px; }
#app .shoefabrik-services .sf-service-copy h3 { font-size:30px; }
}

/* Keep desktop contact content in normal flow so location panels cannot
   overlap the form when the form grows. */
@media (min-width:801px) {
  #app .contact-container {
    height:auto;
    min-height:100vh;
    max-height:none;
    padding:120px 0 84px;
    box-sizing:border-box;
  }
  #app .contact-box {
    height:auto;
    min-height:620px;
    margin:0 auto;
    align-items:stretch;
  }
  #app .contact-box .left-box,
  #app .contact-box .right-box { min-height:620px; }
  #app .contact-box .right-box { padding-top:48px; padding-bottom:32px; }
}

/* Keep every service reachable on touch screens. */
@media (max-width:800px) {
  #app .shoefabrik-services .sf-service-nav {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
    overflow:visible;
    scroll-snap-type:none;
  }
  #app .shoefabrik-services .sf-service-nav button {
    width:100%;
    min-height:52px;
    padding:10px 12px;
    align-items:center;
    white-space:normal;
    overflow-wrap:anywhere;
    border-radius:14px;
    line-height:1.15;
  }
  #app .shoefabrik-services .sf-service-nav button:is(:hover,.is-active) { padding-left:12px; }
  #app .shoefabrik-services .sf-service-nav button span { flex:0 0 auto; }
}

@media (max-width:420px) {
  #app .shoefabrik-services .sf-service-nav { grid-template-columns:1fr; }
  #app .shoefabrik-services .sf-service-nav button { min-height:48px; }
}

/* Partner logo marquee adapted from the reference site's services footer. */
#app .partner-logo-marquee {
  position:relative;
  width:100%;
  height:auto;
  padding:24px 0;
  overflow:hidden;
  border-top:1px solid #d8dcde;
  border-bottom:1px solid #d8dcde;
  background:#f1f3f3 url('./assets/bg1-DT0Ot5p7.png') center/cover no-repeat;
}
#app .partner-logo-marquee::before,
#app .partner-logo-marquee::after { content:""; position:absolute; z-index:2; top:0; bottom:0; width:8vw; pointer-events:none; }
#app .partner-logo-marquee::before { left:0; background:linear-gradient(90deg,#f1f3f3,transparent); }
#app .partner-logo-marquee::after { right:0; background:linear-gradient(-90deg,#f1f3f3,transparent); }
#app .partner-logo-track { display:flex; width:max-content; animation:partner-logo-scroll 42s linear infinite; will-change:transform; }
#app .partner-logo-marquee:hover .partner-logo-track { animation-play-state:paused; }
#app .partner-logo-set { display:flex; align-items:center; flex:none; }
#app .partner-logo { display:flex; align-items:center; justify-content:center; width:clamp(120px,10vw,190px); height:72px; padding:12px 22px; }
#app .partner-logo img { display:block; max-width:100%; max-height:46px; width:auto; height:auto; object-fit:contain; filter:grayscale(1) contrast(1.1); opacity:.9; }
@keyframes partner-logo-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }

@media (max-width:800px) {
  #app .partner-logo-marquee { padding:15px 0; }
  #app .partner-logo { width:112px; height:58px; padding:9px 15px; }
  #app .partner-logo img { max-height:36px; }
  #app .partner-logo-track { animation-duration:30s; }
  #app .reference-about .stat-card .text-3 {
    top:45%;
    left:57%;
    white-space:nowrap;
  }
  #app[data-site-page="home"] .process-section {
    display:flex;
    height:auto !important;
    min-height:0 !important;
    padding:52px 6% 46px;
    flex-direction:column;
    gap:34px;
    overflow:hidden;
  }
  #app[data-site-page="home"] .process-section > .left-content {
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  #app[data-site-page="home"] .process-section .left-content .section-title {
    width:100%;
    height:auto;
    margin:0 0 28px;
  }
  #app[data-site-page="home"] .process-section .left-content .section-title .tag {
    margin:0 0 12px;
    font-size:14px;
  }
  #app[data-site-page="home"] .process-section .left-content .section-title .main-title {
    margin:0 0 12px;
    font-size:34px;
    line-height:1.02;
  }
  #app[data-site-page="home"] .process-section .left-content .section-title .sub-title {
    margin:0;
    font-size:16px;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card {
    width:100%;
    overflow:visible;
    border-radius:0;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .shoe-img {
    width:100%;
    height:auto;
    max-height:430px;
    margin:0;
    object-fit:cover;
    border-radius:16px;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay {
    position:relative;
    inset:auto;
    width:100%;
    padding:28px 0 0;
    transform:none;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay .card-title .red-line {
    width:64px;
    height:5px;
    margin:0 0 18px;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay .card-title h3 {
    margin:0 0 16px;
    font-size:25px;
    line-height:1.08;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay .card-desc {
    margin:0 0 20px;
    font-size:16px;
    line-height:1.55;
    letter-spacing:0;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay .card-tags {
    gap:10px;
  }
  #app[data-site-page="home"] .process-section .left-content .image-card .card-overlay .card-tags .tag-item {
    padding:10px 13px;
    font-size:12px;
  }
  #app[data-site-page="home"] .process-section > .right-list {
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    margin:0;
    padding:8px 20px;
    border-radius:16px;
    background:#111;
  }
  #app[data-site-page="home"] .process-section .right-list .process-box {
    margin:0;
  }
  #app[data-site-page="home"] .process-section .right-list .process-box .process-item {
    width:100%;
    margin:0;
    padding:20px 0;
    border-bottom:1px solid rgba(255,255,255,.13);
  }
  #app[data-site-page="home"] .process-section .right-list .process-box .process-item:last-child {
    border-bottom:0;
  }
  #app[data-site-page="home"] .process-section .right-list .process-box .process-item .item-title {
    margin:0 0 9px;
    font-size:21px;
    line-height:1.15;
  }
  #app[data-site-page="home"] .process-section .right-list .process-box .process-item .item-desc {
    width:100%;
    margin:0;
    font-size:15px;
    line-height:1.5;
  }
}

@media (prefers-reduced-motion:reduce) {
  #app .partner-logo-track { animation:none; }
  #app .partner-logo-marquee { overflow-x:auto; }
}

/* Contact: place the Vietnam copy before the factory image. */
@media (min-width:769px) {
  #app .location-banner[data-v-90fceab1] {
    flex-direction:row-reverse;
  }
  #app .location-info[data-v-90fceab1] {
    align-items:flex-start;
    text-align:left;
  }
  #app .location-info .location-icon[data-v-90fceab1] {
    margin-top:7.5rem;
  }
  #app .location-info .location-address[data-v-90fceab1] {
    text-align:left;
  }
}

@media (max-width:768px) {
  #app .location-banner[data-v-90fceab1] .location-info { order:1; }
  #app .location-banner[data-v-90fceab1] .location-img { order:2; }
}

/* Contact mobile: keep the Vietnam copy and image compact and in one flow. */
@media (max-width:768px) {
  #app .location-banner[data-v-90fceab1] {
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:32px 6% 48px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:22px !important;
  }
  #app .location-banner[data-v-90fceab1] .location-info {
    order:1 !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    text-align:left !important;
  }
  #app .location-banner[data-v-90fceab1] .location-img {
    order:2 !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    flex:0 0 auto !important;
    margin:0 !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }
  #app .location-banner[data-v-90fceab1] .location-img img {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    object-fit:contain !important;
    object-position:center !important;
    border-radius:18px !important;
  }
  #app .location-banner[data-v-90fceab1] .location-icon {
    width:42px !important;
    height:42px !important;
    margin:0 0 12px !important;
  }
  #app .location-banner[data-v-90fceab1] .location-tag {
    margin:0 0 14px !important;
  }
  #app .location-banner[data-v-90fceab1] .location-title {
    margin:0 0 14px !important;
    font-size:clamp(32px,9vw,46px) !important;
    line-height:1.05 !important;
  }
  #app .location-banner[data-v-90fceab1] .location-address {
    margin:0 !important;
    text-align:left !important;
  }
  #app .location-banner[data-v-90fceab1] .btn {
    align-self:flex-start !important;
    margin-top:20px !important;
  }
}

/* Contact mobile: Vietnam uses image first, then its copy as one compact card. */
@media (max-width:768px) {
  #app .location-banner[data-v-90fceab1] {
    padding:24px 6% 40px !important;
    gap:24px !important;
  }
  #app .location-banner[data-v-90fceab1] .location-img {
    order:1 !important;
  }
  #app .location-banner[data-v-90fceab1] .location-info {
    order:2 !important;
    padding:0 !important;
  }
  #app .location-banner[data-v-90fceab1] .location-img img {
    width:100% !important;
    height:auto !important;
    object-fit:cover !important;
    object-position:center !important;
  }
}

@media (max-width:800px) {
  #app .shoefabrik-services .sf-services-stage { display:block; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
  #app .shoefabrik-services .sf-service-nav { justify-content:flex-start; padding:0 0 18px; border:0; background:transparent; }
  #app .shoefabrik-services .sf-service-nav button:is(:hover,.is-active) { padding-left:16px; }
  #app .shoefabrik-services .sf-service-feature { border-radius:20px; background:rgba(255,255,255,.94); box-shadow:0 20px 50px rgba(24,32,40,.14); }
  #app .shoefabrik-services .sf-service-copy h3 { font-size:30px; }
}