:root {
  --vino:#741f2b; --vino-2:#55151f; --oro:#c79b43; --crema:#fbf7ef;
  --tinta:#2b2526; --muted:#70686a; --line:#ddd3c6;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#eee8df; color:var(--tinta); font:15px/1.6 Arial,"Segoe UI",sans-serif; }
.page { max-width:1080px; margin:28px auto; background:#fff; box-shadow:0 12px 36px #4b34241c; }
.cover { min-height:720px; padding:90px 76px; background:linear-gradient(135deg,var(--vino-2),var(--vino)); color:#fff; display:flex; flex-direction:column; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:14px; font-weight:700; letter-spacing:.08em; }
.seal { width:44px; height:44px; border:2px solid var(--oro); border-radius:50%; display:grid; place-items:center; color:var(--oro); font-family:Georgia,serif; font-size:24px; }
.cover h1 { font:700 72px/1 Georgia,serif; margin:0; color:#fff; }
.cover h2 { max-width:720px; font-size:27px; font-weight:400; margin:24px 0; color:#fff; border:0; padding:0; }
.cover .meta { color:#f1dfb8; }
.content { padding:60px 76px; }
h1,h2,h3 { color:var(--vino-2); line-height:1.25; }
h2 { margin-top:54px; padding-top:12px; border-top:1px solid var(--line); }
h3 { margin-top:30px; }
.lead { font-size:20px; color:#4b4244; }
.toc { columns:2; column-gap:32px; }
.toc h2 { column-span:all; }
.toc a { display:block; color:var(--vino); text-decoration:none; padding:4px 0; }
.label { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.confirmed { background:#e5f2ea; color:#286548; }
.recommended { background:#fbefcf; color:#7c5715; }
.pending { background:#f5e6e8; color:#7a1f2b; }
.callout { border-left:4px solid var(--oro); background:var(--crema); padding:16px 20px; margin:22px 0; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.card { border:1px solid var(--line); border-radius:10px; padding:16px; break-inside:avoid; }
.card h3 { margin:0 0 8px; }
table { border-collapse:collapse; width:100%; margin:18px 0; font-size:13px; }
th,td { padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
th { background:var(--crema); color:var(--vino-2); }
code { background:#f5f0e8; padding:2px 5px; border-radius:4px; }
.flow { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:20px 0; }
.flow span { background:var(--crema); border:1px solid var(--line); padding:7px 10px; border-radius:6px; }
.flow b { color:var(--oro); }
.mock-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.mock-grid a { display:block; border:1px solid var(--line); border-radius:10px; overflow:hidden; color:var(--tinta); text-decoration:none; }
.mock-grid img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; object-position:top; background:#eee; }
.mock-grid .caption { display:block; padding:10px 12px; }
.small { color:var(--muted); font-size:13px; }
.footer { padding:24px 76px; background:var(--crema); color:var(--muted); font-size:12px; }
@media (max-width:720px) {
  .page { margin:0; }
  .cover { min-height:560px; padding:52px 26px; }
  .cover h1 { font-size:52px; }
  .cover h2 { font-size:21px; }
  .content { padding:38px 24px; }
  .grid,.mock-grid { grid-template-columns:1fr; }
  .toc { columns:1; }
}
@media print {
  body { background:#fff; font-size:10.5pt; }
  .page { max-width:none; margin:0; box-shadow:none; }
  .cover { min-height:95vh; page-break-after:always; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
  .content { padding:12mm 16mm; }
  .toc { page-break-after:always; }
  table,.card,.callout { break-inside:avoid; }
  .mock-grid { grid-template-columns:repeat(2,1fr); }
  a { color:inherit; text-decoration:none; }
  .footer { display:none; }
}
