:root{--base:#d8b98f;--ink:#3a2608;--soft:#6b4c1c;--dk:rgba(110,70,15,.45);--lt:rgba(255,243,205,.8);--g1:#fff0a8;--g2:#f2cf5e;--g3:#d9a21f;--g4:#a86f0a}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);font:16px/1.5 -apple-system,"Segoe UI","PingFang SC",Arial,sans-serif;min-height:100vh;
background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='400'><filter id='n' x='0' y='0' width='100%25' height='100%25'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35 0 0 0 0 .22 0 0 0 0 .04 0 0 0 2.2 -.75'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"),radial-gradient(90% 60% at 50% 18%,#ecd2a2,#d8b98f 55%,#bf9660) fixed;background-color:var(--base)}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px 48px}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:22px;text-decoration:none}
.brand img{width:44px;height:auto}
nav{display:flex;gap:18px;font-weight:600;color:var(--soft)}
nav a{text-decoration:none}
.raised{background:linear-gradient(145deg,rgba(255,238,196,.55),rgba(214,176,118,.55));border-radius:24px;
box-shadow:inset 2px 2px 1px rgba(255,251,230,.95),inset -2px -2px 2px rgba(122,78,12,.38),1px 1px 0 rgba(120,76,12,.35),14px 14px 28px rgba(110,70,15,.5),-12px -12px 26px rgba(255,246,214,.9)}
.inset{background:rgba(200,160,100,.28);border-radius:18px;box-shadow:inset 7px 7px 14px var(--dk),inset -7px -7px 14px var(--lt),1.5px 1.5px 1px rgba(255,248,222,.95)}
.card{padding:22px}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;padding:34px;align-items:center}
@media(max-width:820px){.hero{grid-template-columns:1fr;padding:22px}}
h1{font-size:clamp(28px,5vw,46px);line-height:1.1;margin:0 0 12px}
h2{font-size:22px;margin:36px 0 14px}
p{margin:0 0 14px;color:var(--soft)}
label{display:block;font-size:13px;font-weight:700;color:var(--soft);margin:0 0 6px}
.field{width:100%;border:0;padding:13px 16px;margin-bottom:14px;font:inherit;color:var(--ink);background:transparent;border-radius:16px;box-shadow:inset 5px 5px 10px var(--dk),inset -5px -5px 10px var(--lt)}
.field:focus{outline:2px solid rgba(168,111,10,.6)}
.btn{display:inline-block;position:relative;overflow:hidden;cursor:pointer;border:0;border-radius:999px;padding:13px 26px;font-family:inherit;font-weight:700;font-size:16px;line-height:1;color:#3b2504;text-decoration:none;text-shadow:0 1px 0 rgba(255,244,190,.7);
background:linear-gradient(180deg,var(--g1) 0%,var(--g2) 28%,var(--g3) 52%,var(--g4) 66%,var(--g3) 84%,var(--g2) 100%);
box-shadow:inset 0 1px 1px rgba(255,255,255,.9),inset 0 -3px 6px rgba(109,66,4,.45),7px 7px 16px var(--dk),-5px -5px 14px var(--lt)}
.btn::before{content:"";position:absolute;left:8%;right:8%;top:5%;height:38%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0));pointer-events:none}
.btn:hover{filter:brightness(1.05)}
.btn:focus-visible{outline:3px solid #fff7d0;outline-offset:3px}
.btn.on,.btn:active{background:#cf9d2e;text-shadow:none;box-shadow:inset 0 0 0 1px rgba(109,66,4,.25),inset 2px 2px 5px rgba(109,66,4,.3)}
.btn.on::before,.btn:active::before{display:none}
.btn.pale{color:var(--ink);background:linear-gradient(180deg,#fff7dc,#f1dba0 30%,#d9b66a 55%,#b88a3a 68%,#d9b66a 86%,#ecd18a)}
.btn.wide{display:block;width:100%;text-align:center}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.tech{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.avatar{width:56px;height:56px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:800;font-size:20px;background:radial-gradient(circle at 32% 25%,var(--g1),var(--g3) 55%,var(--g4));box-shadow:inset 0 -3px 6px rgba(109,66,4,.45),4px 4px 10px var(--dk),-3px -3px 8px var(--lt)}
.tag{display:inline-block;font-size:12px;font-weight:700;padding:5px 10px;margin:0 6px 8px 0;border-radius:999px;color:var(--soft);box-shadow:inset 2px 2px 5px var(--dk),inset -2px -2px 5px var(--lt)}
.price{display:flex;align-items:baseline;justify-content:space-between;margin:6px 0 14px}.price strong{font-size:26px}.price small{color:var(--soft)}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:8px 6px;border-bottom:1px solid rgba(110,70,15,.2)}
.err{padding:12px 16px;margin:0 0 16px;color:#6a1b0b;font-weight:700}
footer{margin-top:40px;text-align:center;font-size:13px;color:var(--soft)}