/* ============================================================
   191 ENCINITAS — guest sheet (/guide)

   A single article page a guest opens from the confirmation email
   and prints. Everything visual comes from styles.css tokens; this
   file only sets the article measure, the checklist, and the print
   rules that strip the site chrome back to a clean sheet.
   ============================================================ */

.guide{
  padding-top:calc(78px + clamp(2.5rem,6vw,5rem));
  padding-bottom:var(--band);
  padding-inline:var(--pad);
  background:var(--paper);
}

/* 68ch keeps a line short enough to read in one sweep, on screen and
   on paper both. */
.guide__in{max-width:68ch;margin-inline:auto}

.guide__head{border-bottom:1px solid var(--ink);padding-bottom:clamp(1.75rem,4vw,2.5rem)}
.guide__title{margin-bottom:1rem}
.guide__lede{max-width:46ch}
.guide__print{margin:1.75rem 0 0}

.guide__sec{padding-top:clamp(1.75rem,4vw,2.75rem)}
.guide__h{
  font-size:.75rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);margin:0 0 .9rem;
}

.guide__facts{margin-bottom:1.25rem}

.guide__list{margin:0;display:grid;gap:.85rem}
.guide__list li{padding-left:1.1rem;position:relative}
.guide__list li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:5px;height:5px;border-radius:50%;background:var(--accent);
}

/* An empty box beats a bullet here: the list is meant to be ticked off,
   on paper with a pen if that is how the day is going. */
.guide__check{margin:0;display:grid;gap:.6rem}
.guide__check li{display:flex;align-items:flex-start;gap:.7rem;font-weight:600;color:var(--ink)}
.guide__check li::before{
  content:"";flex:0 0 auto;margin-top:.28em;
  width:14px;height:14px;border:1.5px solid var(--ink);border-radius:3px;
}

.guide__near{margin:0;border-top:1px solid var(--ink)}
.guide__near li{
  display:flex;justify-content:space-between;gap:1.5rem;align-items:baseline;
  padding:.6rem 0;border-bottom:1px solid var(--line-soft);
}
.guide__near li span:first-child{color:var(--ink);font-weight:600}
.guide__near li span:last-child{
  flex:0 0 auto;font-size:.6875rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
}

.guide__fine{margin-top:1.1rem;font-size:.8125rem;color:var(--muted);letter-spacing:.02em}

.guide__sign{
  margin:clamp(2.5rem,6vw,4rem) 0 0;padding-top:1.25rem;border-top:1px solid var(--line);
  font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}

/* ---------------- print ----------------
   What prints is the sheet, not the website: no fixed header, no dark
   footer eating a third of a page in toner, no button telling paper to
   print itself, and no bone-coloured background flooding the page. */
@page{margin:18mm}

@media print{
  .nav,.foot,.guide__print,.btn,.skip{display:none !important}

  html,body{background:#fff;color:#000}

  .guide{padding:0;background:#fff}
  .guide__in{max-width:none}

  /* The screen hero is sized for a 1440px viewport and would take the top
     third of the sheet on its own. */
  .guide__title{font-size:26pt;line-height:1.05;margin-bottom:.4rem}
  .guide__lede{font-size:10.5pt;max-width:none}
  .guide__head{padding-bottom:10pt;border-bottom:1px solid #000}

  body{font-size:9.5pt;line-height:1.42}
  p{margin-bottom:.5em}

  .guide__sec{padding-top:11pt}
  .guide__h{font-size:8pt;margin-bottom:5pt;color:#000}

  .facts>div{padding:3pt 0}
  .facts dt,.guide__near li span:last-child{color:#000;font-size:7.5pt}
  .facts dd{font-size:9pt}

  .guide__list{gap:.35rem}
  .guide__check{grid-template-columns:1fr 1fr;gap:.35rem .75rem}
  .guide__near li{padding:2.5pt 0}
  .guide__sign{margin-top:12pt;padding-top:6pt;font-size:7.5pt;color:#000}

  /* A heading stranded at the foot of a sheet, or a list split across two,
     is the one thing that makes a printed sheet hard to follow. */
  h1,h2{break-after:avoid;page-break-after:avoid}
  ul,ol,dl,.guide__sec{break-inside:avoid;page-break-inside:avoid}

  /* No "(https://…)" tails appended to links. */
  a{text-decoration:none;color:#000}
  a::after{content:none}
}