
:root{
  --bg: #ffea3d;
  --accent: #b51d1d;
  --ink: #1b1300;
  --radius: 18px;
  --shadow: 0 8px 24px rgba(0,0,0,.10);
  --border: 2px solid rgba(181,29,29,.65);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial;color:var(--ink);background:var(--bg)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,92vw);margin:0 auto}
nav{position:sticky;top:0;background:rgba(255,255,255,.18);backdrop-filter:saturate(160%) blur(10px);border-bottom:var(--border);z-index:50}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
.logo{display:flex;align-items:center;gap:12px}
.logo img{height:44px;width:auto;border-radius:12px;box-shadow:var(--shadow);background:transparent}
.brand{font-weight:900;letter-spacing:.3px;color:var(--accent)}
.links{display:flex;gap:16px;flex-wrap:wrap}
.links a{padding:8px 12px;border-radius:999px;background:transparent;border:var(--border)}
.links a.active, .links a:hover{background:var(--accent);color:white}
.hero{display:grid;place-items:center;padding:84px 0 40px;text-align:center}
.hero img.hero-logo{max-width: 360px; width: 100%; height:auto; border-radius:20px; box-shadow:var(--shadow); background:transparent}
.tagline-tilt{display:inline-block;transform:rotate(-6deg);background:var(--accent);color:white;padding:10px 14px;border-radius:14px;margin-top:18px;font-weight:800;box-shadow:var(--shadow)}
.section{padding:40px 0}
.block{background:transparent;border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.center{text-align:center}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.button{display:inline-block;padding:12px 16px;border-radius:12px;background:var(--accent);color:white;font-weight:800;border:0;box-shadow:var(--shadow)}
.button:hover{filter:brightness(.95)}
.badge{display:inline-block;background:transparent;border:var(--border);padding:6px 10px;border-radius:999px;color:var(--accent)}
.pdf{background:transparent;border:var(--border);border-radius:var(--radius);padding:10px;box-shadow:var(--shadow)}
.notice{background:transparent;border:var(--border);padding:14px 16px;border-radius:12px;margin-top:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.card{background:transparent;border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.product{display:flex;flex-direction:column;align-items:center;text-align:center}
.product img{width:min(420px,86%);height:auto;border-radius:16px;border:var(--border);background:transparent}
.price{font-weight:900;margin:6px 0}
@media (max-width:640px){
  .hero{padding:60px 0 24px}
  .hero img.hero-logo{max-width: 300px}
}

/* How-To poster sizing */
.pdf img{max-width:900px;width:100%;height:auto;display:block;margin:0 auto;border-radius:16px;}
