@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Noto+Sans+JP:wght@400;500;700;900&display=swap');*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#141414;color:#f7f3ed;font-family:'Noto Sans JP',sans-serif}a{color:inherit;text-decoration:none}header{position:absolute;z-index:3;left:0;top:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:24px 6%;border-bottom:1px solid #ffffff30}.logo{font:900 26px/.8 'Barlow Condensed';letter-spacing:.03em}.logo small{display:block;font:700 9px/1.8 'Barlow Condensed';letter-spacing:.24em}nav{display:flex;gap:24px}nav a{font:700 11px 'Barlow Condensed';letter-spacing:.12em}.hero{height:100svh;min-height:680px;position:relative;background:url('https://images.unsplash.com/photo-1507136566006-cfc505b114fc?auto=format&fit=crop&w=2000&q=85') center/cover}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#100d0bea,#1b1513a8 55%,#1a100e5c),linear-gradient(0deg,#100d0bca,transparent 40%)}.hero-copy{position:absolute;left:7%;top:50%;transform:translateY(-45%)}.kicker{font:800 12px 'Barlow Condensed';letter-spacing:.28em;color:#e27c57}h1,h2{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:900;letter-spacing:-.01em}h1{font-size:clamp(110px,18vw,240px);line-height:.72;margin:35px 0}h1 span,h2 span{color:#e27c57}.hero h2{font:900 clamp(18px,2vw,27px) 'Noto Sans JP'}.button{display:inline-block;margin-top:25px;background:#f4eee6;color:#111;padding:19px 26px;font:800 12px 'Barlow Condensed';letter-spacing:.14em}.bottom{position:absolute;bottom:25px;left:7%;font:700 11px 'Barlow Condensed';letter-spacing:.3em}.intro,.finishes,.process,.contact{padding:110px 7%}.intro{background:#171717}.intro h2,.finishes h2,.process h2,.contact h2{font-size:clamp(67px,11vw,155px);line-height:.83;margin:20px 0 35px}.intro h3{font-size:24px;line-height:1.7}.intro>p:not(.kicker),.finishes>p:not(.kicker),.step p,.contact p:not(.kicker){font-size:13px;color:#bdb7b0;line-height:2.2;max-width:580px}.stripe{margin-top:45px;padding:95px 25px 25px;background:repeating-linear-gradient(135deg,#202020 0,#202020 18px,#383838 18px,#383838 24px);font:700 13px 'Barlow Condensed';letter-spacing:.22em}.finishes{background:#202020}.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:45px;text-align:center;font:700 12px 'Barlow Condensed';letter-spacing:.12em}.swatch{display:block;height:180px;margin-bottom:14px;border:9px solid #333;box-shadow:inset 0 0 0 1px #ffffff40;background-size:15px 15px}.charcoal{background-color:#3d3e3d;background-image:radial-gradient(#c4c3bb 1.5px,transparent 2px),radial-gradient(#151515 2px,transparent 3px)}.silver{background-color:#8d8e8b;background-image:radial-gradient(#eee 1.5px,transparent 2px),radial-gradient(#343638 2px,transparent 3px)}.sand{background-color:#a89a84;background-image:radial-gradient(#e3d7c4 1.5px,transparent 2px),radial-gradient(#514d45 2px,transparent 3px)}.slate{background-color:#555c61;background-image:radial-gradient(#b4b7b7 1.5px,transparent 2px),radial-gradient(#272c31 2px,transparent 3px)}.process{background:#151515}.step{border-top:1px solid #6b3f30;padding:30px 0;display:grid;grid-template-columns:110px 1fr}.step b{font:900 64px 'Barlow Condensed';color:#e27c57}.step h3{font-size:20px}.contact{background:#e7e1da;color:#181614}.contact .kicker{color:#b65f42}.contact h3{font-size:20px}.contact p:not(.kicker){color:#555}.button.dark{background:#161616;color:#fff}footer{padding:32px 7%;display:flex;justify-content:space-between;gap:15px;font:700 11px 'Barlow Condensed';letter-spacing:.16em}@media(max-width:700px){header{padding:20px 5%}nav{gap:10px}nav a{font-size:9px}.logo{font-size:22px}.hero-copy{left:6%}h1{font-size:clamp(100px,24vw,160px)}.intro,.finishes,.process,.contact{padding:85px 6%}.intro h2,.finishes h2,.process h2,.contact h2{font-size:clamp(63px,15vw,105px)}.swatches{grid-template-columns:repeat(2,1fr)}.swatch{height:145px}.step{grid-template-columns:75px 1fr}.step b{font-size:50px}}

/* Actual color samples supplied by THE SHOX */
.sample-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:46px}.sample{margin:0;background:#292725;border:1px solid #49413a;overflow:hidden}.sample img{display:block;width:100%;aspect-ratio:1.22;object-fit:cover}.sample figcaption{padding:14px 14px 17px;display:flex;flex-wrap:wrap;gap:4px 9px;align-items:baseline;font-family:'Barlow Condensed','Noto Sans JP',sans-serif}.sample strong{color:#e27c57;font-size:17px}.sample span{font-size:17px;font-weight:800}.sample small{font-size:11px;color:#bbb2aa}.sample-note{margin-top:22px;font:700 11px 'Barlow Condensed';letter-spacing:.18em}@media(max-width:700px){.sample-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sample figcaption{padding:10px;gap:2px 6px}.sample strong,.sample span{font-size:14px}.sample small{font-size:10px}}