.navbar{width:100%;padding:20px 0;background-color:#f6f6f6;display:flex;justify-content:center;align-items:center;position:fixed;z-index:1000}.nav-links{list-style:none;display:flex;gap:3rem;font-family:Helvetica Neue,sans-serif;font-size:14px;letter-spacing:1.5px}.nav-links li a{text-decoration:none;color:#000;font-weight:500}.nav-links li a:hover{text-decoration:underline}.about-container{display:flex;justify-content:center;align-items:flex-start;max-width:900px;margin:4rem auto;padding:0 1rem;gap:0rem;flex-wrap:wrap}.about-text{flex:1;min-width:280px;text-align:left;font-family:Open Sans,sans-serif}.about-text h1{font-size:28px;font-weight:700;margin-bottom:.1em}.about-text h2{font-size:20px;font-weight:500;margin-top:0;margin-bottom:1.5em}.about-text p{font-size:17px;line-height:1.5;margin:0}.about-image{flex:1;min-width:280px;height:400px;display:flex;justify-content:center}.about-image img{max-width:100%;height:auto;border-radius:4px}.about-text a{display:inline-flex;align-items:center;gap:.4rem;font-size:14.5px;text-decoration:none;color:#0077a5;margin:.3rem 0;transition:color .2s ease}.about-text a:hover{color:#0077b5}.about-text a img{height:20px;width:auto;vertical-align:middle;opacity:.85;transition:opacity .2s ease}.about-text a:hover img{opacity:1}.viewer-layout{height:100vh;display:flex;flex-direction:column;font-family:Inter,sans-serif}.canvas-area{flex:2;background:#e4e2e2;position:relative}.config-panel{flex:1;width:100%;background:#fff;box-shadow:0 -2px 10px #00000014;display:flex;flex-direction:column;justify-content:flex-start;padding:.5rem 0}.config-title-panel{text-align:center;font-weight:600;font-size:1rem;color:#333}.config-materials-panel{display:flex;justify-content:center;align-items:center;gap:1.5rem;padding:.5rem 0 1rem}.material-option{display:flex;flex-direction:column;align-items:center;cursor:pointer}.material-circle{width:60px;height:60px;border-radius:50%;border:2px solid transparent;transition:all .2s ease;position:relative;background-position:center;background-repeat:no-repeat;background-size:90%}.material-option:nth-child(1) .material-circle{background-image:url(./rooficon-97572abf.png);background-color:#fff}.material-option:nth-child(2) .material-circle{background-image:url(./wallsicon-d15bdda7.png);background-color:#fff}.material-option:nth-child(3) .material-circle{background-image:url(./furnitureicon-99c77762.png);background-color:#fff}.material-option.selected .material-circle{border-color:silver;transform:scale(1.05)}.material-option:not(.selected) .material-circle:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(161,161,161,.4);border-radius:50%;transition:background .25s ease}.material-name{display:none}.swipe-icon{position:absolute;top:20px;left:50%;transform:translate(-50%);width:80px;opacity:.1;pointer-events:none;animation:swipeFade 3s ease-in-out}@keyframes swipeFade{0%,to{opacity:.1;transform:translate(-50%)}50%{opacity:.2;transform:translate(-50%,5px)}}@media (max-width: 768px){.canvas-area{flex:1.8}.config-panel{flex:.9;padding:.3rem .2rem}.config-title-panel{font-size:.9rem}.config-materials-panel{gap:1rem}.material-circle{width:45px;height:45px;background-size:55%}.swipe-icon{width:60px;top:12px}}@media (max-width: 480px){.canvas-area{flex:1}.material-circle{width:38px;height:38px;background-size:50%}.config-title-panel{font-size:.85rem}.swipe-icon{width:50px;top:10px}}body,html{margin:0;padding:0;background:radial-gradient(circle,#ffffff 0%,#e0dfda 100%);font-family:Open Sans,sans-serif}h1{margin:0}.wrapper{max-width:1024px}
