/* ==========================================================================
   The Roscommon Constabulary — site stylesheet
   Palette drawn from the R.I.C. itself: rifle-green uniform cloth,
   brass insignia, and register paper.
   ========================================================================== */

:root{
  --rifle:       #17301f;   /* R.I.C. rifle-green */
  --rifle-deep:  #0e2015;
  --rifle-soft:  #24452f;
  --paper:       #f5f3ea;   /* register paper */
  --card:        #fffdf5;
  --ink:         #262419;
  --ink-soft:    #5b584a;
  --brass:       #96762b;   /* badge brass */
  --brass-deep:  #74591c;
  --rule:        #ddd6c2;   /* ledger rules */
  --focus:       #2c6e49;
  --max:         1080px;
  --measure:     70ch;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Source Serif 4", Georgia, "Times New Roman", serif;
  font-size:1.0625rem;
  line-height:1.65;
  /* Sticky footer: page always fills the window; <main> absorbs the
     spare space so the footer sits at the bottom even on short pages */
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

img{ max-width:100%; height:auto; }

a{ color:var(--brass-deep); text-decoration-thickness:1px; text-underline-offset:2px; }
a:hover{ color:var(--rifle-soft); }
:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; }

h1,h2,h3{
  font-family:"Libre Caslon Text", "Iowan Old Style", Georgia, serif;
  font-weight:700;
  line-height:1.2;
  color:var(--rifle-deep);
  letter-spacing:.01em;
}
h2{ font-size:1.7rem; margin:2.2rem 0 .8rem; }
h3{ font-size:1.2rem; margin:1.8rem 0 .5rem; }

p{ max-width:var(--measure); }
ul,ol{ max-width:var(--measure); padding-left:1.4rem; }
li{ margin:.3rem 0; }

.container{ width:min(92%, var(--max)); margin-inline:auto; }

/* --------------------------------------------------------------- masthead */
.masthead{
  background:var(--rifle-deep);
  color:#f2efe2;
  border-bottom:3px solid var(--brass);
}
.masthead .container{
  display:flex; align-items:center; gap:1rem;
  padding:1rem 0 .9rem;
}
.masthead img.badge{
  height:72px; width:auto; flex:none;
}
.masthead .titles{ min-width:0; }
.masthead .eyebrow{
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color:#c9bd8f; margin:0 0 .15rem;
}
.masthead h1{
  color:#f7f4e6; margin:0; font-size:clamp(1.35rem, 4vw, 2.1rem);
}
.masthead h1 a{ color:inherit; text-decoration:none; }
.masthead .dates{
  font-family:"Source Sans 3", system-ui, sans-serif;
  color:#a9bfa4; font-size:.85rem; margin:.15rem 0 0;
}

/* --------------------------------------------------------------- nav */
.nav{
  background:var(--rifle);
  position:sticky; top:0; z-index:20;
  font-family:"Source Sans 3", system-ui, sans-serif;
}
.nav .container{ display:flex; align-items:center; flex-wrap:wrap; }
.nav a{
  color:#e8e4d2; text-decoration:none;
  padding:.65rem .8rem; font-size:.95rem; letter-spacing:.02em;
  border-bottom:3px solid transparent;
}
.nav a:hover{ color:#fff; border-bottom-color:var(--brass); }
.nav a[aria-current="page"]{ color:#fff; border-bottom-color:var(--brass); font-weight:600; }
.nav .menu-toggle{ display:none; }

@media (max-width: 720px){
  .nav .menu-toggle{
    display:block; background:none; border:0; color:#e8e4d2;
    font:inherit; font-size:1rem; padding:.7rem .4rem; cursor:pointer;
    width:100%; text-align:left; letter-spacing:.05em;
  }
  .nav ul{ display:none; width:100%; margin:0; padding:0 0 .4rem; }
  .nav.open ul{ display:block; }
  .nav ul li{ list-style:none; margin:0; }
  .nav a{ display:block; }
}
@media (min-width: 721px){
  .nav ul{ display:flex; margin:0; padding:0; list-style:none; flex-wrap:wrap; max-width:none; }
}

/* --------------------------------------------------------------- hero */
.hero{
  position:relative; color:#fff;
  background:var(--rifle-deep);
}
.hero img{
  display:block; width:100%; height:min(52vh, 460px); object-fit:cover;
  object-position:center right; opacity:.55;
}
.hero .overlay{
  position:absolute; inset:0; display:flex; align-items:flex-end;
  background:linear-gradient(180deg, rgba(14,32,21,.15) 30%, rgba(14,32,21,.85) 100%);
}
.hero .overlay .container{ padding-bottom:1.6rem; }
.hero p.lede{
  font-family:"Libre Caslon Text", Georgia, serif;
  font-size:clamp(1.05rem, 2.4vw, 1.45rem); line-height:1.45;
  max-width:34em; margin:.4rem 0;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
}
.hero p.credit{
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.78rem; color:#cfc9ae; margin:.2rem 0 0;
  text-shadow:0 1px 4px rgba(0,0,0,.6);
}

/* --------------------------------------------------------------- layout */
main{ padding:1.2rem 0 3rem; flex:1 0 auto; }
.page-title{
  border-bottom:2px solid var(--rule);
  padding:1.4rem 0 .9rem; margin-bottom:.4rem;
}
.page-title h2{ margin:0; font-size:clamp(1.5rem, 3.5vw, 2rem); }
.page-title p.sub{
  margin:.35rem 0 0; color:var(--ink-soft);
  font-family:"Source Sans 3", system-ui, sans-serif; font-size:.95rem;
}

/* service-number chip — the register motif used across the site */
.sn{
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-variant-numeric:tabular-nums;
  font-size:.8em; font-weight:600; letter-spacing:.04em;
  color:var(--brass-deep);
  border:1px solid var(--brass);
  border-radius:3px; padding:0 .35em;
  white-space:nowrap;
}

/* cards */
.cards{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:1rem; margin:1.6rem 0; padding:0; list-style:none; max-width:none;
}
.cards li{ margin:0; }
.cards a{
  display:block; height:100%;
  background:var(--card);
  border:1px solid var(--rule); border-top:3px solid var(--brass);
  border-radius:4px; padding:1rem 1.1rem 1.1rem;
  text-decoration:none; color:var(--ink);
  transition:transform .12s ease, box-shadow .12s ease;
}
.cards a:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(23,48,31,.12); }
.cards h3{ margin:.1rem 0 .35rem; font-size:1.05rem; }
.cards p{ margin:0; font-size:.92rem; color:var(--ink-soft);
  font-family:"Source Sans 3", system-ui, sans-serif; }

/* stats strip */
.stats{
  display:flex; flex-wrap:wrap; gap:1rem; margin:1.6rem 0;
  padding:0; list-style:none; max-width:none;
}
.stats li{
  flex:1 1 180px; margin:0;
  background:var(--card); border:1px solid var(--rule);
  border-left:4px solid var(--rifle); border-radius:4px;
  padding:.8rem 1rem;
}
.stats .num{
  display:block;
  font-family:"Libre Caslon Text", Georgia, serif;
  font-size:1.7rem; color:var(--rifle-deep); font-variant-numeric:tabular-nums;
}
.stats .lbl{
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.82rem; color:var(--ink-soft); letter-spacing:.03em;
}

/* ledger tables */
table.ledger{
  border-collapse:collapse; width:100%; margin:1.2rem 0;
  background:var(--card); border:1px solid var(--rule);
  font-size:.95rem;
}
table.ledger caption{
  text-align:left; font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.85rem; color:var(--ink-soft); padding:.4rem 0;
}
table.ledger th{
  background:var(--rifle); color:#f2efe2; text-align:left;
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-weight:600; font-size:.82rem; letter-spacing:.06em; text-transform:uppercase;
  padding:.55rem .7rem;
}
table.ledger td{
  border-top:1px solid var(--rule); padding:.5rem .7rem; vertical-align:top;
}
table.ledger tr:nth-child(even) td{ background:#faf8ef; }
table.ledger td.num{ font-variant-numeric:tabular-nums;
  font-family:"Source Sans 3", system-ui, sans-serif; }

.table-scroll{ overflow-x:auto; }

/* search / register */
.register-controls{
  display:flex; flex-wrap:wrap; gap:.7rem; align-items:center;
  margin:1.2rem 0 .4rem;
  font-family:"Source Sans 3", system-ui, sans-serif;
}
.register-controls input[type="search"]{
  flex:1 1 260px; font:inherit; font-size:1rem;
  padding:.55rem .8rem; border:1px solid var(--rule); border-radius:4px;
  background:var(--card); color:var(--ink);
}
.register-controls input[type="search"]:focus{ border-color:var(--brass); }
.register-count{ font-size:.9rem; color:var(--ink-soft); }
.register-more{ margin:1rem 0 0; }

/* gallery */
.gallery{ display:grid; gap:1.6rem; margin:1.4rem 0; max-width:none; }
.gallery figure{
  margin:0; background:var(--card); border:1px solid var(--rule);
  border-radius:4px; padding:.7rem;
}
.gallery img{ display:block; width:100%; border-radius:2px; }
.gallery figcaption{
  padding:.6rem .2rem .1rem; font-size:.92rem; color:var(--ink-soft);
  font-family:"Source Sans 3", system-ui, sans-serif;
}
@media (min-width:760px){
  .gallery.two{ grid-template-columns:1fr 1fr; }
}

/* buttons */
.button{
  display:inline-block; font-family:"Source Sans 3", system-ui, sans-serif;
  background:var(--rifle); color:#fff; text-decoration:none;
  padding:.5rem 1rem; border-radius:4px; border:0; font-size:.95rem;
  cursor:pointer;
}
.button:hover{ background:var(--rifle-soft); color:#fff; }
.button.brass{ background:var(--brass-deep); }
.button.brass:hover{ background:var(--brass); }

/* districts */
.district{ margin:2.2rem 0; }
.district h3{
  border-bottom:2px solid var(--rule); padding-bottom:.35rem;
}
.station-list{
  list-style:none; padding:0; margin:.8rem 0;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr));
  gap:.4rem .9rem; max-width:none;
  font-family:"Source Sans 3", system-ui, sans-serif; font-size:.98rem;
}
.station-list li{ margin:0; padding:.35rem .2rem; border-bottom:1px dotted var(--rule); }
.station-list .nopic{ color:var(--ink-soft); }
.district-jump{
  display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; padding:0; max-width:none;
  font-family:"Source Sans 3", system-ui, sans-serif;
}
.district-jump a{
  display:inline-block; background:var(--card); border:1px solid var(--rule);
  border-radius:99px; padding:.3rem .9rem; text-decoration:none; font-size:.9rem;
}

/* article / biography pages */
article.record{ max-width:var(--measure); }
article.record .meta{
  font-family:"Source Sans 3", system-ui, sans-serif;
  color:var(--ink-soft); font-size:.92rem; margin:.2rem 0 1.4rem;
}
blockquote{
  margin:1.2rem 0; padding:.2rem 1.2rem;
  border-left:3px solid var(--brass);
  color:var(--ink-soft); font-style:italic; max-width:var(--measure);
}
figure.inline{
  margin:1.5rem 0; max-width:420px;
}
figure.inline img{ border:1px solid var(--rule); border-radius:3px; }
figure.inline figcaption{
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.85rem; color:var(--ink-soft); padding-top:.4rem;
}

/* notice */
.note{
  background:var(--card); border:1px solid var(--rule); border-left:4px solid var(--brass);
  border-radius:4px; padding:.7rem 1rem; margin:1.4rem 0;
  font-family:"Source Sans 3", system-ui, sans-serif; font-size:.93rem;
  max-width:var(--measure);
}

/* footer */
footer.site{
  background:var(--rifle-deep); color:#cfc9ae;
  border-top:3px solid var(--brass);
  font-family:"Source Sans 3", system-ui, sans-serif; font-size:.9rem;
  margin-top:2rem;
  flex-shrink:0;
}
footer.site .container{
  padding:1.4rem 0; display:flex; flex-wrap:wrap; gap:.6rem 2rem;
  justify-content:space-between;
}
footer.site a{ color:#e4dec4; }
footer.site p{ margin:0; }

/* print */
@media print{
  .nav, .hero, footer.site{ display:none; }
  body{ background:#fff; }
}

/* --------------------------------------------------------------- lightbox */
.lightbox{
  position:fixed; inset:0; z-index:100;
  background:rgba(14,32,21,.94);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  padding:max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
  cursor:zoom-out;
}
.lightbox[hidden]{ display:none; }
.lightbox figure{
  margin:0; max-width:100%; max-height:100%;
  display:flex; flex-direction:column; align-items:center; min-height:0;
}
.lightbox img{
  max-width:100%; max-height:78vh; object-fit:contain;
  border-radius:3px; box-shadow:0 10px 40px rgba(0,0,0,.5);
  background:#fff;
}
.lightbox figcaption{
  color:#e8e4d2; font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:.95rem; padding-top:.7rem; text-align:center;
}
.lightbox-close{
  position:absolute; top:max(.8rem, env(safe-area-inset-top)); right:.9rem;
  background:var(--brass-deep); color:#fff; border:0; border-radius:4px;
  font-family:"Source Sans 3", system-ui, sans-serif; font-size:1.05rem;
  padding:.55rem 1rem; cursor:pointer;
}
.lightbox-close:hover{ background:var(--brass); }
