/* FALTSYSTEM metal architecture configurator */
.material-section{position:relative;isolation:isolate;overflow:hidden;padding:72px 0 58px;background:linear-gradient(180deg,#f8f7f4 0%,#f1f0ec 56%,#f7f5f1 100%)}
.material-section::before{content:"";position:absolute;z-index:-2;inset:0 0 auto;height:430px;background:linear-gradient(90deg,rgba(248,247,244,.98) 0%,rgba(248,247,244,.9) 34%,rgba(248,247,244,.24) 67%,rgba(248,247,244,.08) 100%),linear-gradient(180deg,transparent 64%,#f1f0ec 100%),url("assets/solutions-architecture.png") 72% 43%/cover no-repeat}
.material-section::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(circle at 58% 76%,rgba(255,255,255,.72),transparent 38%)}
.material-section .section-line{display:block;min-height:245px;margin:0}
.material-section .section-line>div{max-width:790px}.material-section .section-line .eyebrow{margin-bottom:24px}.material-section .section-line h2{margin:0;font-size:clamp(44px,4.1vw,64px);line-height:.94;letter-spacing:-.045em}
.material-intro{max-width:530px;margin:14px 0 0;font-size:19px;line-height:1.45;color:#72777a}
.material-layout{display:grid;grid-template-columns:minmax(0,1.46fr) minmax(430px,1fr);gap:18px;align-items:stretch}
.material-stage,.material-controls{min-width:0;min-height:625px;border:1px solid rgba(172,160,146,.34);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(244,239,233,.83));box-shadow:0 24px 70px rgba(48,54,57,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.material-stage{position:relative;display:flex;flex-direction:column;padding:27px 32px 28px;overflow:hidden;color:#1b2329}
.material-stage::before{content:"";position:absolute;inset:-25% -20% auto 18%;height:74%;transform:rotate(-14deg);background:linear-gradient(108deg,transparent 34%,rgba(255,255,255,.76) 48%,rgba(222,216,207,.14) 62%,transparent 70%);pointer-events:none}
.sample-top{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8a8e8e;font-size:11px;letter-spacing:.095em;text-transform:uppercase}
.sample-top button{display:inline-flex;align-items:center;gap:7px;padding:5px;border:0;background:transparent;color:#806b53;font:inherit;font-size:13px;letter-spacing:0;text-transform:none;cursor:pointer}.sample-top button span{font-size:20px;line-height:1}.sample-top button:hover{color:#5f4934}
.material-preview-area{position:relative;z-index:2;display:grid;grid-template-columns:72px minmax(0,1fr);gap:20px;flex:1;align-items:center;min-height:390px;padding:18px 0 7px}
.sample-thumbs{display:grid;gap:8px;align-content:center}
.sample-thumb{position:relative;display:block;width:72px;aspect-ratio:1/1;overflow:hidden;padding:0;border:1px solid transparent;border-radius:7px;background:#dedbd4;cursor:pointer}
.sample-thumb img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .28s ease}.sample-thumb:nth-child(1) img,.sample-thumb:nth-child(3) img{object-fit:contain;padding:5px;background:#ece9e3}.sample-thumb:nth-child(2) img{object-position:50% 34%}.sample-thumb:nth-child(4) img{object-position:70% 50%}.sample-thumb:hover img{transform:scale(1.05)}
.sample-thumb[aria-pressed="true"]{border-color:#957553;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 0 3px #957553}
.sample-visual{position:relative;display:grid;place-items:center;min-width:0;height:100%;overflow:hidden;border-radius:12px}
.wave-preview{display:block;width:100%;height:auto;max-height:350px;overflow:hidden;border-radius:12px;filter:drop-shadow(0 22px 17px rgba(46,51,53,.2))}
.preview-layer{opacity:0;transition:opacity .28s ease;pointer-events:none}
.material-stage[data-preview-view="wave"] .preview-layer[data-preview-layer="wave"],.material-stage[data-preview-view="detail"] .preview-layer[data-preview-layer="detail"],.material-stage[data-preview-view="profile"] .preview-layer[data-preview-layer="profile"],.material-stage[data-preview-view="architecture"] .preview-layer[data-preview-layer="architecture"]{opacity:1}
.sample-3d{position:absolute;right:2px;bottom:4px;z-index:4;display:grid;place-items:center;width:58px;height:58px;border:1px solid #d8d0c6;border-radius:50%;background:rgba(255,255,255,.76);color:#735f49;font-size:11px;line-height:1.05;text-align:center;box-shadow:0 8px 25px rgba(59,52,44,.08)}.sample-3d svg{width:22px;height:22px;margin-bottom:1px}
.sample-bottom{position:relative;z-index:3;display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px 20px;padding:0 0 13px 4px;border-bottom:1px solid rgba(147,135,122,.22);color:#858787;font-size:12px}.sample-bottom span+span::before{content:"•";margin-right:20px;color:#9e7f5b}
.sample-selection{position:relative;z-index:3;padding:18px 8px 0}.sample-selection h3{margin:0 0 5px;font-size:29px;line-height:1.05;letter-spacing:-.035em}.sample-selection p{margin:0;color:#767b7d;font-size:15px}
.material-controls{display:flex;flex-direction:column;padding:31px 32px 24px}.material-controls fieldset{min-width:0;margin:0 0 24px;padding:0;border:0}.material-controls legend{display:block;margin:0 0 13px;color:#1d252b;font-size:18px;font-weight:650}.material-controls legend>span{margin-right:12px;color:#9b7955;font-size:11px;font-weight:500}.material-controls legend small{margin-left:10px;color:#888b8b;font-size:11px;font-weight:400}
.material-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.material-option{position:relative;display:flex;align-items:center;gap:10px;min-width:0;min-height:60px;padding:7px 9px;border:1px solid rgba(183,174,164,.32);border-radius:8px;background:rgba(255,255,255,.43);color:#353b3e;font-size:11px;line-height:1.2;text-align:left;cursor:pointer}.material-option:hover{border-color:#b5a087;background:rgba(255,255,255,.74)}.material-option[aria-pressed="true"]{border-color:#9b7b57;background:rgba(255,255,255,.72);box-shadow:0 4px 12px rgba(91,70,47,.06)}
.material-option[aria-pressed="true"]::after{content:"✓";position:absolute;top:4px;right:5px;display:grid;place-items:center;width:14px;height:14px;border-radius:50%;background:#9b7b57;color:#fff;font-size:9px}
.metal-swatch{flex:0 0 42px;height:42px;border-radius:50%;background:radial-gradient(circle at 30% 24%,rgba(255,255,255,.96),transparent 24%),linear-gradient(135deg,rgba(0,0,0,.28),transparent 42%,rgba(255,255,255,.55) 67%,rgba(0,0,0,.18)),var(--swatch);box-shadow:inset -5px -5px 9px rgba(0,0,0,.12),0 0 0 1px rgba(119,112,104,.18)}
.color-options{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.color-option{position:relative;width:36px;height:36px;padding:0;border:3px solid #f8f6f2;border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px #cfcbc5;cursor:pointer}.color-option:hover{transform:translateY(-1px)}.color-option[aria-pressed="true"]{box-shadow:0 0 0 2px #967552}.color-option[aria-pressed="true"]::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:14px;text-shadow:0 1px 3px #000}
.texture-options{display:flex;gap:10px;flex-wrap:wrap}.texture-options button{min-width:92px;padding:10px 16px;border:1px solid #d4cec5;border-radius:999px;background:rgba(255,255,255,.48);color:#5a5e5f;font-size:12px;cursor:pointer}.texture-options button:hover{border-color:#a98d6e}.texture-options button[aria-pressed="true"]{border-color:#997957;background:linear-gradient(100deg,#a98a66,#8e6a45);color:#fff}
.material-description{min-height:42px;margin:0 0 20px;color:#777b7b;font-size:14px;line-height:1.45}.material-controls .button{width:100%;justify-content:space-between;margin-top:auto;padding:18px 22px}
.material-helper{display:flex;align-items:flex-start;gap:12px;margin:16px 5px 0;color:#7d7e7b;font-size:12px;line-height:1.4}.material-helper svg{flex:0 0 21px;width:21px;height:21px;color:#927454}
.sample-note{max-width:760px;margin:22px 25px 0;color:#858684;font-size:11px;line-height:1.55}
.material-page .detail-intro{padding-bottom:0}.material-page .material-section{padding-top:40px}.material-page .material-section::before{height:315px}.material-page .material-section>.wrap>.section-line{display:none}.material-page .material-layout{margin-top:0}
.world-update{margin-top:25px}.world-update .project-gallery{display:block}.world-update .project-gallery button{display:block;width:100%;height:520px}
.material-request{margin:20px 0;padding:16px;border:1px solid #d9ccbd;border-radius:6px;background:#f2eee8;font-size:14px;line-height:1.5}.material-request input{width:100%;margin-top:8px;background:#fff}.material-request label{display:block}
.material-section button:focus-visible,.material-section a:focus-visible{outline:2px solid #8c6e4c;outline-offset:3px}
@media(max-width:1250px){.material-layout{grid-template-columns:minmax(0,1.22fr) minmax(390px,1fr)}.material-stage,.material-controls{min-height:600px}.material-stage{padding-inline:25px}.material-controls{padding-inline:24px}.material-options{grid-template-columns:repeat(2,minmax(0,1fr))}.material-preview-area{grid-template-columns:62px minmax(0,1fr);gap:15px}.sample-thumb{width:62px}}
@media(max-width:980px){.material-section{padding-top:58px}.material-section::before{height:355px;background-position:65% 45%}.material-section .section-line{min-height:215px}.material-section .section-line h2{font-size:52px}.material-intro{margin-top:14px;font-size:17px}.material-layout{grid-template-columns:1fr;gap:14px}.material-stage,.material-controls{min-height:0}.material-stage{height:610px}.material-controls{padding:30px}.material-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.material-section{padding:45px 0 36px}.material-section::before{height:300px;background:linear-gradient(180deg,rgba(248,247,244,.78),rgba(248,247,244,.94)),url("assets/solutions-architecture.png") 63% center/cover no-repeat}.material-section .section-line{display:block;min-height:0;margin-bottom:30px}.material-section .section-line .eyebrow{margin-bottom:17px}.material-section .section-line h2{font-size:42px}.material-intro{margin:16px 0 0;font-size:16px;line-height:1.5}.material-stage{height:auto;min-height:540px;padding:21px 18px 22px;border-radius:15px}.sample-top{font-size:9px}.sample-top button{font-size:11px}.sample-top button span{font-size:17px}.material-preview-area{grid-template-columns:1fr;align-content:center;gap:12px;min-height:365px;padding-top:14px}.sample-thumbs{grid-row:2;grid-template-columns:repeat(4,1fr);gap:7px;justify-self:center;width:min(100%,300px)}.sample-thumb{width:100%;max-width:66px;justify-self:center}.sample-visual{grid-row:1;min-height:250px}.wave-preview{width:100%;max-height:250px}.sample-3d{right:0;bottom:4px;width:49px;height:49px;font-size:9px}.sample-3d svg{width:19px;height:19px}.sample-bottom{font-size:10px;gap:12px}.sample-bottom span+span::before{margin-right:12px}.sample-selection{padding:16px 3px 0}.sample-selection h3{font-size:25px}.sample-selection p{font-size:13px}.material-controls{padding:24px 18px 20px;border-radius:15px}.material-controls fieldset{margin-bottom:22px}.material-controls legend{font-size:16px}.material-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.material-option{min-height:55px;padding:6px;font-size:10px}.metal-swatch{flex-basis:36px;height:36px}.color-options{gap:9px}.color-option{width:33px;height:33px}.texture-options{display:grid;grid-template-columns:1fr 1fr}.texture-options button{min-width:0;padding-inline:10px}.material-description{min-height:0}.material-helper{font-size:11px}.sample-note{margin:18px 4px 0}.material-page .material-section{padding-top:25px}.world-update .project-gallery button{height:280px}}
@media(max-width:390px){.material-section .section-line h2{font-size:37px}.material-stage{padding-inline:14px}.sample-top>span{max-width:165px}.material-preview-area{min-height:340px}.sample-visual{min-height:220px}.material-controls{padding-inline:14px}.material-option{gap:6px}.metal-swatch{flex-basis:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.sample-thumb img,.preview-layer{transition:none}}