@font-face { font-family: "Libre Baskerville"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(fonts/libre-baskerville.woff2) format("woff2"); }
@font-face { font-family: "Almarai"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/almarai-400.woff2) format("woff2"); }
@font-face { font-family: "Almarai"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/almarai-700.woff2) format("woff2"); }
:root { --ink: #2d2a24; --muted: #6b6457; --cream: #faf6ec; --card: #fffdf7; --line: rgba(90, 70, 40, .18);
  --blue: #6fa6f6; --blue-dk: #2f68b8; --green: #4a5d3a; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--cream); color: var(--ink); font: 17px/1.55 "Almarai", "Helvetica Neue", Arial, sans-serif; }
h1, h2, h3, .reserve-q { font-family: "Libre Baskerville", Georgia, serif; font-weight: 400; }
a { color: var(--blue-dk); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.top { padding: 14px 20px; border-bottom: 1px solid var(--line); background: #fff; }
.back { text-decoration: none; font-weight: 700; font-size: .95em; }
.wrap { max-width: 960px; margin: 0 auto; padding: 28px 20px 12px; }
.brand { display: flex; align-items: center; gap: 22px; margin-bottom: 22px; }
.logo { width: 128px; height: 128px; flex: none; }
h1 { font-size: 2.1em; line-height: 1.2; margin: 0 0 .3em; }
.lead { margin: 0; color: var(--muted); font-size: 1.05em; }
.reserve { background: var(--blue); color: #fff; border-radius: 18px; padding: 20px 22px; margin: 0 0 26px;
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px 20px; }
.reserve-q { font-size: 1.45em; margin: 0; grid-column: 1; }
.reserve-line { margin: 0; font-size: 1.15em; grid-column: 1; }
.reserve .tel { color: #fff; font-weight: 700; white-space: nowrap; }
.reserve-btns { grid-column: 2; grid-row: 1 / span 2; display: flex; gap: 10px; }
.btn { display: inline-block; min-width: 96px; text-align: center; padding: 12px 18px; border-radius: 999px; background: #fff;
  color: var(--blue-dk); font-weight: 700; text-decoration: none; }
.btn-alt { background: transparent; color: #fff; border: 2px solid #fff; }
.thisweek { background: var(--card); border: 1px solid var(--line); border-left: 6px solid var(--green); border-radius: 16px;
  padding: 16px 20px; margin: 0 0 24px; }
.tw-label { margin: 0 0 .25em; font-size: .85em; letter-spacing: .08em; text-transform: uppercase; color: var(--green);
  font-family: "Almarai", sans-serif; font-weight: 700; }
.tw-text { margin: 0; font-family: "Libre Baskerville", Georgia, serif; font-size: 1.3em; line-height: 1.4; }
.next-title { font-size: 1.3em; margin: 0 0 .5em; }
.weeks { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.weeks li { padding: 12px 2px; border-bottom: 1px solid var(--line); }
.wk { font-weight: 700; margin-right: .35em; }
.msg { grid-column: 1 / -1; margin: 0; color: var(--muted); }
.note { color: var(--muted); font-size: .9em; margin: 18px 0 4px; }
.updated { color: var(--muted); font-size: .8em; margin: 0; opacity: .8; }
.foot { max-width: 960px; margin: 24px auto 0; padding: 18px 20px 30px; border-top: 1px solid var(--line); color: var(--muted); font-size: .9em; }
.foot p { margin: .4em 0 0; }
@media (max-width: 600px) {
  body { font-size: 16px; }
  .brand { gap: 14px; }
  .logo { width: 84px; height: 84px; }
  h1 { font-size: 1.6em; }
  .reserve { grid-template-columns: 1fr; padding: 18px; }
  .reserve-btns { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .btn { flex: 1; }
  .tw-text { font-size: 1.15em; }
}
