*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#222;background:#f7f4ef;line-height:1.7}
a{color:#1a1a1a}.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
header{background:#222;color:#fff;padding:18px 0;border-bottom:4px solid #d9a441;position:sticky;top:0;z-index:10}
header .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.brand{font-size:28px;font-weight:800;letter-spacing:2px}.brand span{color:#d9a441}
.tag{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#ddd}
nav a{color:#fff;text-decoration:none;margin:0 10px;font-weight:700}nav a:hover{color:#d9a441}
.cta{display:inline-block;background:#d9a441;color:#111;text-decoration:none;font-weight:800;padding:13px 22px;border-radius:4px}
.hero{background:#222;color:#fff;padding:72px 0;position:relative;overflow:hidden}.hero h1{font-size:54px;line-height:1.05;margin:0 0 12px}.hero p{font-size:20px;color:#ddd;max-width:760px}
.hero3d{background:radial-gradient(600px 300px at 85% 20%,rgba(217,164,65,.35),transparent 60%),linear-gradient(115deg,#222 0 70%,#2e2a24 70%)}
.hero3d .wrap{position:relative;z-index:2}
.hero-depth{position:absolute;right:-40px;bottom:-30px;width:420px;height:220px;background:linear-gradient(115deg,#3a3a3a,#555);border-left:8px solid #d9a441;box-shadow:-20px 20px 0 rgba(217,164,65,.25),-40px 40px 0 rgba(0,0,0,.25);transform:perspective(800px) rotateY(-12deg);opacity:.9}
.seam{height:6px;background:#d9a441}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.card{background:#fff;padding:26px;border-top:4px solid #d9a441;box-shadow:0 2px 12px rgba(0,0,0,.07)}
.card h3{margin-top:0}.num{font-size:38px;font-weight:800;color:#d9a441}
section{padding:56px 0}h2{font-size:36px;margin:0 0 14px}.lead{font-size:20px}
.panel{background:#fff;padding:28px;border-left:6px solid #d9a441;margin:22px 0}
.visual{height:280px;background:linear-gradient(115deg,#3a3a3a 0 55%,#e8e0d0 55% 58%,#d9a441 58% 62%,#f0ece4 62%);display:flex;align-items:flex-end;padding:22px;color:#222;font-weight:800;font-size:20px}
.visual.dark{color:#fff}.label{font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#666}
.photo{width:100%;height:300px;object-fit:cover;display:block;box-shadow:0 18px 40px rgba(0,0,0,.22)}
.visual3d{position:relative;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.22)}
.visual3d:before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 55%,rgba(255,255,255,.35) 56%,transparent 58%)}
.visual3d:after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:#d9a441;box-shadow:0 -8px 0 rgba(217,164,65,.25)}
.depth-band{height:220px;background:linear-gradient(100deg,#2b2b2b 0 45%,#4a4a4a 45% 48%,#d9a441 48% 52%,#e8e0d0 52%);display:flex;align-items:flex-end;padding:22px;color:#fff;font-weight:800;box-shadow:inset 0 -30px 60px rgba(0,0,0,.35),0 14px 30px rgba(0,0,0,.18)}
footer{background:#222;color:#ddd;padding:40px 0}footer a{color:#fff}
table{width:100%;border-collapse:collapse;background:#fff}td,th{padding:13px;border:1px solid #ddd;text-align:left}
.step{background:#222;color:#fff;padding:24px}.step b{color:#d9a441;font-size:22px}
.wall{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:0;text-align:center;font-weight:800}.wall div{padding:26px 10px;border:1px solid #ccc;background:#fff}.wall div:nth-child(2){background:#e8e0d0}.wall div:nth-child(4){background:#d9a441}
.wx-stage{display:flex;gap:14px;perspective:900px;margin:20px 0}.wx-layer{flex:1;background:#fff;border:1px solid #ccc;padding:26px 12px;text-align:center;font-weight:800;cursor:pointer;transition:transform .3s,box-shadow .3s,background .3s}.wx-layer.active{transform:translateY(-16px) scale(1.03);background:#d9a441;box-shadow:0 16px 30px rgba(0,0,0,.22)}
.wx-btns{display:flex;gap:10px;flex-wrap:wrap}.wx-btns button{background:#222;color:#fff;border:0;padding:12px 18px;font-weight:800;cursor:pointer}.wx-btns button.active{background:#d9a441;color:#111}
.ba{position:relative;height:320px;overflow:hidden;background:#e8e0d0;box-shadow:0 16px 36px rgba(0,0,0,.2)}.ba-finished{position:absolute;inset:0;display:flex;align-items:flex-end;padding:22px;background:linear-gradient(115deg,#f0ece4,#d8d0c0);font-weight:800}.ba-taping{position:absolute;left:0;top:0;bottom:0;width:50%;overflow:hidden;background:linear-gradient(115deg,#333,#555);color:#fff;border-right:6px solid #d9a441}.ba-taping span{position:absolute;left:22px;bottom:22px;white-space:nowrap;font-weight:800}.ba input{position:absolute;left:0;right:0;bottom:12px;width:92%;margin:0 4%}
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .5s,transform .5s}.js .reveal.visible{opacity:1;transform:none}
@media(max-width:760px){.hero h1{font-size:36px}.grid3,.grid2,.wall{grid-template-columns:1fr}nav a{display:inline-block;margin:6px}.hero-depth{display:none}.wx-stage{flex-direction:column}.wx-layer.active{transform:translateY(-6px)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}