/* ============================================================
   BINOBAN — Press / print documents  (true A4, brand-accurate)
   Brand: Navy #263d69 · Gold #b58750 / star #cda366 · Paper #f3f1ea · Ink #141413
   ============================================================ */
@font-face{font-family:"Lato";font-weight:400;src:url("fonts/Lato-Regular.ttf") format("truetype");}
@font-face{font-family:"Lato";font-weight:700;src:url("fonts/Lato-Bold.ttf") format("truetype");}
@font-face{font-family:"Lato";font-weight:900;src:url("fonts/Lato-Black.ttf") format("truetype");}
@font-face{font-family:"Lato";font-weight:300;src:url("fonts/Lato-Light.ttf") format("truetype");}

:root{
  --navy:#263d69; --navy-deep:#0a1730; --gold:#b58750; --gold-bright:#cda366; --gold-deep:#8a5f30;
  --paper:#f3f1ea; --paper-2:#e9e6dc; --ink:#141413; --ink-soft:#54514a; --line:#d8d3c6;
  --purple:#5754b5; --plum:#634367; --green:#366924;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{ font-family:"Lato",system-ui,sans-serif; color:var(--ink);
  -webkit-print-color-adjust:exact; print-color-adjust:exact; }

/* ---- The A4 sheet: exact size, one per printed page ---- */
.page{
  width:210mm; height:297mm; padding:18mm 17mm;
  background:var(--paper); position:relative; overflow:hidden;
  display:flex; flex-direction:column;
  break-after:page; page-break-after:always; break-inside:avoid;
}
.page:last-child{ break-after:auto; page-break-after:auto; }
.page.cover{ background:var(--navy); color:var(--paper); }
.page.navy{ background:var(--navy); color:var(--paper); }
.page-body{ flex:1 1 auto; min-height:0; }

/* ---- Toolbar (screen only) ---- */
.doc-toolbar{ position:sticky; top:0; z-index:20; display:flex; gap:14px; align-items:center; justify-content:center;
  padding:12px; background:rgba(10,23,48,.96); color:#f3f1ea; font-size:13px; }
.doc-toolbar button{ font-family:inherit; font-weight:700; font-size:12.5px; letter-spacing:.03em; padding:9px 18px; border-radius:7px;
  border:1px solid var(--gold-bright); background:var(--gold); color:#0a1322; cursor:pointer; }
.doc-toolbar span{ opacity:.7; }

@media screen{
  body{ background:#cfcabd; }
  .pagewrap{ padding:22px 0 40px; }
  .page{ margin:0 auto 20px; box-shadow:0 14px 44px rgba(0,0,0,.20); }
}
@media print{
  .doc-toolbar{ display:none !important; }
  .pagewrap{ padding:0; }
  .page{ margin:0; box-shadow:none; }
}
@page{ size:A4; margin:0; }

/* ---- Brand motifs ---- */
.orbit{ position:absolute; border-radius:50%; border:1px solid var(--gold); opacity:.16; pointer-events:none; }
.cover .orbit,.navy .orbit{ border-color:var(--gold-bright); opacity:.20; }
.axis{ position:absolute; background:var(--gold); opacity:.14; pointer-events:none; }
.starwm{ position:absolute; pointer-events:none; }

/* ---- Type & components ---- */
.brandbar{ display:flex; align-items:center; gap:14px; }
.brandbar img{ height:30px; }
.kicker{ font-weight:900; letter-spacing:.2em; text-transform:uppercase; font-size:10.5px; color:var(--gold-deep); margin:0; }
.cover .kicker,.navy .kicker{ color:var(--gold-bright); }
h1{ font-weight:900; letter-spacing:-.02em; line-height:1.02; margin:.18em 0; }
h2{ font-weight:900; letter-spacing:-.01em; margin:0 0 .45em; }
h3{ font-weight:900; margin:0 0 .3em; }
p{ line-height:1.55; }
.lead{ font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
.cover .lead,.navy .lead{ color:rgba(243,241,234,.82); }
hr.rule{ border:0; border-top:1px solid var(--line); margin:18px 0; }
.navy hr.rule,.cover hr.rule{ border-top-color:rgba(243,241,234,.18); }
.tag{ display:inline-block; font-weight:700; font-size:10.5px; letter-spacing:.05em; padding:5px 11px; border-radius:30px; border:1px solid var(--line); color:var(--ink-soft); }
.navy .tag,.cover .tag{ border-color:rgba(243,241,234,.28); color:rgba(243,241,234,.85); }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.grid3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:11px; }
.card{ border:1px solid var(--line); border-radius:10px; padding:15px 16px; background:#fff; }
.card h3{ font-size:13.5px; display:flex; align-items:center; gap:8px; }
.card p{ font-size:11.5px; line-height:1.45; color:var(--ink-soft); margin:0; }
.star{ width:13px; height:13px; flex:none; }
.foot{ flex:0 0 auto; margin-top:auto; display:flex; justify-content:space-between; align-items:center;
  font-size:10px; color:var(--ink-soft); border-top:1px solid var(--line); padding-top:9px; }
.navy .foot,.cover .foot{ color:rgba(243,241,234,.6); border-top-color:rgba(243,241,234,.18); }
.swrow{ display:flex; border-radius:10px; overflow:hidden; border:1px solid var(--line); }
.sw{ flex:1; height:84px; display:flex; align-items:flex-end; padding:8px; font-size:9.5px; font-weight:700; line-height:1.25; }
