/* ===== Tokens ===== */
:root{
  --paper:      #EAE3D0;
  --paper-dark: #DCD2B4;
  --ink:        #2A2820;
  --olive:      #454D22;
  --olive-deep: #333A19;
  --stamp-red:  #A8342A;
  --khaki-line: #B9AE8D;

  --display: 'Big Shoulders Stencil', sans-serif;
  --body: 'Public Sans', sans-serif;
  --mono: 'IBM Plex Mono', monospace;
}

*{ margin:0; padding:0; box-sizing:border-box; }

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  line-height:1.6;
  background-image:
    linear-gradient(var(--paper), var(--paper)),
    repeating-linear-gradient(0deg, rgba(0,0,0,0.015) 0px, transparent 1px, transparent 2px);
}

.wrap{ max-width:1080px; margin:0 auto; padding:0 24px; }

a{ color:inherit; }

.eyebrow{
  font-family:var(--mono);
  font-size:0.75rem;
  letter-spacing:0.14em;
  color:var(--olive);
  font-weight:600;
  text-transform:uppercase;
}
.eyebrow.center{ text-align:center; }

h1,h2,h3{
  font-family:var(--display);
  font-weight:900;
  letter-spacing:0.01em;
  text-transform:uppercase;
  color:var(--olive-deep);
  line-height:1.05;
}

/* ===== CTA button ===== */
.cta{
  display:inline-block;
  background:var(--stamp-red);
  color:var(--paper);
  font-family:var(--mono);
  font-weight:600;
  letter-spacing:0.04em;
  text-decoration:none;
  padding:14px 28px;
  border:2px solid var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  transition:transform 0.12s ease, box-shadow 0.12s ease;
}
.cta:hover{ transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink); }

/* ===== Topbar ===== */
.topbar{ background:var(--olive-deep); border-bottom:3px solid var(--ink); }
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; }
.brand{ font-family:var(--display); font-weight:900; letter-spacing:0.08em; color:var(--paper); font-size:1.2rem; }
.topbar-cta{ padding:8px 18px; font-size:0.8rem; box-shadow:3px 3px 0 var(--ink); }

/* ===== Hero ===== */
.hero{ background:var(--olive); border-bottom:3px solid var(--ink); padding:64px 0; }
.hero-grid{ display:grid; grid-template-columns:1.3fr 0.8fr; gap:48px; align-items:center; }
.hero-copy .eyebrow{ color:var(--paper); }
.hero h1{
  color:var(--paper);
  font-size:clamp(2.2rem, 5vw, 3.4rem);
  margin:14px 0 18px;
}
.hero-sub{ color:var(--paper-dark); max-width:46ch; margin-bottom:26px; font-size:1.05rem; }
.hero-note{ color:var(--paper-dark); font-family:var(--mono); font-size:0.85rem; margin-top:16px; }
.hero-note strong{ color:var(--stamp-red); }

.hero-visual{ display:flex; justify-content:center; }
.case-stamp{
  width:220px; height:220px;
  border:4px solid var(--paper-dark);
  border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px;
  transform:rotate(-8deg);
  color:var(--paper-dark);
  font-family:var(--mono);
  text-align:center;
  padding:20px;
}
.case-stamp span{ font-size:0.65rem; letter-spacing:0.12em; }
.case-stamp strong{ font-family:var(--display); font-size:1.3rem; color:var(--paper); letter-spacing:0.05em; }

/* ===== Sections ===== */
.section{ padding:72px 0; border-bottom:1px solid var(--khaki-line); }
.section-title{ font-size:clamp(1.8rem,4vw,2.6rem); margin:10px 0 12px; }
.section-title.center{ text-align:center; }
.section-sub{ max-width:56ch; margin:0 auto 40px; color:#524d3d; }
.section-sub.center{ text-align:center; }

/* ===== Agent / dossier ===== */
.agent-grid{ display:grid; grid-template-columns:0.9fr 1.4fr; gap:40px; align-items:start; }
.dossier{
  background:var(--paper-dark);
  border:2px solid var(--ink);
  padding:24px;
}
.dossier-label{ font-family:var(--mono); font-size:0.7rem; letter-spacing:0.14em; color:var(--stamp-red); font-weight:600; }
.dossier-name{ font-size:1.8rem; margin:8px 0 6px; }
.dossier-role{ font-family:var(--mono); font-size:0.8rem; color:#524d3d; }
.agent-copy p{ margin-bottom:14px; max-width:62ch; }

/* ===== Manifest ===== */
.manifest-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px,1fr));
  gap:2px;
  background:var(--ink);
  border:2px solid var(--ink);
}
.manifest-item{
  background:var(--paper);
  padding:26px 22px;
  position:relative;
}
.manifest-item .tag{
  font-family:var(--mono);
  font-weight:600;
  font-size:0.75rem;
  color:var(--paper);
  background:var(--olive);
  padding:3px 8px;
  display:inline-block;
  margin-bottom:12px;
}
.manifest-item h3{ font-size:1.15rem; margin-bottom:8px; text-transform:none; }
.manifest-item p{ font-size:0.92rem; color:#524d3d; }

/* ===== Guide / bonuses ===== */
.guide-grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:start; }
.guide h2{ font-size:clamp(1.6rem,3.6vw,2.2rem); margin:10px 0 14px; }
.guide p{ max-width:58ch; }
.bonus-stack{ display:flex; flex-direction:column; gap:16px; }
.bonus-card{ background:var(--paper-dark); border-left:5px solid var(--stamp-red); padding:18px 20px; }
.bonus-label{ font-family:var(--mono); font-size:0.7rem; letter-spacing:0.1em; color:var(--stamp-red); font-weight:600; margin-bottom:6px; }
.bonus-card h3{ font-size:1rem; text-transform:none; margin-bottom:6px; }
.bonus-card p{ font-size:0.88rem; color:#524d3d; }

/* ===== Guarantee ===== */
.guarantee{ background:var(--olive-deep); border-bottom:3px solid var(--ink); }
.guarantee-grid{ display:grid; grid-template-columns:auto 1fr; gap:36px; align-items:center; }
.stamp-badge{
  width:130px; height:130px; border-radius:50%;
  border:4px solid var(--paper-dark);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:var(--paper);
  transform:rotate(-6deg);
  flex-shrink:0;
}
.stamp-badge span{ font-family:var(--display); font-size:2rem; line-height:1; }
.stamp-badge strong{ font-family:var(--mono); font-size:0.7rem; letter-spacing:0.12em; margin-top:4px; }
.guarantee h2{ color:var(--paper); font-size:clamp(1.6rem,3.6vw,2.2rem); margin-bottom:12px; }
.guarantee p{ color:var(--paper-dark); max-width:62ch; }

/* ===== Pricing ===== */
.pricing-inner{ text-align:center; }
.price-old{ font-family:var(--mono); text-decoration:line-through; color:#8a836a; margin-top:14px; }
.price-new{ font-family:var(--display); font-size:clamp(2.6rem,7vw,4rem); color:var(--stamp-red); }
.price-new span{ font-family:var(--mono); font-size:0.9rem; color:var(--ink); text-transform:none; display:block; margin-top:4px; }
.price-note{ max-width:52ch; margin:16px auto 28px; color:#524d3d; }
.price-note strong{ color:var(--stamp-red); }

/* ===== Footer ===== */
.site-footer{ background:var(--ink); color:var(--paper-dark); padding:36px 0; }
.footer-inner{ text-align:center; font-size:0.8rem; }
.disclosure{ max-width:60ch; margin:0 auto 14px; }
.links a{ text-decoration:none; margin:0 4px; }
.links a:hover{ text-decoration:underline; }
.support{ margin-top:10px; opacity:0.7; }

/* ===== Responsive ===== */
@media (max-width:760px){
  .hero-grid, .agent-grid, .guide-grid, .guarantee-grid{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; }
  .case-stamp{ width:170px; height:170px; }
}

/* ===== Accessibility ===== */
a:focus-visible, .cta:focus-visible{ outline:3px solid var(--stamp-red); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){
  .cta{ transition:none; }
}