/* MB Vez optimized CSS - grouped page hero blocks, compact formatting */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg-main:#f8f1e7;--bg-light:#fffaf2;--bg-soft:#efe0cc;--dark:#1e1a15;--brown:#5b4632;--muted:#7a6f63;--gold:#b9965a;--gold-soft:rgba(185,150,90,0.18);--border:rgba(31,27,22,0.1);--font-heading:'Cormorant Garamond',serif;--font-body:'Inter',sans-serif;--container:1180px;--transition:0.35s ease;--shadow-soft:0 18px 45px rgba(91,70,50,0.08)
}
*,*::before,*::after{
  margin:0;padding:0;box-sizing:border-box
}
html{
  scroll-behavior:smooth
}
body{
  font-family:var(--font-body);background:var(--bg-main);color:var(--dark);overflow-x:hidden
}
img,svg{
  display:block;max-width:100%
}
.hidden-field {
  display: none;
}
.form-alert {
  margin-bottom: 22px;
  padding: 16px 18px;
  border-radius: 16px;

  font-size: 14px;
  line-height: 1.6;
  font-weight: 600;
}

.form-alert-success {
  border: 1px solid rgba(69, 136, 92, 0.25);
  background: rgba(69, 136, 92, 0.08);
  color: #2f6f49;
}

.form-alert-error {
  border: 1px solid rgba(150, 70, 58, 0.25);
  background: rgba(150, 70, 58, 0.08);
  color: #8a3d33;
}
a{
  color:inherit;text-decoration:none
}
button{
  font:inherit
}
.container{
  width:min(100% - 40px,var(--container));margin-inline:auto
}
.site-header{
  position:fixed;top:0;left:0;z-index:9999;width:100%;background:rgba(255,250,242,0.86);border-bottom:1px solid rgba(31,27,22,0.12);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:background-color var(--transition),box-shadow var(--transition)
}
.site-header.scrolled{
  background:rgba(255,250,242,0.94);box-shadow:0 14px 35px rgba(91,70,50,0.08)
}
.navbar{
  position:relative;width:min(100% - 48px,1280px);height:72px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between
}
#nav-slika{
 width:55px;
}
.logo{
  position:absolute;left:50%;transform:translateX(-50%);font-family:var(--font-heading);font-size:28px;line-height:1;font-weight:700;color:var(--dark);white-space:nowrap;letter-spacing:0.01em
}
.logo span{
  color:var(--gold)
}
.nav-menu{
  list-style:none;display:flex;align-items:center;gap:32px
}
.nav-menu a{
  position:relative;display:inline-block;padding:8px 0;font-size:11px;font-weight:700;color:rgba(30,26,21,0.68);text-transform:uppercase;letter-spacing:0.1em;transition:color 0.35s ease
}
.nav-menu a::after{
  content:"";position:absolute;left:50%;bottom:-8px;width:26px;height:1px;background:var(--gold);transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform 0.45s cubic-bezier(0.22,1,0.36,1)
}
.nav-menu a:hover,.nav-menu a.active{
  color:var(--gold)
}
.nav-menu a:hover::after,.nav-menu a.active::after{
  transform:translateX(-50%) scaleX(1)
}
.nav-cta{
  padding:11px 18px;border-radius:999px;background:var(--dark);color:var(--bg-light);font-size:12px;font-weight:700;white-space:nowrap;transition:background-color var(--transition),color var(--transition),transform var(--transition),box-shadow var(--transition)
}
.nav-cta:hover{
  background:var(--gold);color:var(--dark);transform:translateY(-2px);box-shadow:0 12px 28px rgba(185,150,90,0.24)
}
.nav-toggle{
  display:none;width:42px;height:42px;border:1px solid rgba(31,27,22,0.12);border-radius:50%;background:transparent;cursor:pointer
}
.nav-toggle span{
  display:block;width:18px;height:2px;margin:4px auto;border-radius:10px;background:var(--dark);transition:transform var(--transition),opacity var(--transition)
}
.nav-toggle.active span:nth-child(1){
  transform:translateY(6px) rotate(45deg)
}
.nav-toggle.active span:nth-child(2){
  opacity:0
}
.nav-toggle.active span:nth-child(3){
  transform:translateY(-6px) rotate(-45deg)
}
.hero{
  position:relative;min-height:100vh;padding:105px 0 80px;overflow:hidden;background:linear-gradient(135deg,#fffaf3 0%,#f8f1e7 48%,#efe0cc 100%)
}
.hero-wrapper{
  position:relative;z-index:3;display:grid;grid-template-columns:1fr 0.95fr;align-items:center;gap:70px
}
.hero-bg{
  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none
}
.paper-texture{
  position:absolute;inset:0;opacity:0.42;mix-blend-mode:multiply;background-image:radial-gradient(circle at 30% 20%,rgba(31,27,22,0.035) 0 0.6px,transparent 0.8px),radial-gradient(circle at 70% 80%,rgba(31,27,22,0.025) 0 0.6px,transparent 0.8px),linear-gradient(90deg,rgba(31,27,22,0.014),transparent 38%,rgba(255,255,255,0.18) 72%,transparent),linear-gradient(0deg,rgba(31,27,22,0.012),transparent 45%,rgba(255,255,255,0.14) 80%,transparent);background-size:16px 16px,22px 22px,280px 280px,240px 240px
}
.soft-glow{
  position:absolute;border-radius:999px;filter:blur(34px);pointer-events:none
}
.glow-one{
  width:520px;height:520px;right:-130px;top:110px;background:rgba(185,150,90,0.16);opacity:0.55
}
.glow-two{
  width:360px;height:360px;left:-160px;bottom:30px;background:rgba(185,150,90,0.09);opacity:0.55
}
.thread{
  position:absolute;overflow:visible;pointer-events:none
}
.thread path{
  fill:none;stroke:rgba(185,150,90,0.42);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:7 11
}
.thread-left{
  width:1080px;height:auto;left:-300px;top:40px;opacity:0.95;transform:rotate(-2deg)
}
.thread-right{
  width:1500px;height:auto;right:-460px;top:250px;opacity:0.78;transform:rotate(2deg)
}
.thread-right path{
  stroke:rgba(185,150,90,0.34);stroke-width:1.5;stroke-dasharray:7 12
}
.hero-bg-shape{
  position:absolute;right:-180px;top:130px;z-index:0;width:520px;height:520px;border-radius:50%;background:rgba(185,150,90,0.12);filter:blur(26px);pointer-events:none
}
.hero-content{
  max-width:720px
}
.eyebrow{
  margin-bottom:18px;color:var(--gold);font-size:13px;font-weight:800;letter-spacing:0.18em;text-transform:uppercase
}
.hero h1{
  max-width:700px;font-family:var(--font-heading);font-size:clamp(58px,7vw,106px);line-height:0.92;font-weight:600;letter-spacing:-0.045em;color:var(--dark)
}
.highlight-text{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.highlight-text::after{
  content:"";position:absolute;left:2%;bottom:2px;width:58%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.hero-text{
  max-width:520px;margin-top:28px;color:var(--muted);font-size:17px;line-height:1.75
}
.hero-actions{
  margin-top:38px;display:flex;align-items:center;gap:16px;flex-wrap:wrap
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;font-size:14px;font-weight:700;transition:background-color var(--transition),color var(--transition),border-color var(--transition),transform var(--transition),box-shadow var(--transition)
}
.btn-primary{
  background:var(--dark);color:var(--bg-light);box-shadow:0 16px 34px rgba(30,26,21,0.16)
}
.btn-primary:hover{
  background:var(--gold);color:var(--dark);transform:translateY(-3px);box-shadow:0 20px 42px rgba(185,150,90,0.26)
}
.btn-secondary{
  border:1px solid rgba(31,27,22,0.15);background:rgba(255,250,242,0.55);color:var(--dark)
}
.btn-secondary:hover{
  border-color:rgba(185,150,90,0.7);background:rgba(185,150,90,0.12);transform:translateY(-3px)
}
.hero-stats{
  margin-top:54px;display:flex;align-items:flex-start;gap:34px;flex-wrap:wrap
}
.hero-stats div{
  position:relative
}
.hero-stats div:not(:last-child)::after{
  content:"";position:absolute;top:8px;right:-18px;width:1px;height:38px;background:rgba(31,27,22,0.12)
}
.hero-stats strong{
  display:block;font-family:var(--font-heading);font-size:29px;line-height:1;font-weight:700;color:var(--dark)
}
.hero-stats span{
  display:block;margin-top:6px;color:var(--muted);font-size:13px
}
.hero-visual{
  position:relative;min-height:620px;display:flex;align-items:center;justify-content:center
}
.image-glow{
  position:absolute;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(185,150,90,0.26),transparent 68%);filter:blur(16px);pointer-events:none
}
.hero-product{
  position:relative;z-index:2;width:min(100%,560px);max-height:650px;object-fit:contain;filter:drop-shadow(0 36px 42px rgba(91,70,50,0.23));animation:floatProduct 5.5s ease-in-out infinite;will-change:transform
}
@keyframes floatProduct{
  0%,100%{
    transform:translateY(0)
  }
  50%{
    transform:translateY(-14px)
  }
}
.floating-card{
  position:absolute;z-index:4;min-width:170px;padding:16px 18px;border:1px solid rgba(31,27,22,0.08);border-radius:18px;background:rgba(255,250,242,0.76);box-shadow:0 22px 50px rgba(91,70,50,0.13);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.floating-card span{
  display:block;margin-bottom:5px;color:var(--gold);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:0.1em
}
.floating-card strong{
  display:block;font-family:var(--font-heading);color:var(--dark);font-size:22px;line-height:1.05;font-weight:700
}
.card-one{
  top:115px;left:0
}
.card-two{
  right:0;bottom:115px
}
.detail-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 8% 20%,rgba(185,150,90,0.07),transparent 28%),linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.detail-section::before{
  content:"";position:absolute;left:-160px;bottom:80px;width:380px;height:380px;border-radius:50%;background:rgba(185,150,90,0.08);filter:blur(34px);pointer-events:none
}
.detail-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:0.95fr 1.05fr;align-items:center;gap:90px
}
.detail-content{
  max-width:610px
}
.section-label{
  display:inline-block;margin-bottom:18px;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:0.18em;text-transform:uppercase
}
.detail-content h2{
  max-width:560px;font-family:var(--font-heading);font-size:clamp(50px,5.6vw,82px);line-height:0.94;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.detail-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.detail-content h2 span::after{
  content:"";position:absolute;left:4%;bottom:2px;width:72%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.detail-text{
  max-width:560px;margin-top:28px;color:var(--muted);font-size:17px;line-height:1.75
}
.detail-list{
  margin-top:44px;border-top:1px solid rgba(31,27,22,0.1)
}
.detail-item{
  display:grid;grid-template-columns:62px 1fr;gap:22px;padding:26px 0;border-bottom:1px solid rgba(31,27,22,0.1)
}
.detail-item>span{
  color:var(--gold);font-family:var(--font-heading);font-size:26px;line-height:1;font-weight:700
}
.detail-item h3{
  margin-bottom:7px;color:var(--dark);font-family:var(--font-heading);font-size:28px;line-height:1.05;font-weight:700
}
.detail-item p{
  max-width:430px;color:var(--muted);font-size:14px;line-height:1.7
}
.detail-visual{
  position:relative;min-height:640px;display:flex;align-items:center;justify-content:center
}
.detail-arch{
  position:absolute;top:20px;right:40px;width:72%;height:86%;border:1px solid rgba(185,150,90,0.32);border-bottom:0;border-radius:320px 320px 0 0;pointer-events:none
}
.detail-arch::before{
  content:"";position:absolute;inset:18px 18px auto 18px;height:calc(100% - 18px);border:1px solid rgba(185,150,90,0.14);border-bottom:0;border-radius:300px 300px 0 0
}
.detail-image-wrap{
  position:relative;width:min(100%,500px);height:590px;border-radius:260px 260px 32px 32px;overflow:hidden;background:#efe0cc;box-shadow:0 34px 80px rgba(91,70,50,0.16)
}
.detail-image-wrap::after{
  content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent 62%,rgba(30,26,21,0.18)),linear-gradient(to right,rgba(255,250,242,0.18),transparent 45%);pointer-events:none
}
.detail-image{
  width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 0.7s ease
}
.detail-image-wrap:hover .detail-image{
  transform:scale(1.06)
}
.detail-floating-label{
  position:absolute;left:26px;bottom:26px;z-index:2;padding:16px 18px;min-width:190px;border:1px solid rgba(255,250,242,0.38);border-radius:18px;background:rgba(255,250,242,0.78);box-shadow:0 18px 45px rgba(30,26,21,0.13);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.detail-floating-label span{
  display:block;margin-bottom:5px;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em
}
.detail-floating-label strong{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:25px;line-height:1;font-weight:700
}
.services-preview-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 88% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.services-preview-section::before{
  content:"";position:absolute;left:-220px;top:120px;width:440px;height:440px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(36px);pointer-events:none
}
.services-preview-wrapper{
  position:relative;z-index:2
}
.services-preview-heading{
  max-width:820px;margin-bottom:70px
}
.services-preview-heading h2{
  max-width:760px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.services-preview-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.services-preview-heading h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.services-preview-heading p{
  max-width:620px;margin-top:26px;color:var(--muted);font-size:17px;line-height:1.75
}
.services-list{
  border-top:1px solid rgba(31,27,22,0.12)
}
.service-row{
  position:relative;isolation:isolate;min-height:138px;padding:34px 0;display:grid;grid-template-columns:90px 1fr 180px 48px;align-items:center;gap:28px;border-bottom:1px solid rgba(31,27,22,0.12);color:var(--dark);overflow:hidden;transition:padding var(--transition),background-color var(--transition),border-color var(--transition)
}
.service-row::before{
  content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(255,250,242,0.94),rgba(185,150,90,0.08));opacity:0;transition:opacity var(--transition)
}
.service-row:hover{
  padding-inline:28px;border-color:rgba(185,150,90,0.28)
}
.service-row:hover::before{
  opacity:1
}
.service-number{
  color:var(--gold);font-family:var(--font-heading);font-size:30px;line-height:1;font-weight:700
}
.service-info h3{
  margin-bottom:8px;font-family:var(--font-heading);font-size:clamp(34px,4vw,56px);line-height:0.95;font-weight:600;letter-spacing:-0.03em;color:var(--dark);transition:color var(--transition)
}
.service-info p{
  max-width:520px;color:var(--muted);font-size:15px;line-height:1.65
}
.service-row:hover .service-info h3{
  color:var(--brown)
}
.service-image{
  width:160px;height:92px;border-radius:999px;overflow:hidden;background:#efe0cc;opacity:0;transform:translateX(20px) scale(0.94);box-shadow:0 18px 45px rgba(91,70,50,0.12);transition:opacity var(--transition),transform var(--transition)
}
.service-image img{
  width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 0.7s ease
}
.service-row:hover .service-image{
  opacity:1;transform:translateX(0) scale(1)
}
.service-row:hover .service-image img{
  transform:scale(1.16)
}
.service-arrow{
  width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(31,27,22,0.14);border-radius:50%;color:var(--dark);font-size:20px;transition:background-color var(--transition),color var(--transition),border-color var(--transition),transform var(--transition)
}
.service-row:hover .service-arrow{
  background:var(--gold);border-color:var(--gold);color:var(--dark);transform:rotate(45deg)
}
.material-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 12% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.material-section::before{
  content:"";position:absolute;right:-220px;top:140px;width:460px;height:460px;border-radius:50%;background:rgba(185,150,90,0.08);filter:blur(36px);pointer-events:none
}
.material-section::after{
  content:"";position:absolute;left:-180px;bottom:80px;width:360px;height:360px;border-radius:50%;background:rgba(91,70,50,0.045);filter:blur(34px);pointer-events:none
}
.material-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:0.95fr 1.05fr;align-items:center;gap:90px
}
.material-visual{
  position:relative
}
.material-image-frame{
  position:relative;width:min(100%,520px);height:640px;border-radius:32px 260px 32px 32px;overflow:hidden;background:#efe0cc;box-shadow:0 34px 80px rgba(91,70,50,0.15)
}
.material-image-frame::before{
  content:"";position:absolute;inset:18px;z-index:2;border:1px solid rgba(255,250,242,0.42);border-radius:24px 230px 24px 24px;pointer-events:none
}
.material-image-frame::after{
  content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(255,250,242,0.08),rgba(30,26,21,0.28)),linear-gradient(to right,rgba(255,250,242,0.16),transparent 45%);pointer-events:none
}
.material-image{
  width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 0.8s ease
}
.material-image-frame:hover .material-image{
  transform:scale(1.08)
}
.material-floating-label{
  position:absolute;left:28px;bottom:28px;z-index:3;max-width:260px;padding:16px 18px;border:1px solid rgba(255,250,242,0.42);border-radius:18px;background:rgba(255,250,242,0.78);box-shadow:0 18px 45px rgba(30,26,21,0.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.material-floating-label span{
  display:block;margin-bottom:6px;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em
}
.material-floating-label strong{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:25px;line-height:1.05;font-weight:700
}
.material-content{
  max-width:650px
}
.material-content h2{
  max-width:650px;font-family:var(--font-heading);font-size:clamp(48px,5.3vw,78px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.material-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.material-content h2 span::after{
  content:"";position:absolute;left:4%;bottom:2px;width:70%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.material-text{
  max-width:620px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.material-text+.material-text{
  margin-top:16px
}
.material-points{
  margin-top:42px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(31,27,22,0.1);border-left:1px solid rgba(31,27,22,0.1)
}
.material-point{
  min-height:170px;padding:26px 24px;border-right:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1);background:rgba(255,250,242,0.38);transition:background-color var(--transition),transform var(--transition)
}
.material-point:hover{
  background:rgba(255,250,242,0.82);transform:translateY(-4px)
}
.material-point>span{
  display:block;margin-bottom:22px;color:var(--gold);font-family:var(--font-heading);font-size:24px;line-height:1;font-weight:700
}
.material-point h3{
  margin-bottom:8px;color:var(--dark);font-family:var(--font-heading);font-size:26px;line-height:1.05;font-weight:700
}
.material-point p{
  color:var(--muted);font-size:13px;line-height:1.65
}
.process-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 85% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.process-section::before{
  content:"";position:absolute;left:-240px;top:120px;width:460px;height:460px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(38px);pointer-events:none
}
.process-section::after{
  content:"";position:absolute;right:-180px;bottom:80px;width:360px;height:360px;border-radius:50%;background:rgba(91,70,50,0.045);filter:blur(34px);pointer-events:none
}
.process-wrapper{
  position:relative;z-index:2
}
.process-heading{
  max-width:820px;margin-bottom:90px
}
.process-heading h2{
  max-width:760px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.process-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.process-heading h2 span::after{
  content:"";position:absolute;left:5%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.process-heading p{
  max-width:620px;margin-top:26px;color:var(--muted);font-size:17px;line-height:1.75
}
.process-timeline{
  position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:28px
}
.process-line{
  position:absolute;top:71px;left:0;right:0;height:1px;background:linear-gradient( 90deg,rgba(185,150,90,0.08),rgba(185,150,90,0.46),rgba(185,150,90,0.08) )
}
.process-step{
  position:relative;min-height:300px;padding:0 20px 28px 0
}
.process-number{
  display:block;margin-bottom:34px;color:rgba(185,150,90,0.9);font-family:var(--font-heading);font-size:42px;line-height:1;font-weight:700
}
.process-dot{
  position:absolute;top:64px;left:0;width:16px;height:16px;border-radius:50%;background:var(--bg-light);border:1px solid rgba(185,150,90,0.7);box-shadow:0 0 0 8px rgba(185,150,90,0.09);transition:background-color var(--transition),transform var(--transition),box-shadow var(--transition)
}
.process-step:hover .process-dot{
  background:var(--gold);transform:scale(1.08);box-shadow:0 0 0 12px rgba(185,150,90,0.12)
}
.process-step h3{
  max-width:240px;margin-top:44px;margin-bottom:14px;color:var(--dark);font-family:var(--font-heading);font-size:30px;line-height:1.05;font-weight:700
}
.process-step p{
  max-width:260px;color:var(--muted);font-size:14px;line-height:1.7
}
.work-preview-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 12% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.work-preview-section::before{
  content:"";position:absolute;right:-240px;top:120px;width:460px;height:460px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(38px);pointer-events:none
}
.work-preview-wrapper{
  position:relative;z-index:2
}
.work-preview-heading{
  max-width:820px;margin-bottom:70px
}
.work-preview-heading h2{
  max-width:780px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.work-preview-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.work-preview-heading h2 span::after{
  content:"";position:absolute;left:5%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.work-preview-heading p{
  max-width:640px;margin-top:26px;color:var(--muted);font-size:17px;line-height:1.75
}
.work-grid{
  display:grid;grid-template-columns:1.15fr 0.85fr;grid-template-rows:repeat(3,190px);gap:22px
}
.work-card{
  position:relative;overflow:hidden;border-radius:28px;background:#efe0cc;box-shadow:0 24px 60px rgba(91,70,50,0.1);isolation:isolate
}
.work-card-large{
  grid-row:span 3;border-radius:36px 260px 36px 36px
}
.work-card img{
  width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 0.8s ease
}
.work-card:hover img{
  transform:scale(1.1)
}
.work-card::after{
  content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,transparent 45%,rgba(30,26,21,0.48)),linear-gradient(to right,rgba(255,250,242,0.12),transparent 45%);pointer-events:none
}
.work-card-content{
  position:absolute;left:24px;right:24px;bottom:24px;z-index:2
}
.work-card-content span{
  display:inline-flex;margin-bottom:8px;padding:7px 11px;border-radius:999px;background:rgba(255,250,242,0.78);color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.work-card-content h3{
  max-width:420px;color:var(--bg-light);font-family:var(--font-heading);font-size:30px;line-height:1.05;font-weight:700
}
.work-card-large .work-card-content h3{
  font-size:clamp(34px,4vw,54px)
}
.work-preview-action{
  margin-top:42px;display:flex;justify-content:flex-end
}
.final-cta-section{
  position:relative;padding:120px 0;background:linear-gradient(135deg,#f8f1e7 0%,#fffaf2 48%,#efe0cc 100%);overflow:hidden
}
.final-cta-wrapper{
  position:relative;z-index:2;padding:86px 40px;border:1px solid rgba(31,27,22,0.08);border-radius:42px;background:rgba(255,250,242,0.68);box-shadow:0 34px 90px rgba(91,70,50,0.1);text-align:center;overflow:hidden
}
.final-cta-bg{
  position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden
}
.final-thread{
  position:absolute;left:50%;top:10%;width:980px;transform:translateX(-50%) rotate(-2deg);opacity:0.38
}
.final-thread path{
  stroke:rgba(185,150,90,0.52);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:7 12
}
.final-cta-wrapper::before{
  content:"";position:absolute;right:-180px;top:-180px;width:420px;height:420px;border-radius:50%;background:rgba(185,150,90,0.12);filter:blur(34px);pointer-events:none
}
.final-cta-wrapper h2{
  max-width:860px;margin-inline:auto;font-family:var(--font-heading);font-size:clamp(52px,6vw,92px);line-height:0.95;font-weight:600;letter-spacing:-0.045em;color:var(--dark)
}
.final-cta-wrapper h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.final-cta-wrapper h2 span::after{
  content:"";position:absolute;left:8%;bottom:2px;width:70%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.final-cta-wrapper p{
  max-width:650px;margin:28px auto 0;color:var(--muted);font-size:17px;line-height:1.75
}
.final-cta-actions{
  margin-top:40px;display:flex;justify-content:center;gap:16px;flex-wrap:wrap
}
.site-footer{
  position:relative;padding:76px 0 28px;background:#1e1a15;color:var(--bg-light);overflow:hidden
}
.site-footer::before{
  content:"";position:absolute;right:-180px;top:-180px;width:420px;height:420px;border-radius:50%;background:rgba(185,150,90,0.11);filter:blur(40px);pointer-events:none
}
.footer-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:1.2fr 0.7fr 0.8fr;gap:70px;padding-bottom:58px;border-bottom:1px solid rgba(255,250,242,0.12)
}
.footer-logo{
  display:inline-block;margin-bottom:20px;font-family:var(--font-heading);font-size:32px;line-height:1;font-weight:700;color:var(--bg-light)
}
.footer-logo span{
  color:var(--gold)
}
#footer-slika{
  width:150px;
}
.footer-brand p{
  max-width:430px;color:rgba(255,250,242,0.68);font-size:15px;line-height:1.75
}
.footer-links h3,.footer-contact h3{
  margin-bottom:20px;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:0.16em;text-transform:uppercase
}
.footer-links ul,.footer-contact ul{
  list-style:none
}
.footer-links li,.footer-contact li{
  margin-bottom:12px;color:rgba(255,250,242,0.68);font-size:14px
}
.footer-links a,.footer-contact a{
  transition:color var(--transition)
}
.footer-links a:hover,.footer-contact a:hover{
  color:var(--gold)
}
.footer-bottom{
  position:relative;z-index:2;padding-top:24px;display:flex;align-items:center;justify-content:space-between;gap:24px
}
.footer-bottom p,.footer-bottom a{
  color:rgba(255,250,242,0.58);font-size:13px
}
.footer-bottom a{
  transition:color var(--transition)
}
.footer-bottom a:hover{
  color:var(--gold)
}
.about-hero,.works-hero,.services-hero,.contact-hero{
  position:relative;padding:160px 0 110px;background:radial-gradient(circle at 82% 20%,rgba(185,150,90,0.1),transparent 28%),linear-gradient(135deg,#fffaf3 0%,#f8f1e7 52%,#efe0cc 100%);overflow:hidden
}
.about-hero-bg,.works-hero-bg,.services-hero-bg,.contact-hero-bg{
  position:absolute;inset:0;overflow:hidden;pointer-events:none
}
.about-thread,.works-thread,.services-thread,.contact-thread{
  position:absolute;left:50%;top:24%;width:980px;transform:translateX(-50%) rotate(-2deg);opacity:0.35
}
.about-thread path,.works-thread path,.services-thread path,.contact-thread path{
  stroke:rgba(185,150,90,0.52);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:7 12
}
.about-hero-wrapper,.works-hero-wrapper,.services-hero-wrapper,.contact-hero-wrapper{
  position:relative;z-index:2;max-width:940px;text-align:center
}
.about-hero-wrapper{
  max-width:900px
}
.services-hero-wrapper{
  max-width:980px
}
.about-hero h1,.works-hero h1,.services-hero h1,.contact-hero h1{
  max-width:920px;margin-inline:auto;font-family:var(--font-heading);font-size:clamp(58px,7vw,104px);line-height:0.92;font-weight:600;letter-spacing:-0.045em;color:var(--dark)
}
.about-hero h1{
  max-width:900px
}
.services-hero h1{
  max-width:960px
}
.about-hero h1 span,.works-hero h1 span,.services-hero h1 span,.contact-hero h1 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.about-hero h1 span::after,.works-hero h1 span::after,.services-hero h1 span::after,.contact-hero h1 span::after{
  content:"";position:absolute;left:7%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.about-hero p,.works-hero p,.services-hero p,.contact-hero p{
  max-width:680px;margin:30px auto 0;color:var(--muted);font-size:17px;line-height:1.75
}
.services-hero p{
  max-width:720px
}
.services-hero-actions{
  display:flex;justify-content:center;gap:14px;margin-top:38px;flex-wrap:wrap
}
.story-section{
  position:relative;padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.story-wrapper{
  display:grid;grid-template-columns:1.05fr 0.95fr;align-items:center;gap:90px
}
.story-content h2{
  max-width:650px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.story-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.story-content h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.story-content p{
  max-width:620px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.story-content p+p{
  margin-top:16px
}
.story-note{
  position:relative;padding:54px 46px;border:1px solid rgba(31,27,22,0.08);border-radius:34px 180px 34px 34px;background:rgba(255,250,242,0.72);box-shadow:0 30px 80px rgba(91,70,50,0.1);overflow:hidden
}
.story-note::before{
  content:"";position:absolute;right:-120px;top:-120px;width:280px;height:280px;border-radius:50%;background:rgba(185,150,90,0.12);filter:blur(30px);pointer-events:none
}
.story-note span{
  display:block;margin-bottom:16px;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:0.16em;text-transform:uppercase
}
.story-note strong{
  display:block;max-width:420px;font-family:var(--font-heading);font-size:clamp(34px,4vw,54px);line-height:1;font-weight:600;color:var(--dark)
}
.story-note p{
  max-width:420px;margin-top:24px;color:var(--muted);font-size:15px;line-height:1.75
}
.experience-section{
  position:relative;padding:130px 0;background:radial-gradient(circle at 82% 20%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.experience-section::before{
  content:"";position:absolute;left:-180px;bottom:60px;width:360px;height:360px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(34px);pointer-events:none
}
.experience-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:0.95fr 1.05fr;gap:90px;align-items:center
}
.experience-content{
  max-width:600px
}
.experience-content h2{
  max-width:620px;font-family:var(--font-heading);font-size:clamp(52px,5.7vw,84px);line-height:0.95;font-weight:600;letter-spacing:-0.045em;color:var(--dark)
}
.experience-content h2 span{
  position:relative;display:inline-block;margin-top:8px;color:var(--brown);font-style:italic
}
.experience-content h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.experience-text{
  max-width:500px;margin-top:28px;color:var(--muted);font-size:16px;line-height:1.78
}
.experience-points{
  margin-top:40px;border-top:1px solid rgba(31,27,22,0.1)
}
.experience-point{
  padding:22px 0;border-bottom:1px solid rgba(31,27,22,0.1)
}
.experience-point strong{
  display:block;margin-bottom:8px;color:var(--dark);font-family:var(--font-heading);font-size:28px;line-height:1.05;font-weight:700
}
.experience-point p{
  max-width:460px;color:var(--muted);font-size:14px;line-height:1.7
}
.experience-visual{
  position:relative;display:flex;justify-content:center
}
.experience-image-wrap{
  position:relative;width:min(100%,520px);height:620px;border-radius:34px 220px 34px 34px;overflow:hidden;background:#efe0cc;box-shadow:0 34px 80px rgba(91,70,50,0.15)
}
.experience-image-wrap::before{
  content:"";position:absolute;inset:18px;z-index:2;border:1px solid rgba(255,250,242,0.4);border-radius:24px 200px 24px 24px;pointer-events:none
}
.experience-image-wrap::after{
  content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(255,250,242,0.08),rgba(30,26,21,0.24)),linear-gradient(to right,rgba(255,250,242,0.14),transparent 45%);pointer-events:none
}
.experience-image{
  width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 0.8s ease
}
.experience-image-wrap:hover .experience-image{
  transform:scale(1.08)
}
.experience-badge{
  position:absolute;left:26px;bottom:26px;z-index:3;max-width:270px;padding:16px 18px;border:1px solid rgba(255,250,242,0.4);border-radius:18px;background:rgba(255,250,242,0.8);box-shadow:0 18px 45px rgba(30,26,21,0.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.experience-badge span{
  display:block;margin-bottom:6px;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em
}
.experience-badge strong{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:24px;line-height:1.08;font-weight:700
}
.values-section{
  padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%)
}
.values-heading{
  max-width:820px;text-align:center;margin:0 auto;margin-bottom:64px
}
.values-heading h2{
  max-width:780px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.values-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.values-heading h2 span::after{
  content:"";position:absolute;left:7%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.values-grid{
  display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(31,27,22,0.1);border-left:1px solid rgba(31,27,22,0.1)
}
.value-box{
  min-height:260px;padding:30px 26px;border-right:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1);background:rgba(255,250,242,0.38);transition:background-color var(--transition),transform var(--transition)
}
.value-box:hover{
  background:rgba(255,250,242,0.82);transform:translateY(-4px)
}
.value-box span{
  display:block;margin-bottom:28px;color:var(--gold);font-family:var(--font-heading);font-size:25px;font-weight:700
}
.value-box h3{
  margin-bottom:10px;color:var(--dark);font-family:var(--font-heading);font-size:28px;line-height:1.05;font-weight:700
}
.value-box p{
  color:var(--muted);font-size:14px;line-height:1.7
}
.works-gallery-section{
  position:relative;padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.works-gallery-section::before{
  content:"";position:absolute;right:-220px;top:120px;width:440px;height:440px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(38px);pointer-events:none
}
.works-gallery-wrapper{
  position:relative;z-index:2
}
.works-gallery-heading{
  max-width:720px;margin-bottom:58px
}
.works-gallery-heading h2{
  font-family:var(--font-heading);font-size:clamp(46px,5vw,76px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.works-gallery-heading p{
  max-width:620px;margin-top:22px;color:var(--muted);font-size:16px;line-height:1.75
}
.works-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px
}
.works-card{
  position:relative;height:420px;overflow:hidden;border-radius:30px;background:#efe0cc;box-shadow:0 24px 60px rgba(91,70,50,0.1);isolation:isolate
}
.works-card:nth-child(2),.works-card:nth-child(5){
  transform:translateY(34px)
}
.works-card img{
  width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 0.8s ease
}
.works-card:hover img{
  transform:scale(1.1)
}
.works-card::after{
  content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,transparent 45%,rgba(30,26,21,0.5)),linear-gradient(to right,rgba(255,250,242,0.12),transparent 45%);pointer-events:none
}
.works-card-content{
  position:absolute;left:24px;right:24px;bottom:24px;z-index:2;transform:translateY(8px);transition:transform var(--transition)
}
.works-card:hover .works-card-content{
  transform:translateY(0)
}
.works-card-content span{
  display:inline-flex;margin-bottom:9px;padding:7px 11px;border-radius:999px;background:rgba(255,250,242,0.78);color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.works-card-content h3{
  max-width:360px;color:var(--bg-light);font-family:var(--font-heading);font-size:30px;line-height:1.05;font-weight:700
}
.works-note-section{
  position:relative;padding:110px 0;background:radial-gradient(circle at 12% 22%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.works-note-wrapper{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:90px;align-items:start
}
.works-note-content h2{
  max-width:620px;font-family:var(--font-heading);font-size:clamp(48px,5.2vw,78px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.works-note-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.works-note-content h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.works-note-text{
  padding-top:8px;border-top:1px solid rgba(31,27,22,0.12)
}
.works-note-text p{
  max-width:620px;color:var(--muted);font-size:16px;line-height:1.8
}
.works-note-text p+p{
  margin-top:18px
}
.services-overview-section{
  position:relative;padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.services-overview-section::before{
  content:"";position:absolute;right:-220px;top:130px;width:440px;height:440px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(38px);pointer-events:none
}
.services-overview-wrapper{
  position:relative;z-index:2
}
.services-overview-heading{
  max-width:780px;margin-bottom:64px
}
.services-overview-heading h2{
  max-width:760px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.services-overview-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.services-overview-heading h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.services-overview-heading p{
  max-width:650px;margin-top:24px;color:var(--muted);font-size:16px;line-height:1.75
}
.services-overview-grid{
  display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(31,27,22,0.1);border-left:1px solid rgba(31,27,22,0.1)
}
.service-box{
  min-height:290px;padding:34px 30px;border-right:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1);background:rgba(255,250,242,0.38);transition:background-color var(--transition),transform var(--transition),box-shadow var(--transition)
}
.service-box:hover{
  background:rgba(255,250,242,0.86);transform:translateY(-5px);box-shadow:0 22px 55px rgba(91,70,50,0.08)
}
.service-box span{
  display:block;margin-bottom:34px;color:var(--gold);font-family:var(--font-heading);font-size:28px;line-height:1;font-weight:700
}
.service-box h3{
  margin-bottom:12px;color:var(--dark);font-family:var(--font-heading);font-size:31px;line-height:1.04;font-weight:700
}
.service-box p{
  color:var(--muted);font-size:14px;line-height:1.7
}
.clothing-section{
  position:relative;padding:125px 0;background:radial-gradient(circle at 12% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.clothing-wrapper{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:90px;align-items:start
}
.clothing-content h2{
  max-width:640px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.clothing-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.clothing-content h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.clothing-content>p{
  max-width:600px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.clothing-note{
  max-width:560px;margin-top:36px;padding:24px 26px;border:1px solid rgba(185,150,90,0.22);border-radius:24px;background:rgba(255,250,242,0.64);box-shadow:0 18px 45px rgba(91,70,50,0.07)
}
.clothing-note strong{
  display:block;margin-bottom:8px;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase
}
.clothing-note p{
  color:var(--muted);font-size:14px;line-height:1.7
}
.clothing-list{
  border-top:1px solid rgba(31,27,22,0.12)
}
.clothing-row{
  display:grid;grid-template-columns:0.9fr 1fr;gap:34px;align-items:center;padding:28px 0;border-bottom:1px solid rgba(31,27,22,0.12);transition:transform var(--transition),border-color var(--transition)
}
.clothing-row:hover{
  transform:translateX(8px);border-color:rgba(185,150,90,0.38)
}
.clothing-row span{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:clamp(34px,3.8vw,56px);line-height:0.95;font-weight:600;letter-spacing:-0.035em
}
.clothing-row small{
  display:block;color:var(--muted);font-size:14px;line-height:1.6
}
.material-quality-section{
  position:relative;padding:130px 0;background:radial-gradient(circle at 84% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.material-quality-section::before{
  content:"";position:absolute;left:-200px;bottom:80px;width:420px;height:420px;border-radius:50%;background:rgba(185,150,90,0.07);filter:blur(36px);pointer-events:none
}
.material-quality-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:0.95fr 1.05fr;gap:90px;align-items:center
}
.material-quality-visual{
  position:relative;display:flex;justify-content:center
}
.material-quality-image-wrap{
  position:relative;width:min(100%,520px);height:640px;overflow:hidden;border-radius:34px 240px 34px 34px;background:#efe0cc;box-shadow:0 34px 80px rgba(91,70,50,0.15)
}
.material-quality-image-wrap::before{
  content:"";position:absolute;inset:18px;z-index:2;border:1px solid rgba(255,250,242,0.42);border-radius:24px 220px 24px 24px;pointer-events:none
}
.material-quality-image-wrap::after{
  content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(255,250,242,0.06),rgba(30,26,21,0.24)),linear-gradient(to right,rgba(255,250,242,0.12),transparent 45%);pointer-events:none
}
.material-quality-image{
  width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 0.8s ease
}
.material-quality-image-wrap:hover .material-quality-image{
  transform:scale(1.08)
}
.material-quality-badge{
  position:absolute;left:26px;bottom:26px;z-index:3;max-width:260px;padding:16px 18px;border:1px solid rgba(255,250,242,0.42);border-radius:18px;background:rgba(255,250,242,0.82);box-shadow:0 18px 45px rgba(30,26,21,0.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.material-quality-badge span{
  display:block;margin-bottom:6px;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em
}
.material-quality-badge strong{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:24px;line-height:1.08;font-weight:700
}
.material-quality-content h2{
  max-width:680px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.material-quality-content h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.material-quality-content h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.material-quality-content>p{
  max-width:620px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.cotton-types{
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:42px
}
.cotton-type{
  padding:24px 22px;border:1px solid rgba(31,27,22,0.08);border-radius:22px;background:rgba(255,250,242,0.55);transition:transform var(--transition),background-color var(--transition),box-shadow var(--transition)
}
.cotton-type:hover{
  transform:translateY(-4px);background:rgba(255,250,242,0.9);box-shadow:0 18px 42px rgba(91,70,50,0.08)
}
.cotton-type strong{
  display:block;margin-bottom:8px;color:var(--dark);font-family:var(--font-heading);font-size:25px;line-height:1.05;font-weight:700
}
.cotton-type p{
  color:var(--muted);font-size:13px;line-height:1.65
}
.own-material-section{
  position:relative;padding:125px 0;background:radial-gradient(circle at 14% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.own-material-wrapper{
  position:relative;z-index:2
}
.own-material-header{
  max-width:900px;margin-bottom:46px
}
.own-material-header h2{
  max-width:860px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.own-material-header h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.own-material-header h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.own-material-content{
  display:grid;grid-template-columns:repeat(2,1fr);gap:54px;padding:38px 0;border-top:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1)
}
.own-material-content p{
  max-width:620px;color:var(--muted);font-size:16px;line-height:1.8
}
.own-material-rules{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px
}
.own-material-rule{
  min-height:300px;padding:32px 28px;border:1px solid rgba(185,150,90,0.18);border-radius:28px;background:rgba(255,250,242,0.58);box-shadow:0 22px 60px rgba(91,70,50,0.07);transition:transform var(--transition),background-color var(--transition),box-shadow var(--transition)
}
.own-material-rule:hover{
  transform:translateY(-6px);background:rgba(255,250,242,0.92);box-shadow:0 28px 70px rgba(91,70,50,0.1)
}
.own-material-rule span{
  display:block;margin-bottom:36px;color:var(--gold);font-family:var(--font-heading);font-size:30px;line-height:1;font-weight:700
}
.own-material-rule h3{
  margin-bottom:12px;color:var(--dark);font-family:var(--font-heading);font-size:31px;line-height:1.04;font-weight:700
}
.own-material-rule p{
  color:var(--muted);font-size:14px;line-height:1.7
}
.price-factors-section{
  position:relative;padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.price-factors-wrapper{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:90px;align-items:start
}
.price-factors-heading h2{
  max-width:640px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.price-factors-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.price-factors-heading h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.price-factors-heading p{
  max-width:580px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.price-factors-list{
  display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid rgba(31,27,22,0.1);border-left:1px solid rgba(31,27,22,0.1)
}
.price-factor{
  min-height:110px;padding:24px 22px;display:flex;align-items:center;border-right:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1);background:rgba(255,250,242,0.38);color:var(--dark);font-family:var(--font-heading);font-size:27px;line-height:1.06;font-weight:700;transition:background-color var(--transition),color var(--transition),transform var(--transition)
}
.price-factor:hover{
  background:rgba(255,250,242,0.9);color:var(--brown);transform:translateY(-4px)
}
.services-process-section{
  position:relative;padding:125px 0;background:radial-gradient(circle at 86% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%);overflow:hidden
}
.services-process-wrapper{
  position:relative;z-index:2
}
.services-process-heading{
  max-width:820px;margin-bottom:62px
}
.services-process-heading h2{
  max-width:720px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.services-process-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.services-process-heading h2 span::after{
  content:"";position:absolute;left:7%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.services-process-heading p{
  max-width:620px;margin-top:24px;color:var(--muted);font-size:16px;line-height:1.75
}
.services-process-list{
  display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(31,27,22,0.1);border-left:1px solid rgba(31,27,22,0.1)
}
.services-process-step{
  min-height:330px;padding:30px 24px;border-right:1px solid rgba(31,27,22,0.1);border-bottom:1px solid rgba(31,27,22,0.1);background:rgba(255,250,242,0.42);transition:transform var(--transition),background-color var(--transition),box-shadow var(--transition)
}
.services-process-step:hover{
  transform:translateY(-6px);background:rgba(255,250,242,0.9);box-shadow:0 22px 55px rgba(91,70,50,0.08)
}
.services-process-step span{
  display:block;margin-bottom:34px;color:var(--gold);font-family:var(--font-heading);font-size:30px;line-height:1;font-weight:700
}
.services-process-step h3{
  margin-bottom:12px;color:var(--dark);font-family:var(--font-heading);font-size:28px;line-height:1.05;font-weight:700
}
.services-process-step p{
  color:var(--muted);font-size:13px;line-height:1.68
}
.services-faq-section{
  position:relative;padding:120px 0;background:linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.services-faq-wrapper{
  display:grid;grid-template-columns:0.9fr 1.1fr;gap:90px;align-items:start
}
.services-faq-heading{
  position:sticky;top:110px
}
.services-faq-heading h2{
  max-width:580px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.services-faq-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.services-faq-heading h2 span::after{
  content:"";position:absolute;left:7%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.services-faq-list{
  border-top:1px solid rgba(31,27,22,0.12)
}
.faq-item{
  border-bottom:1px solid rgba(31,27,22,0.12)
}
.faq-item summary{
  position:relative;list-style:none;cursor:pointer;padding:28px 46px 28px 0;color:var(--dark);font-family:var(--font-heading);font-size:30px;line-height:1.1;font-weight:700;transition:color var(--transition)
}
.faq-item summary::-webkit-details-marker{
  display:none
}
.faq-item summary::after{
  content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--gold);font-family:var(--font-body);font-size:30px;font-weight:400;line-height:1;transition:transform var(--transition)
}
.faq-item[open] summary{
  color:var(--brown)
}
.faq-item[open] summary::after{
  transform:translateY(-50%) rotate(45deg)
}
.faq-item p{
  max-width:720px;padding:0 46px 28px 0;color:var(--muted);font-size:15px;line-height:1.78
}
.contact-section{
  position:relative;padding:120px 0;background:radial-gradient(circle at 14% 18%,rgba(185,150,90,0.08),transparent 28%),linear-gradient(180deg,#fffaf2 0%,#f8f1e7 100%);overflow:hidden
}
.contact-wrapper{
  position:relative;z-index:2;display:grid;grid-template-columns:0.9fr 1.1fr;gap:90px;align-items:start
}
.contact-info h2{
  max-width:620px;font-family:var(--font-heading);font-size:clamp(50px,5.5vw,82px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.contact-info h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.contact-info h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.contact-info>p{
  max-width:560px;margin-top:26px;color:var(--muted);font-size:16px;line-height:1.78
}
.contact-links{
  display:grid;gap:14px;max-width:520px;margin-top:42px
}
.contact-link{
  display:block;padding:22px 24px;border:1px solid rgba(31,27,22,0.1);border-radius:22px;background:rgba(255,250,242,0.58);transition:transform var(--transition),background-color var(--transition),box-shadow var(--transition),border-color var(--transition)
}
.contact-link:hover{
  transform:translateX(6px);background:rgba(255,250,242,0.92);border-color:rgba(185,150,90,0.28);box-shadow:0 18px 45px rgba(91,70,50,0.08)
}
.contact-link span{
  display:block;margin-bottom:6px;color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.13em
}
.contact-link strong{
  display:block;color:var(--dark);font-family:var(--font-heading);font-size:28px;line-height:1.05;font-weight:700
}
.contact-form-wrap{
  padding:38px;border:1px solid rgba(31,27,22,0.08);border-radius:34px;background:rgba(255,250,242,0.72);box-shadow:0 30px 80px rgba(91,70,50,0.1)
}
.contact-form{
  display:grid;gap:20px
}
.form-row{
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px
}
.form-group{
  display:grid;gap:9px
}
.form-group label{
  color:var(--dark);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em
}
.form-group input,.form-group select,.form-group textarea{
  width:100%;padding:15px 16px;border:1px solid rgba(31,27,22,0.12);border-radius:16px;outline:none;background:rgba(255,250,242,0.86);color:var(--dark);font-family:var(--font-body);font-size:14px;transition:border-color var(--transition),box-shadow var(--transition),background-color var(--transition)
}
.form-group textarea{
  resize:vertical;min-height:150px
}
.form-group input::placeholder,.form-group textarea::placeholder{
  color:rgba(88,74,57,0.55)
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
  border-color:rgba(185,150,90,0.58);background:#fffaf2;box-shadow:0 0 0 4px rgba(185,150,90,0.1)
}
.contact-form .btn{
  margin-top:8px;justify-self:start;border:none;cursor:pointer
}
.contact-note-section{
  position:relative;padding:110px 0;background:linear-gradient(180deg,#f8f1e7 0%,#fffaf2 100%)
}
.contact-note-wrapper{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:80px;align-items:start
}
.contact-note-heading h2{
  max-width:620px;font-family:var(--font-heading);font-size:clamp(46px,5.2vw,76px);line-height:0.96;font-weight:600;letter-spacing:-0.04em;color:var(--dark)
}
.contact-note-heading h2 span{
  position:relative;display:inline-block;color:var(--brown);font-style:italic
}
.contact-note-heading h2 span::after{
  content:"";position:absolute;left:6%;bottom:2px;width:68%;height:8px;border-bottom:3px solid var(--gold);border-radius:50%;transform:rotate(-2deg);pointer-events:none
}
.contact-note-list{
  border-top:1px solid rgba(31,27,22,0.12)
}
.contact-note-item{
  display:grid;grid-template-columns:70px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid rgba(31,27,22,0.12)
}
.contact-note-item span{
  color:var(--gold);font-family:var(--font-heading);font-size:30px;line-height:1;font-weight:700
}
.contact-note-item p{
  max-width:620px;color:var(--muted);font-size:16px;line-height:1.75
}
@media (max-width:1050px){
  .navbar{
    width:min(100% - 40px,1280px)
  }
  .nav-menu{
    gap:22px
  }
  .nav-menu a{
    font-size:10px
  }
  .hero-wrapper{
    gap:44px
  }
  .thread-left{
    width:900px;left:-330px
  }
  .thread-right{
    width:1200px;right:-520px
  }
  .detail-wrapper{
    gap:60px
  }
  .detail-image-wrap{
    height:540px
  }
  .service-row{
    grid-template-columns:70px 1fr 140px 44px;gap:22px
  }
  .service-image{
    width:135px;height:82px
  }
  .material-wrapper{
    gap:60px
  }
  .material-image-frame{
    height:580px
  }
  .material-points{
    grid-template-columns:1fr
  }
  .material-point{
    min-height:auto
  }
  .process-timeline{
    gap:22px
  }
  .process-step h3{
    font-size:27px
  }
  .work-grid{
    grid-template-rows:repeat(3,170px)
  }
  .footer-wrapper{
    gap:46px
  }
  .story-wrapper{
    gap:60px
  }
  .values-grid{
    grid-template-columns:repeat(2,1fr)
  }
  .experience-wrapper{
    gap:60px
  }
  .experience-image-wrap{
    height:560px
  }
  .works-card{
    height:380px
  }
  .works-note-wrapper{
    gap:60px
  }
  .services-overview-grid{
    grid-template-columns:repeat(2,1fr)
  }
  .clothing-wrapper,.material-quality-wrapper,.price-factors-wrapper,.services-faq-wrapper{
    gap:60px
  }
  .material-quality-image-wrap{
    height:560px
  }
  .own-material-rules{
    gap:18px
  }
  .own-material-rule{
    padding:28px 24px
  }
  .contact-wrapper,.contact-note-wrapper{
    gap:60px
  }
}
@media (max-width:920px){
  .navbar{
    width:min(100% - 28px,1280px);height:66px
  }
  .logo{
    position:static;transform:none;font-size:24px
  }
  .nav-toggle{
    display:block
  }
  .nav-cta,.nav-contact{
    display:none
  }
  .nav-menu{
    position:absolute;top:76px;left:0;right:0;display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:24px;border-radius:22px;background:rgba(255,250,242,0.98);border:1px solid rgba(31,27,22,0.1);box-shadow:0 20px 50px rgba(91,70,50,0.12);opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity var(--transition),visibility var(--transition),transform var(--transition)
  }
  .nav-menu.active{
    opacity:1;visibility:visible;transform:translateY(0)
  }
  .nav-menu a{
    font-size:13px;padding:6px 0
  }
  .nav-menu a::after{
    bottom:-3px
  }
  .hero{
    min-height:auto;padding:118px 0 70px
  }
  .hero-wrapper{
    grid-template-columns:1fr;gap:42px
  }
  .hero-content{
    max-width:100%;text-align:center
  }
  .hero h1,.hero-text{
    margin-inline:auto
  }
  .hero-actions,.hero-stats{
    justify-content:center
  }
  .hero-visual{
    min-height:480px
  }
  .hero-product{
    width:min(92%,500px)
  }
  .card-one{
    top:42px;left:6%
  }
  .card-two{
    right:6%;bottom:42px
  }
  .thread-left{
    width:820px;left:-420px;top:70px;opacity:0.42
  }
  .thread-right{
    width:900px;right:-480px;top:300px;opacity:0.36
  }
  .glow-one{
    right:-220px;top:350px;opacity:0.42
  }
  .glow-two{
    display:none
  }
  .detail-section{
    padding:90px 0
  }
  .detail-wrapper{
    grid-template-columns:1fr;gap:56px
  }
  .detail-content{
    max-width:100%;text-align:center
  }
  .detail-content h2,.detail-text{
    margin-inline:auto
  }
  .detail-list{
    max-width:620px;margin-inline:auto;margin-top:40px;text-align:left
  }
  .detail-visual{
    min-height:560px
  }
  .detail-arch{
    right:50%;transform:translateX(50%);width:430px;height:520px
  }
  .detail-image-wrap{
    width:min(100%,430px);height:520px
  }
  .services-preview-section{
    padding:90px 0
  }
  .services-preview-heading{
    max-width:100%;margin-bottom:52px;text-align:center
  }
  .services-preview-heading h2,.services-preview-heading p{
    margin-inline:auto
  }
  .service-row{
    min-height:auto;padding:28px 0;grid-template-columns:56px 1fr 44px
  }
  .service-row:hover{
    padding-inline:0
  }
  .service-image{
    display:none
  }
  .service-info h3{
    font-size:clamp(32px,7vw,46px)
  }
  .material-section{
    padding:90px 0
  }
  .material-wrapper{
    grid-template-columns:1fr;gap:56px
  }
  .material-visual{
    order:2
  }
  .material-content{
    order:1;max-width:100%;text-align:center
  }
  .material-content h2,.material-text{
    margin-inline:auto
  }
  .material-points{
    max-width:620px;margin-inline:auto;margin-top:40px;text-align:left
  }
  .material-image-frame{
    width:min(100%,520px);height:560px;margin-inline:auto;border-radius:260px 260px 32px 32px
  }
  .material-image-frame::before{
    border-radius:230px 230px 24px 24px
  }
  .process-section{
    padding:90px 0
  }
  .process-heading{
    max-width:100%;margin-bottom:60px;text-align:center
  }
  .process-heading h2,.process-heading p{
    margin-inline:auto
  }
  .process-timeline{
    max-width:680px;margin-inline:auto;display:grid;grid-template-columns:1fr;gap:0
  }
  .process-line{
    top:0;bottom:0;left:24px;right:auto;width:1px;height:auto;background:linear-gradient( 180deg,rgba(185,150,90,0.08),rgba(185,150,90,0.46),rgba(185,150,90,0.08) )
  }
  .process-step{
    min-height:auto;padding:0 0 42px 72px
  }
  .process-number{
    margin-bottom:10px;font-size:34px
  }
  .process-dot{
    top:8px;left:17px
  }
  .process-step h3{
    max-width:100%;margin-top:0;font-size:30px
  }
  .process-step p{
    max-width:520px
  }
  .work-preview-section,.final-cta-section{
    padding:90px 0
  }
  .work-preview-heading{
    max-width:100%;margin-bottom:52px;text-align:center
  }
  .work-preview-heading h2,.work-preview-heading p{
    margin-inline:auto
  }
  .work-grid{
    grid-template-columns:1fr;grid-template-rows:none
  }
  .work-card,.work-card-large{
    height:360px;grid-row:auto;border-radius:28px
  }
  .work-preview-action{
    justify-content:center
  }
  .final-cta-wrapper{
    padding:72px 28px;border-radius:34px
  }
  .final-thread{
    width:760px;top:12%
  }
  .footer-wrapper{
    grid-template-columns:1fr 1fr;gap:42px
  }
  .footer-brand{
    grid-column:1 / -1
  }
  .about-hero{
    padding:140px 0 90px
  }
  .story-section,.values-section{
    padding:90px 0
  }
  .story-wrapper{
    grid-template-columns:1fr;gap:52px
  }
  .story-content,.values-heading{
    text-align:center;margin-inline:auto
  }
  .story-content h2,.story-content p,.values-heading h2{
    margin-inline:auto
  }
  .story-note{
    max-width:620px;margin-inline:auto;border-radius:34px
  }
  .values-heading{
    max-width:100%;margin-bottom:52px
  }
  .experience-section{
    padding:90px 0
  }
  .experience-wrapper{
    grid-template-columns:1fr;gap:56px
  }
  .experience-content{
    max-width:100%;text-align:center
  }
  .experience-content h2,.experience-text{
    margin-inline:auto
  }
  .experience-points{
    max-width:620px;margin-inline:auto;margin-top:34px;text-align:left
  }
  .experience-image-wrap{
    width:min(100%,500px);height:560px;margin-inline:auto;border-radius:260px 260px 32px 32px
  }
  .experience-image-wrap::before{
    border-radius:230px 230px 24px 24px
  }
  .works-hero{
    padding:140px 0 90px
  }
  .works-gallery-section,.works-note-section{
    padding:90px 0
  }
  .works-gallery-heading{
    max-width:100%;margin-bottom:48px;text-align:center
  }
  .works-gallery-heading h2,.works-gallery-heading p{
    margin-inline:auto
  }
  .works-grid{
    grid-template-columns:repeat(2,1fr)
  }
  .works-card{
    height:360px
  }
  .works-card:nth-child(2),.works-card:nth-child(5){
    transform:none
  }
  .works-note-wrapper{
    grid-template-columns:1fr;gap:40px;text-align:center
  }
  .works-note-content h2,.works-note-text p{
    margin-inline:auto
  }
  .works-note-text{
    max-width:680px;margin-inline:auto
  }
  .services-hero{
    padding:140px 0 90px
  }
  .services-overview-section,.clothing-section,.material-quality-section,.own-material-section,.price-factors-section,.services-process-section,.services-faq-section{
    padding:90px 0
  }
  .services-overview-heading,.services-process-heading,.own-material-header{
    max-width:100%;text-align:center;margin-inline:auto
  }
  .services-overview-heading h2,.services-overview-heading p,.services-process-heading h2,.services-process-heading p,.own-material-header h2{
    margin-inline:auto
  }
  .clothing-wrapper,.material-quality-wrapper,.price-factors-wrapper,.services-faq-wrapper{
    grid-template-columns:1fr;gap:54px
  }
  .clothing-content,.material-quality-content,.price-factors-heading,.services-faq-heading{
    text-align:center
  }
  .clothing-content h2,.clothing-content>p,.clothing-note,.material-quality-content h2,.material-quality-content>p,.price-factors-heading h2,.price-factors-heading p,.services-faq-heading h2{
    margin-inline:auto
  }
  .clothing-list,.price-factors-list,.services-faq-list{
    max-width:760px;margin-inline:auto
  }
  .material-quality-visual{
    order:2
  }
  .material-quality-content{
    order:1
  }
  .material-quality-image-wrap{
    width:min(100%,500px);height:560px;margin-inline:auto;border-radius:260px 260px 32px 32px
  }
  .material-quality-image-wrap::before{
    border-radius:230px 230px 24px 24px
  }
  .own-material-content{
    grid-template-columns:1fr;gap:20px;max-width:760px;margin-inline:auto;text-align:center
  }
  .own-material-content p{
    margin-inline:auto
  }
  .own-material-rules{
    grid-template-columns:1fr;max-width:720px;margin-inline:auto;margin-top:40px
  }
  .own-material-rule{
    min-height:auto
  }
  .services-faq-heading{
    position:static
  }
  .contact-hero{
    padding:140px 0 90px
  }
  .contact-section,.contact-note-section{
    padding:90px 0
  }
  .contact-wrapper,.contact-note-wrapper{
    grid-template-columns:1fr;gap:52px
  }
  .contact-info,.contact-note-heading{
    text-align:center
  }
  .contact-info h2,.contact-info>p,.contact-links,.contact-note-heading h2{
    margin-inline:auto
  }
  .contact-form-wrap{
    max-width:720px;margin-inline:auto
  }
  .contact-note-list{
    max-width:720px;margin-inline:auto
  }
}
@media (max-width:620px){
  .container{
    width:min(100% - 28px,var(--container))
  }
  .navbar{
    height:60px
  }
  .logo{
    font-size:23px
  }
  .nav-toggle{
    width:40px;height:40px
  }
  .nav-menu{
    top:70px;padding:22px;border-radius:20px
  }
  .hero{
    padding:108px 0 56px
  }
  .eyebrow{
    margin-bottom:16px;font-size:11px;letter-spacing:0.14em
  }
  .hero h1{
    font-size:clamp(46px,14vw,68px);line-height:0.95
  }
  .highlight-text::after{
    bottom:4px;width:62%;height:7px
  }
  .hero-text{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .hero-actions{
    margin-top:30px;gap:12px
  }
  .btn{
    width:100%;min-height:52px
  }
  .hero-stats{
    margin-top:40px;gap:22px
  }
  .hero-stats div:not(:last-child)::after{
    display:none
  }
  .hero-stats strong{
    font-size:24px
  }
  .hero-stats span{
    font-size:12px
  }
  .hero-visual{
    min-height:390px
  }
  .hero-product{
    width:95%
  }
  .floating-card{
    min-width:132px;padding:12px 14px;border-radius:15px
  }
  .floating-card span{
    font-size:10px
  }
  .floating-card strong{
    font-size:17px
  }
  .card-one{
    top:20px;left:0
  }
  .card-two{
    right:0;bottom:20px
  }
  .paper-texture{
    opacity:0.32
  }
  .thread-left,.thread-right{
    opacity:0.24
  }
  .soft-glow{
    filter:blur(42px)
  }
  .detail-section{
    padding:72px 0
  }
  .detail-content h2{
    font-size:clamp(44px,12vw,62px)
  }
  .detail-text{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .detail-list{
    margin-top:34px
  }
  .detail-item{
    grid-template-columns:48px 1fr;gap:16px;padding:22px 0
  }
  .detail-item>span{
    font-size:22px
  }
  .detail-item h3{
    font-size:25px
  }
  .detail-item p{
    font-size:13px
  }
  .detail-visual{
    min-height:470px
  }
  .detail-arch{
    width:310px;height:395px;opacity:0.7
  }
  .detail-image-wrap{
    width:min(100%,330px);height:430px;border-radius:180px 180px 26px 26px
  }
  .detail-floating-label{
    left:18px;bottom:18px;min-width:165px;padding:14px 15px
  }
  .detail-floating-label strong{
    font-size:22px
  }
  .services-preview-section{
    padding:72px 0
  }
  .services-preview-heading{
    margin-bottom:42px
  }
  .services-preview-heading h2{
    font-size:clamp(44px,12vw,62px)
  }
  .services-preview-heading p{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .service-row{
    grid-template-columns:1fr 42px;gap:16px;padding:26px 0
  }
  .service-number{
    grid-column:1 / -1;font-size:22px
  }
  .service-info h3{
    margin-bottom:7px;font-size:34px
  }
  .service-info p{
    font-size:13px
  }
  .service-arrow{
    width:40px;height:40px;font-size:18px
  }
  .material-section{
    padding:72px 0
  }
  .material-content h2{
    font-size:clamp(42px,12vw,60px)
  }
  .material-text{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .material-points{
    margin-top:34px
  }
  .material-point{
    padding:22px 20px
  }
  .material-point>span{
    margin-bottom:18px;font-size:21px
  }
  .material-point h3{
    font-size:24px
  }
  .material-point p{
    font-size:13px
  }
  .material-image-frame{
    height:430px;border-radius:190px 190px 26px 26px
  }
  .material-image-frame::before{
    inset:14px;border-radius:170px 170px 20px 20px
  }
  .material-floating-label{
    left:18px;bottom:18px;max-width:230px;padding:14px 15px
  }
  .material-floating-label strong{
    font-size:21px
  }
  .process-section{
    padding:72px 0
  }
  .process-heading{
    margin-bottom:48px
  }
  .process-heading h2{
    font-size:clamp(42px,12vw,60px)
  }
  .process-heading p{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .process-step{
    padding-left:58px;padding-bottom:38px
  }
  .process-line{
    left:18px
  }
  .process-dot{
    left:11px
  }
  .process-number{
    font-size:29px
  }
  .process-step h3{
    font-size:26px
  }
  .process-step p{
    font-size:13px
  }
  .work-preview-section,.final-cta-section{
    padding:72px 0
  }
  .work-preview-heading{
    margin-bottom:42px
  }
  .work-preview-heading h2,.final-cta-wrapper h2{
    font-size:clamp(42px,12vw,62px)
  }
  .work-preview-heading p,.final-cta-wrapper p{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .work-card,.work-card-large{
    height:300px;border-radius:24px
  }
  .work-card-content{
    left:18px;right:18px;bottom:18px
  }
  .work-card-content h3,.work-card-large .work-card-content h3{
    font-size:28px
  }
  .final-cta-wrapper{
    padding:58px 22px;border-radius:28px
  }
  .final-cta-actions{
    margin-top:32px
  }
  .final-thread{
    width:620px;opacity:0.28
  }
  .site-footer{
    padding-top:60px
  }
  .footer-wrapper{
    grid-template-columns:1fr;gap:34px;padding-bottom:42px
  }
  .footer-bottom{
    flex-direction:column;align-items:flex-start;gap:12px
  }
  .experience-section{
    padding:72px 0
  }
  .experience-content h2{
    font-size:clamp(42px,12vw,60px)
  }
  .experience-text{
    margin-top:22px;font-size:15px;line-height:1.65
  }
  .experience-point{
    padding:18px 0
  }
  .experience-point strong{
    font-size:24px
  }
  .experience-point p{
    font-size:13px;line-height:1.65
  }
  .experience-image-wrap{
    height:430px;border-radius:190px 190px 26px 26px
  }
  .experience-image-wrap::before{
    inset:14px;border-radius:170px 170px 20px 20px
  }
  .experience-badge{
    left:18px;bottom:18px;max-width:230px;padding:14px 15px
  }
  .experience-badge strong{
    font-size:20px
  }
  .works-hero{
    padding:120px 0 72px
  }
  .works-hero h1,.works-note-content h2{
    font-size:clamp(42px,12vw,62px)
  }
  .works-hero p,.works-gallery-heading p,.works-note-text p{
    font-size:15px;line-height:1.65
  }
  .works-gallery-section,.works-note-section{
    padding:72px 0
  }
  .works-grid{
    grid-template-columns:1fr;gap:18px
  }
  .works-card{
    height:330px;border-radius:24px
  }
  .works-card-content{
    left:18px;right:18px;bottom:18px
  }
  .works-card-content h3{
    font-size:27px
  }
  .services-hero{
    padding:120px 0 72px
  }
  .services-hero h1,.services-overview-heading h2,.clothing-content h2,.material-quality-content h2,.own-material-header h2,.price-factors-heading h2,.services-process-heading h2,.services-faq-heading h2{
    font-size:clamp(42px,12vw,62px)
  }
  .services-hero p,.services-overview-heading p,.clothing-content>p,.material-quality-content>p,.own-material-content p,.price-factors-heading p,.services-process-heading p,.faq-item p{
    font-size:15px;line-height:1.65
  }
  .services-overview-section,.clothing-section,.material-quality-section,.own-material-section,.price-factors-section,.services-process-section,.services-faq-section{
    padding:72px 0
  }
  .services-hero-actions{
    flex-direction:column;align-items:stretch;max-width:320px;margin-inline:auto
  }
  .service-box{
    min-height:auto;padding:28px 24px
  }
  .service-box span,.own-material-rule span,.services-process-step span{
    margin-bottom:24px;font-size:25px
  }
  .service-box h3,.own-material-rule h3,.services-process-step h3{
    font-size:27px
  }
  .clothing-row{
    grid-template-columns:1fr;gap:8px;padding:24px 0
  }
  .clothing-row:hover{
    transform:none
  }
  .clothing-row span{
    font-size:clamp(34px,11vw,48px)
  }
  .clothing-note{
    padding:22px 20px
  }
  .material-quality-image-wrap{
    height:430px;border-radius:190px 190px 26px 26px
  }
  .material-quality-image-wrap::before{
    inset:14px;border-radius:170px 170px 20px 20px
  }
  .material-quality-badge{
    left:18px;bottom:18px;max-width:230px;padding:14px 15px
  }
  .material-quality-badge strong{
    font-size:20px
  }
  .cotton-type{
    padding:22px 20px
  }
  .cotton-type strong{
    font-size:24px
  }
  .own-material-content{
    padding:28px 0
  }
  .own-material-rule{
    padding:26px 22px;border-radius:24px
  }
  .price-factor{
    min-height:auto;padding:22px 20px;font-size:25px
  }
  .services-process-step{
    padding:26px 22px
  }
  .faq-item summary{
    padding:24px 42px 24px 0;font-size:26px
  }
  .faq-item p{
    padding:0 42px 24px 0
  }
  .contact-hero{
    padding:120px 0 72px
  }
  .contact-hero h1,.contact-info h2,.contact-note-heading h2{
    font-size:clamp(42px,12vw,62px)
  }
  .contact-hero p,.contact-info>p,.contact-note-item p{
    font-size:15px;line-height:1.65
  }
  .contact-section,.contact-note-section{
    padding:72px 0
  }
  .form-row{
    grid-template-columns:1fr
  }
  .contact-form-wrap{
    padding:26px 22px;border-radius:26px
  }
  .contact-link{
    padding:20px
  }
  .contact-link strong{
    font-size:24px
  }
  .contact-form .btn{
    width:100%;justify-content:center
  }
  .contact-note-item{
    grid-template-columns:48px 1fr;gap:16px;padding:24px 0
  }
  .contact-note-item span{
    font-size:24px
  }
}
@media (max-width:420px){
  .container{
    width:min(100% - 24px,var(--container))
  }
  .hero h1{
    font-size:44px
  }
  .hero-text{
    font-size:14px
  }
  .hero-stats{
    flex-direction:column;align-items:center;gap:16px
  }
  .hero-visual{
    min-height:340px
  }
  .floating-card{
    display:none
  }
  .thread-left,.thread-right{
    opacity:0.18
  }
  .detail-image-wrap{
    width:100%;height:400px
  }
  .detail-arch{
    width:280px;height:360px
  }
  .detail-floating-label{
    max-width:calc(100% - 36px)
  }
  .material-image-frame{
    height:390px
  }
  .material-floating-label{
    max-width:calc(100% - 36px)
  }
  .work-card,.work-card-large{
    height:270px
  }
  .work-card-content h3,.work-card-large .work-card-content h3{
    font-size:25px
  }
  .final-cta-wrapper{
    padding-inline:18px
  }
  .about-hero{
    padding:120px 0 72px
  }
  .about-hero h1,.story-content h2,.values-heading h2{
    font-size:clamp(42px,12vw,62px)
  }
  .about-hero p,.story-content p{
    font-size:15px;line-height:1.65
  }
  .story-section,.values-section{
    padding:72px 0
  }
  .story-note{
    padding:38px 28px
  }
  .story-note strong{
    font-size:34px
  }
  .values-grid{
    grid-template-columns:1fr
  }
  .value-box{
    min-height:auto;padding:26px 22px
  }
  .experience-image-wrap{
    height:390px
  }
  .experience-badge{
    max-width:calc(100% - 36px)
  }
  .works-card{
    height:290px
  }
  .works-card-content h3{
    font-size:24px
  }
  .material-quality-image-wrap{
    height:390px
  }
  .material-quality-badge{
    max-width:calc(100% - 36px)
  }
  .faq-item summary{
    font-size:24px
  }
}