/* The Horse Tavern & Grill - one shared stylesheet for every page.
   Heritage tavern broadsheet: parchment canvas, forest green + oxblood + brass.
   Edit the tokens here once and the whole site follows. */
:root{
  --parch:#efe6d2;      /* page canvas */
  --parch-2:#e6d9bd;    /* raised panels */
  --ink:#211d18;        /* body text / charcoal */
  --ink-soft:#4a4034;   /* secondary text */
  --green:#163a2b;      /* forest green - dark bands + headings */
  --green-soft:#1e4a36;
  --oxblood:#6e1f24;    /* deep red - links + buttons + accents */
  --char:#1c1813;       /* darkest - footer + crest */
  --brass:#c8962a;      /* gold - used as fill / on dark only */
  --brass-ink:#7d5a14;  /* darkened brass for accent TEXT on parchment */
  --rule:#c9b48a;       /* hairlines */
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem;
  --sp-5:1.5rem; --sp-6:2rem; --sp-7:3rem; --sp-8:4rem; --sp-9:6rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background-color:var(--parch); color:var(--ink);
  font-family:'Inter',system-ui,Arial,sans-serif; font-size:1.0625rem; line-height:1.6; text-align:left}
.wrap{max-width:1100px; margin-inline:auto; padding-inline:var(--sp-5)}
.content{max-width:66ch}
.prose{max-width:62ch}
.prose p{color:var(--ink-soft)}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif; color:var(--green); line-height:1.07; margin:0 0 var(--sp-4); font-weight:700}
h1{font-size:clamp(2.6rem,6.2vw,4.5rem); letter-spacing:-.01em}
h2{font-size:2.25rem}
h3{font-size:1.5rem}
p{margin:0 0 var(--sp-4)}
a{color:var(--oxblood); text-underline-offset:3px}
a:hover{color:var(--green)}
a:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--oxblood); outline-offset:3px}
.skip{position:absolute; left:-999px}
.skip:focus{left:var(--sp-4); top:var(--sp-4); background-color:var(--char); color:var(--parch); padding:var(--sp-3) var(--sp-4); z-index:5}
.eyebrow{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.22em; font-size:.8125rem; font-weight:600; color:var(--brass-ink); margin:0 0 var(--sp-3)}
.label{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.08em; font-weight:600}
.eyebrow.on-dark{color:var(--brass); background-color:var(--green)}

/* header / nav */
.site-head{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-4); padding:var(--sp-4) var(--sp-5); background-color:var(--parch); border-bottom:3px double var(--green)}
.brand{display:flex; align-items:center; gap:var(--sp-3); text-decoration:none; color:var(--green)}
.brand-mark{width:46px; height:46px; color:var(--oxblood); flex:none}
.brand-name{font-family:'Playfair Display',serif; font-weight:900; font-size:1.5rem; color:var(--green); line-height:1; display:block}
.brand-sub{display:block; font-family:'Oswald',sans-serif; font-size:.8125rem; letter-spacing:.12em; text-transform:uppercase; color:var(--brass-ink); margin-top:3px}
.nav{display:flex; flex-wrap:wrap; gap:var(--sp-4)}
.nav a{font-family:'Oswald',sans-serif; color:var(--ink); text-decoration:none; font-size:.9375rem; letter-spacing:.06em; text-transform:uppercase; padding:var(--sp-1) 0; border-bottom:2px solid transparent}
.nav a:hover{color:var(--oxblood); border-bottom-color:var(--brass)}
.nav a[aria-current="page"]{color:var(--oxblood); border-bottom-color:var(--oxblood)}

/* buttons */
.btn{display:inline-block; font-family:'Oswald',sans-serif; font-weight:600; font-size:.9375rem; letter-spacing:.06em; text-transform:uppercase; background-color:var(--oxblood); color:var(--parch); padding:var(--sp-3) var(--sp-5); border:2px solid var(--oxblood); border-radius:2px; text-decoration:none; cursor:pointer}
.btn:hover{background-color:var(--green); color:var(--brass); border-color:var(--green)}
.btn-ghost{background-color:var(--parch); color:var(--green); border:2px solid var(--green)}
.btn-ghost:hover{background-color:var(--green); color:var(--parch)}
.btn-row{display:flex; flex-wrap:wrap; gap:var(--sp-3); margin-top:var(--sp-5)}

/* intro masthead (asymmetric) */
.intro{display:grid; grid-template-columns:1.4fr .85fr; gap:var(--sp-7); align-items:center; padding:var(--sp-9) 0}
.lede{font-size:1.25rem; color:var(--ink-soft)}
.intro .lede{max-width:46ch}
.crest{background-color:var(--char); color:var(--parch); border:2px solid var(--brass); border-radius:5px; padding:var(--sp-6); display:flex; flex-direction:column; align-items:center; gap:var(--sp-4)}
.crest .seal{width:160px; height:160px}
.crest .brand-mark{width:54px; height:54px; color:var(--brass); background-color:var(--char)}
.crest p{color:var(--parch); background-color:var(--char); text-align:left; margin:0}
.crest .stat{font-family:'Playfair Display',serif; font-size:1.5rem; color:var(--brass); background-color:var(--char)}

/* bands + rules */
.band{padding:var(--sp-8) 0}
.band-tight{padding:var(--sp-7) 0}
hr.rule{height:0; border:0; border-top:3px double var(--rule); margin:var(--sp-7) 0}
.lead-head{display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-5); flex-wrap:wrap; margin-bottom:var(--sp-6)}

/* events bill (dark green chalkboard) */
.bill{background-color:var(--green); color:var(--parch); padding:var(--sp-9) 0}
.bill h2{color:var(--brass); background-color:var(--green)}
.bill .lede{color:var(--parch); background-color:var(--green)}
.bill ul{list-style:none; margin:var(--sp-5) 0 0; padding:0}
.bill li{display:grid; grid-template-columns:5.5rem 1fr auto; gap:var(--sp-4); align-items:baseline; padding:var(--sp-4) 0; border-bottom:1px solid var(--green-soft)}
.bill li .day{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.08em; color:var(--brass); background-color:var(--green)}
.bill li .act{font-family:'Playfair Display',serif; font-size:1.25rem; color:var(--parch); background-color:var(--green)}
.bill li .time{font-family:'Oswald',sans-serif; color:var(--brass); background-color:var(--green); text-align:right}
.bill li .act small{display:block; font-family:'Inter',sans-serif; font-size:.9375rem; color:var(--parch); background-color:var(--green)}

/* signature dishes (auto-fit, unclassed children) */
.signs{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:var(--sp-5)}
.signs>article{background-color:var(--parch); border:1.5px solid var(--rule); border-radius:5px; padding:var(--sp-5)}
.signs>article h3{margin:0 0 var(--sp-2); font-size:1.5rem}
.signs>article p{margin:0; color:var(--ink-soft); font-size:.9375rem}

/* menu */
.menu-wrap>div{margin-bottom:var(--sp-8)}
.menu-list{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(265px,1fr)); gap:var(--sp-4) var(--sp-7)}
.menu-list>li{border-bottom:1px solid var(--rule); padding-bottom:var(--sp-3)}
.menu-list>li b{font-family:'Playfair Display',serif; font-weight:600; font-size:1.25rem; display:block}
.menu-list>li span{display:block; color:var(--ink-soft); font-size:.9375rem}
.special{background-color:var(--green); color:var(--parch); border-radius:5px; padding:var(--sp-6); margin-bottom:var(--sp-7)}
.special h2{color:var(--brass); background-color:var(--green); font-size:1.5rem}
.special p{color:var(--parch); background-color:var(--green); margin:0}

/* 1757 timeline */
.timeline{list-style:none; margin:0; padding:0; border-left:3px solid var(--rule)}
.timeline>li{position:relative; padding:0 0 var(--sp-6) var(--sp-6)}
.timeline>li b{font-family:'Oswald',sans-serif; color:var(--oxblood); letter-spacing:.06em; display:block; font-size:1.25rem}
.timeline>li span{display:block; color:var(--ink-soft)}

/* visit / info */
.visit{display:grid; grid-template-columns:1.1fr .9fr; gap:var(--sp-7); align-items:start}
.infocard{background-color:var(--parch-2); border:2px solid var(--green); border-radius:5px; padding:var(--sp-6)}
.infocard h2{font-size:1.5rem}
.dl{margin:0}
.dl div{display:flex; justify-content:space-between; gap:var(--sp-4); padding:var(--sp-3) 0; border-bottom:1px dashed var(--rule)}
.dl dt{font-family:'Oswald',sans-serif; letter-spacing:.04em; color:var(--green)}
.dl dd{margin:0; color:var(--ink-soft); text-align:right}
.maplink{display:block; border:2px solid var(--char); border-radius:5px; padding:var(--sp-6); background-color:var(--char); color:var(--parch); text-decoration:none}
.maplink b{color:var(--brass); background-color:var(--char); font-family:'Playfair Display',serif; font-size:1.5rem; display:block; margin-bottom:var(--sp-2)}
.maplink span{color:var(--parch); background-color:var(--char)}

/* form */
.inquiry{background-color:var(--parch-2); border:2px solid var(--green); border-radius:5px; padding:var(--sp-6)}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4)}
.form-grid>div{display:flex; flex-direction:column; gap:var(--sp-1)}
.form-grid>div.wide{grid-column:1 / -1}
label{font-family:'Oswald',sans-serif; letter-spacing:.03em; font-size:.9375rem}
input,select,textarea{font:inherit; padding:var(--sp-3); border:1.5px solid var(--green); border-radius:3px; background-color:var(--parch); color:var(--ink)}
::placeholder{color:var(--ink-soft)}
.form-note{color:var(--ink-soft); font-size:.9375rem; margin-top:var(--sp-4)}

/* footer */
.site-foot{background-color:var(--char); color:var(--parch); padding:var(--sp-8) 0 var(--sp-6); margin-top:var(--sp-9)}
.foot-cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--sp-6)}
.site-foot h2{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.08em; font-size:1.25rem; color:var(--brass); background-color:var(--char); margin:0 0 var(--sp-3)}
.foot-cols p{margin:0 0 var(--sp-2); color:var(--parch); background-color:var(--char)}
.site-foot a{color:var(--brass); background-color:var(--char)}
.site-foot a:hover{color:var(--parch); background-color:var(--char)}
.foot-fine{margin-top:var(--sp-6); padding-top:var(--sp-4); border-top:1px solid #3a3024; color:var(--parch); background-color:var(--char); font-size:.8125rem}

@media (max-width:760px){
  .intro,.visit,.form-grid{grid-template-columns:1fr}
  .site-head{flex-direction:column; align-items:flex-start}
  .bill li{grid-template-columns:4.5rem 1fr; }
  .bill li .time{text-align:left; grid-column:2}
  h2{font-size:1.75rem}
  .dl dd{text-align:left}
}
