/* =========================================================
   REDESIGN v2
   - Products page      : "the Shop" style (big product, soft shadow, thin type)
   - About page         : Vision/Mission circle cards + facility / materials / why-us
   New prefixes only (ps-, vc-, fx-, mtr-, wx-, th-) so older CSS can't interfere.
   ========================================================= */
:root{
  --rd-red:#d5020d;--rd-steel:#26343d;--rd-ink:#3a3a3a;--rd-mute:#8a8a8a;--rd-line:#e3e6e9;
  --rd-f:"Montserrat","Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}

body{
              font-family: var(--serif, "Poppins", system-ui, Arial, sans-serif);

}

/* shared "the / Name." heading */
.th{line-height:1.02;letter-spacing:.05em;font-weight:600}
.th small{display:block;font-weight:400;font-size:clamp(1.05rem,1.6vw,1.45rem);line-height:1.1;letter-spacing:.05em;color:#6b6b6b;margin-bottom:4px}
.th-big{font-size:clamp(2rem,4.2vw,3.2rem)}

/* =========================================================
   PRODUCTS
   ========================================================= */
.ps{background:#fff;}
.ps-anchor{display:block;height:0}
.ps article.prod.ps-p{display:block;grid-template-columns:none;gap:0;border:0;align-items:normal;scroll-margin-top:0;background:#fff;padding:clamp(48px,7vw,100px) 0;overflow:hidden}
.ps article.prod.ps-p[data-tone="a"]{background:#fafafa}
.ps-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center}
.ps-p.is-first .ps-in{grid-template-columns:minmax(0,.62fr) minmax(0,1.15fr) minmax(0,1fr);align-items:start}
.ps-p.is-first .ps-img,.ps-p.is-first .ps-tx{margin-top:clamp(0px,3vw,36px)}
.ps-p[data-side="r"] .ps-img{order:2}

/* sidebar (first band only) */
.ps-title{font-weight:600;letter-spacing:.05em;color:var(--rd-ink);font-size:clamp(1.9rem,3vw,2.5rem);line-height:1.02;margin:0}
.ps-title small{display:block;font-weight:400;font-size:1.15rem;line-height:1.2;color:#6b6b6b;margin-bottom:4px}
.ps-side nav{margin-top:26px;font-size:.82rem;line-height:1.5}
.ps-side a{text-decoration:none;color:#6b6b6b;transition:color .2s}
.ps-side a:hover,.ps-side a:focus-visible{color:var(--rd-red)}
.ps-nc{display:block;margin-top:12px;color:var(--rd-ink)!important;font-weight:600;letter-spacing:.02em}
.ps-side ul{list-style:none;margin:3px 0 0;padding:0}
.ps-side li{padding:3px 0 3px 22px;position:relative;color:#8a8a8a;font-weight:400}
.ps-side li::before{content:"";position:absolute;left:0;top:50%;width:12px;height:1px;background:#9a9a9a}

/* image on a soft stage with a floor shadow */
.ps-img{min-width:0}
.ps-stage{position:relative;max-width:560px;margin:0 auto;padding-bottom:30px;isolation:isolate}
.ps-stage::before{content:"";position:absolute;z-index:-1;top:-34px;bottom:10px;left:-44px;right:-44px;
  background:linear-gradient(90deg,rgba(0,0,0,.055),rgba(0,0,0,0) 90%)}
.ps-p[data-side="r"] .ps-stage::before{background:linear-gradient(270deg,rgba(0,0,0,.055),rgba(0,0,0,0) 90%)}
.ps-stage::after{content:"";position:absolute;left:8%;right:8%;bottom:0;height:26px;
  background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.34),rgba(0,0,0,0) 68%);filter:blur(5px)}
.ps-stage img,.ps-stage svg{display:block;width:100%;aspect-ratio:4/3;height:auto;object-fit:cover;background:#e9edf0;border-radius:4px}
.ps-stage img{box-shadow:0 22px 40px -26px rgba(0,0,0,.45)}

/* text */
.ps-tx{min-width:0}
.ps-tx .th small{margin-bottom:2px}
.ps-tx h2{font-weight:600;color:var(--rd-ink);letter-spacing:.05em;line-height:1.08;font-size:clamp(1.9rem,3.2vw,2.9rem);margin:0 0 14px}
.ps-the{display:block;font-weight:400;font-size:1.1rem;line-height:1.2;color:#6b6b6b;letter-spacing:.05em;margin-bottom:4px}
.ps-tx.is-long h2{font-size:clamp(1.45rem,2.3vw,2.05rem);letter-spacing:.03em;line-height:1.18}
.ps-cat{display:flex;align-items:center;gap:10px;font-weight:500;font-size:.7rem;line-height:1;letter-spacing:.28em;text-transform:uppercase;color:#8d8d8d;margin-bottom:12px}
.ps-cat::after{content:"";width:16px;height:1px;background:#8d8d8d}
.ps-lede{position:relative;padding-left:26px;margin:0 0 16px;font-weight:300;font-size:1rem;line-height:1.7;color:#555;max-width:56ch}
.ps-lede::before{content:"";position:absolute;left:0;top:.85em;width:14px;height:1px;background:#8d8d8d}
.ps-t{list-style:none;margin:0 0 26px;padding:0;max-width:58ch;display:grid;gap:9px}
.ps-t li{position:relative;padding-left:26px;font-weight:300;font-size:.9rem;line-height:1.65;color:#6a6a6a}
.ps-t li::before{content:"";position:absolute;left:0;top:.85em;width:14px;height:1px;background:var(--rd-red)}
.ps-t strong{font-weight:600;color:#444}

.ps-btn{display:inline-flex;align-items:center;gap:14px;height:42px;padding:0 6px 0 22px;border-radius:6px;background:#434343;color:#fff;text-decoration:none;
  font-weight:700;font-size:.66rem;line-height:1;letter-spacing:.24em;text-transform:uppercase;box-shadow:0 10px 20px -10px rgba(0,0,0,.55);transition:background .25s}
.ps-btn i{width:30px;height:30px;border:1.5px solid #fff;border-radius:5px;display:grid;place-items:center}
.ps-btn svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ps-btn:hover,.ps-btn:focus-visible{background:var(--rd-red)}
.ps-btn:focus-visible,.ps-oc:focus-visible{outline:2px solid var(--rd-red);outline-offset:3px}

/* "the Range." strip (like "the Others.") */
.ps-others{background:#fff;padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,110px)}
.ps-oh{margin-bottom:clamp(26px,4vw,48px)}
.ps-sub{position:relative;margin:14px 0 0;padding-left:30px;font-weight:300;font-size:1.1rem;line-height:1.4;letter-spacing:.04em;color:#777}
.ps-sub::before{content:"";position:absolute;left:0;top:.7em;width:16px;height:1px;background:#8d8d8d}
.ps-og{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.ps-oc{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:190px;padding:18px 0 18px 20px;text-decoration:none;color:var(--rd-ink);overflow:hidden;
  background:linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,0) 85%)}
.ps-ot{display:block;min-width:0}
.ps-ot small{display:block;font-weight:400;font-size:1rem;line-height:1.1;color:#6b6b6b;margin-bottom:3px}
.ps-ot b{display:block;font-weight:600;font-size:1.15rem;line-height:1.2;letter-spacing:.04em}
.ps-ot i{display:block;margin-top:10px;font-weight:300;font-size:.85rem;font-style:normal;color:#777}
.ps-oc img{flex:none;width:46%;height:150px;object-fit:cover;border-radius:3px 0 0 3px;box-shadow:0 16px 26px -18px rgba(0,0,0,.5);transition:transform .6s}
.ps-oc:hover img{transform:scale(1.04)}

@media(max-width:1000px){
  .ps-p.is-first .ps-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ps-side{grid-column:1/-1}
  .ps-side nav{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:6px 34px}
  .ps-side ul{display:none}
  .ps-nc{margin-top:0}
  .ps-og{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .ps-in,.ps-p.is-first .ps-in{grid-template-columns:1fr}
  .ps-p[data-side="r"] .ps-img{order:0}
  .ps-p.is-first .ps-img,.ps-p.is-first .ps-tx{margin-top:0}
  .ps-side nav{grid-template-columns:repeat(2,auto)}
  .ps-stage::before{left:-22px;right:-22px}
}
@media(max-width:520px){.ps-og{grid-template-columns:1fr}}

/* =========================================================
   ABOUT : VISION & MISSION  (circle card on a photo, like the reference)
   ========================================================= */
.vc{background:#fff;padding:clamp(48px,7vw,96px) 0;}
.vc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,32px)}
.vc-tile{position:relative;aspect-ratio:1/1;overflow:hidden;background:#cdc4b8;isolation:isolate}
.vc-tile>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.vc-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(255,250,240,.10),rgba(30,26,22,.22))}
.vc-site{position:absolute;top:5.2%;left:0;right:0;text-align:center;color:#fff;font-weight:500;font-size:clamp(.68rem,1.15vw,.92rem);line-height:1;letter-spacing:.16em;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.vc-frame{position:absolute;left:16.5%;right:16.5%;top:26%;bottom:4.5%;border:2px solid rgba(255,255,255,.7);border-top:0;border-radius:0 0 999px 999px}
.vc-circle{position:absolute;left:18.2%;top:15%;width:63.6%;aspect-ratio:1/1;border-radius:50%;background:#fffaf3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:9% 9.5%;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}
.vc-circle h2{font-weight:700;font-size:clamp(1.25rem,2.9vw,2.4rem);line-height:1.05;letter-spacing:.015em;text-transform:uppercase;color:var(--rd-steel);margin:0 0 .42em}
.vc-circle h2::after{content:"";display:block;width:44px;height:3px;background:var(--rd-red);margin:.5em auto 0;transform:skewX(-28deg)}
.vc-circle p,.vc-circle blockquote{font-weight:400;font-size:clamp(.74rem,1.28vw,1.04rem);line-height:1.58;color:#44505a;margin:0;max-width:34ch}
@media(max-width:760px){
  .vc-grid{grid-template-columns:1fr}
  .vc-tile{aspect-ratio:4/5}
  .vc-circle{left:5%;width:90%;top:11%;padding:10%}
  .vc-frame{left:2.5%;right:2.5%;top:30%;bottom:3%}
  .vc-circle h2{font-size:clamp(1.4rem,6vw,1.9rem)}
  .vc-circle p,.vc-circle blockquote{font-size:clamp(.82rem,3.4vw,.98rem)}
}

/* =========================================================
   ABOUT : shared section head
   ========================================================= */
/* .fx,.mtr,.wx{} */
.fx-head,.mtr-head,.wx-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px 40px;margin-bottom:clamp(30px,5vw,60px)}
.fx-head .th,.mtr-head .th,.wx-head .th{margin:0;font-size:clamp(2rem,4.2vw,3.2rem)}
.fx-head p,.mtr-head p,.wx-head p{max-width:40ch;margin:0;font-weight:500;font-size:17px;line-height:1.7;color:#666;position:relative;padding-left:28px}
.fx-head p::before,.mtr-head p::before,.wx-head p::before{content:"";position:absolute;left:0;top:.85em;width:16px;height:1px;background:#8d8d8d}

/* MACHINERY & FACILITY */
.fx{background:#fafafa;padding:clamp(48px,7vw,100px) 0}
.fx-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:clamp(14px,1.8vw,24px)}
.fx-box{grid-column:span 2;background:#fff;border-radius:16px;padding:34px 26px 30px;min-width:0;
  box-shadow:0 22px 44px -30px rgba(38,52,61,.35);transition:box-shadow .35s,transform .35s}
.fx-box:nth-child(5){grid-column:2/span 2}
.fx-box svg{width:64px;height:64px;padding:15px;margin-bottom:22px;border-radius:50%;background:#fdecee;
  fill:none;stroke:var(--rd-red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:background .3s,stroke .3s}
.fx-box h3{font-weight:600;font-size:1.1rem;line-height:1.2;letter-spacing:.03em;color:var(--rd-ink);margin:0 0 10px}
.fx-box p{font-weight:300;font-size:.92rem;line-height:1.7;color:#666;margin:0}
.fx-box:hover{transform:translateY(-4px);box-shadow:0 30px 50px -28px rgba(38,52,61,.45)}
.fx-box:hover svg{background:var(--rd-red);stroke:#fff}
@media(max-width:1000px){.fx-grid{grid-template-columns:repeat(2,1fr)}.fx-box,.fx-box:nth-child(5){grid-column:auto}}
@media(max-width:560px){.fx-grid{grid-template-columns:1fr}}

/* MATERIAL DETAILS (dark) */
.mtr{background:var(--rd-steel);color:#fff;padding:clamp(48px,7vw,100px) 0}
.mtr .th,.mtr .th small{color:#fff}.mtr .th small{opacity:.7}
.mtr-head p{color:#c3ced6}.mtr-head p::before{background:#7f909b}
.mtr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,30px);align-items:start}
.mtr-card{border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:clamp(26px,3vw,40px);background:rgba(255,255,255,.035)}
.mtr-card h3{font-weight:600;font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.1;letter-spacing:.04em;color:#fff;margin:0 0 14px;padding-bottom:16px;position:relative}
.mtr-card h3::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:3px;background:var(--rd-red);transform:skewX(-28deg)}
.mtr-d{font-weight:300;font-size:.94rem;line-height:1.75;color:#c3ced6;margin:0 0 6px}
.mtr-card h4{font-weight:600;font-size:.74rem;line-height:1;letter-spacing:.2em;text-transform:uppercase;color:#fff;margin:26px 0 12px}
.mtr-card ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.mtr-card li{position:relative;padding-left:26px;font-weight:300;font-size:.9rem;line-height:1.65;color:#d6dee4}
.mtr-card li::before{content:"";position:absolute;left:0;top:.85em;width:14px;height:1px;background:#ff5a63}
@media(max-width:1000px){.mtr-grid{grid-template-columns:1fr}}

/* WHY CHOOSE US */
.wx{background:#fff;padding:clamp(48px,7vw,100px) 0 clamp(56px,8vw,110px)}
.wx-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,2vw,32px)}
.wx-item{min-width:0}
.wx-bar{display:block;height:1px;background:var(--rd-line);position:relative;margin-bottom:26px}
.wx-bar::after{content:"";position:absolute;left:0;top:-1px;width:48px;height:3px;background:var(--rd-red);transform-origin:left;transform:skewX(-28deg)}
.wx-no{display:block;font-weight:700;font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;color:transparent;-webkit-text-stroke:1.4px #9fb0ba;margin-bottom:14px;letter-spacing:.02em;transition:-webkit-text-stroke-color .3s}
.wx-item:hover .wx-no{-webkit-text-stroke-color:var(--rd-red)}
.wx-item h3{font-weight:600;font-size:1.05rem;line-height:1.25;letter-spacing:.03em;color:var(--rd-ink);margin:0 0 8px}
.wx-item p{font-weight:500;font-size:17px;line-height:1.7;color:#666;margin:0}
@media(max-width:1000px){.wx-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}}
@media(max-width:560px){.wx-grid{grid-template-columns:1fr}}
/* =====================================================================
   REDESIGN  -  Products (home) + About: Vision/Mission, Facility,
   Materials, Why choose us.  All new class names (stg-, vm2-, fx-, mt2-, wy-)
   ===================================================================== */

/* ---------- PRODUCTS: staggered panels (4 categories) ---------- */
.sec.prodsec2{background:var(--sand);padding:clamp(54px,7vw,96px) 0}
.stg{--cut:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:8px}
.stg-i{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);transition:box-shadow .35s,border-color .35s}
.stg-i:hover,.stg-i:focus-within{box-shadow:0 30px 44px -30px rgba(15,23,29,.55);border-color:#c3ccd2}
.stg-img{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--ink2);flex:none}
.stg-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s}
.stg-i:nth-child(odd) .stg-img{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - var(--cut)))}
.stg-i:nth-child(even) .stg-img{order:2;clip-path:polygon(0 var(--cut),100% 0,100% 100%,0 100%)}
.stg-i:nth-child(even) .stg-tx{order:1}
.stg-i:nth-child(1) .stg-img{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - var(--cut)))}
.stg-tx{flex:1;padding:26px 24px 30px;display:flex;flex-direction:column}
.stg-i:nth-child(odd) .stg-tx{padding-top:18px}
.stg-n{font-weight:700;font-size:3.2rem;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--brass);margin-bottom:12px}
.stg-tx h3{font-size:1.35rem;font-weight:600;line-height:1.2;color:var(--char);margin-bottom:16px}
.stg-tx h3 a{text-decoration:none}
.stg-tx h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.stg-ls{display:grid}
.stg-ls a{position:relative;z-index:2;display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:.9rem;line-height:1.35;text-decoration:none;color:var(--ink2);transition:color .2s,padding .25s}
.stg-ls a::after{content:"\2192";color:var(--brass);opacity:0;transition:opacity .2s}
.stg-ls a:hover{color:var(--brass);padding-left:6px}.stg-ls a:hover::after{opacity:1}
.stg-i::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:4px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.stg-i:hover::after,.stg-i:focus-within::after{transform:none}
@media(hover:hover){.stg-img img{filter:grayscale(.85)}.stg-i:hover .stg-img img,.stg-i:focus-within .stg-img img{filter:none;transform:scale(1.06)}}
@media(max-width:960px){.stg{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){
 .stg{grid-template-columns:1fr}
 .stg-i:nth-child(n) .stg-img{order:0;aspect-ratio:16/10;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 24px))}
 .stg-i:nth-child(n) .stg-tx{order:1;padding-top:18px}
}

/* ---------- ABOUT: shared ---------- */
.sec.vm2,.sec.fx,.sec.mt2,.sec.wy{padding:clamp(56px,7vw,100px) 0}
.d2-h{font-size:clamp(2rem,3.6vw,3rem);font-weight:600;line-height:1.1;letter-spacing:0}

/* ---------- VISION & MISSION: slanted split ---------- */
.sec.vm2{--s:70px;background:var(--sand);padding:clamp(40px,6vw,80px) 0}
.vm2-grid{display:grid;grid-template-columns:1.05fr 1fr;width:min(1240px,100% - 44px);margin-inline:auto;box-shadow:0 40px 60px -44px rgba(15,23,29,.5)}
.vm2-v{position:relative;z-index:2;background:var(--ink2);color:#fff;clip-path:polygon(0 0,100% 0,calc(100% - var(--s)) 100%,0 100%);padding:clamp(34px,5vw,64px) calc(var(--s) + 20px) clamp(34px,5vw,64px) clamp(26px,5vw,64px)}
.vm2-v::before{content:"\201C";position:absolute;left:clamp(18px,4vw,50px);top:4px;font-weight:700;font-size:9rem;line-height:1;color:rgba(255,255,255,.07)}
.vm2-m{position:relative;z-index:1;margin-left:calc(var(--s) * -1);background:#fff;padding:clamp(34px,5vw,64px) clamp(26px,5vw,64px) clamp(34px,5vw,64px) calc(var(--s) + 34px);display:flex;flex-direction:column;justify-content:center}
.vm2-m::before{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--s) + 14px);background:var(--brass);clip-path:polygon(0 0,100% 0,calc(100% - var(--s)) 100%,0 100%)}
.vm2 h2{font-size:clamp(2rem,3.4vw,2.8rem);font-weight:600;margin-bottom:6px}
.vm2-v h2{color:#fff}.vm2-m h2{color:var(--char)}
.vm2-sub{font-size:1rem;margin-bottom:26px}
.vm2-v .vm2-sub{color:var(--brass2)}.vm2-m .vm2-sub{color:var(--brass)}
.vm2-v blockquote{position:relative;font-weight:500;font-size:clamp(1.2rem,1.9vw,1.6rem);line-height:1.55;color:#e8eef2}
.vm2-t{font-size:1.12rem;line-height:1.85;color:var(--char);padding-top:22px;border-top:1px solid var(--line)}
@media(max-width:860px){
 .sec.vm2{--s:40px}
 .vm2-grid{grid-template-columns:1fr}
 .vm2-v{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--s)),0 100%);padding:34px 26px calc(var(--s) + 34px)}
 .vm2-m{margin:calc(var(--s) * -1) 0 0;padding:calc(var(--s) + 30px) 26px 34px}
 .vm2-m::before{display:none}
}

/* ---------- MACHINERY & FACILITY: sticky heading + rows ---------- */
.sec.fx{background:#fff}
.fx-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(30px,6vw,90px);align-items:start}
.fx-head{position:sticky;top:120px}
.fx-head p{margin-top:18px;max-width:34ch;color:var(--mute);font-size:1rem}
.fx-head p::before{content:"";display:block;width:56px;height:4px;background:var(--brass);margin-bottom:20px}
.fx-list{border-top:2px solid var(--char)}
.fx-r{display:grid;grid-template-columns:54px 190px 1fr;gap:6px 24px;align-items:center;padding:22px 16px;border-bottom:1px solid var(--line);transition:background .3s,color .3s}
.fx-r svg{width:46px;height:46px;fill:none;stroke:var(--brass);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s}
.fx-r h3{font-size:1.2rem;font-weight:600;line-height:1.25}
.fx-r p{color:var(--mute);font-size:.96rem;line-height:1.6;transition:color .3s}
.fx-r:hover{background:var(--char);color:#fff}.fx-r:hover svg{stroke:var(--brass2)}.fx-r:hover p{color:#c3ced6}
@media(max-width:900px){.fx-grid{grid-template-columns:1fr}.fx-head{position:static}}
@media(max-width:600px){.fx-r{grid-template-columns:46px 1fr;padding:20px 8px}.fx-r p{grid-column:1/-1}.fx-r svg{width:38px;height:38px}}

/* ---------- MATERIALS: dark columns, middle one stepped down ---------- */
.sec.mt2{background:var(--char);color:#fff}
.mt2 .d2-h{color:#fff;margin-bottom:clamp(34px,5vw,56px);max-width:18ch}
.mt2-grid{display:grid;grid-template-columns:repeat(3,1fr);align-items:start}
.mt2-c{padding:6px clamp(20px,2.6vw,38px) 10px;border-left:1px solid rgba(255,255,255,.16)}
.mt2-c:first-child{border-left:0;padding-left:0}
.mt2-c:nth-child(2){margin-top:56px}
.mt2-c b{display:block;font-weight:700;font-size:4.4rem;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--brass2);margin-bottom:14px}
.mt2-c h3{font-size:1.7rem;font-weight:600;color:#fff;margin-bottom:12px}
.mt2-d{color:#b9c6cf;font-size:.96rem;line-height:1.7;margin-bottom:8px}
.mt2-c h4{font-weight:600;font-size:1rem;color:var(--brass2);margin:20px 0 8px}
.mt2-c ul{display:grid;gap:8px}
.mt2-c li{position:relative;padding-left:20px;font-size:.94rem;line-height:1.55;color:#e8eef2}
.mt2-c li::before{content:"";position:absolute;left:0;top:.7em;width:9px;height:2px;background:var(--brass2)}
@media(max-width:1000px){.mt2-grid{grid-template-columns:1fr}.mt2-c,.mt2-c:first-child{border-left:0;padding:30px 0;border-top:1px solid rgba(255,255,255,.16)}.mt2-c:first-child{border-top:0;padding-top:0}.mt2-c:nth-child(2){margin-top:0}}

/* ---------- WHY CHOOSE US: staircase ---------- */
.sec.wy{background:var(--sand);overflow:hidden}
.wy .d2-h{margin-bottom:clamp(30px,5vw,52px);max-width:16ch}
.wy-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:start}
.wy-s{background:#fff;border-top:4px solid var(--brass);padding:28px 22px 30px;min-height:190px}
.wy-s:nth-child(2){margin-top:34px}.wy-s:nth-child(3){margin-top:68px}.wy-s:nth-child(4){margin-top:102px}.wy-s:nth-child(5){margin-top:136px}
.wy-s h3{font-size:1.2rem;font-weight:600;line-height:1.25;margin-bottom:10px;color:var(--char)}
.wy-s p{color:var(--mute);font-size:.94rem;line-height:1.6}
.wy-grid{padding-bottom:0}
@media(max-width:1000px){.wy-grid{grid-template-columns:repeat(2,1fr)}.wy-s:nth-child(n){margin-top:0}.wy-s:nth-child(even){margin-top:30px}.wy-s{min-height:0}}
@media(max-width:560px){.wy-grid{grid-template-columns:1fr}.wy-s:nth-child(n){margin-top:0}}