:root { --ink:#22141A; --room:#2B1A15; --stripe:#33201A; --panel:#3D2820; --cream:#FFF3DA; --dim:#D9C7A8; --yellow:#FFC83D; --red:#FF5B4A; --teal:#2BC4B4; }
* { box-sizing: border-box; }
body { margin:0; color:var(--cream); font:17px/1.55 ui-rounded, "SF Pro Rounded", system-ui, -apple-system, sans-serif;
  background: repeating-linear-gradient(90deg, var(--room) 0 84px, var(--stripe) 84px 140px); }
.sheet { max-width: 920px; margin: 0 auto; padding: 32px 16px 48px; }
h1 { font-size: clamp(2rem, 6vw, 3.2rem); line-height:1.05; margin:.3rem 0 1rem; font-weight:900; text-shadow: 0 4px 0 var(--ink); }
h2 { font-weight:900; margin-top:2.2rem; color:var(--yellow); text-shadow: 0 3px 0 var(--ink); }
a { color: var(--yellow); }
.eyebrow { color:var(--yellow); font-weight:900; letter-spacing:.14em; text-transform:uppercase; font-size:.85rem; }
.muted { color: var(--dim); }
.hero { display:grid; gap:24px; align-items:center; }
.icon { width:120px; height:120px; border-radius:27px; border:4px solid var(--ink); box-shadow:0 6px 0 var(--ink); }
.badge { display:inline-block; margin-top:.6rem; padding:.8rem 1.3rem; border-radius:16px; background:var(--yellow); color:var(--ink);
  font-weight:900; text-decoration:none; border:4px solid var(--ink); box-shadow:0 6px 0 #C98A12, 0 6px 0 4px var(--ink); }
.shots { display:flex; gap:14px; overflow-x:auto; padding:22px 2px 12px; }
.shots img { height: 420px; border-radius: 18px; border:4px solid var(--ink); flex: none; }
.features { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:14px; }
.card { background:var(--panel); border:4px solid var(--ink); border-radius:20px; padding:16px 18px; box-shadow:0 5px 0 var(--ink); }
.card strong { color: var(--yellow); }
ul { padding-left: 1.2rem; }
footer { margin-top: 3rem; color: var(--dim); font-size:.95rem; }
@media (max-width: 600px) { .shots img { height: 340px; } }