/* Inner pages: shared pieces */
.section--tight { padding-top: 8px; }
.section--mist { position: relative; isolation: isolate; }
.muted { color: var(--ink-2); }
.mt { margin-top: 1.4em; }
.center-block { text-align: center; }
.center-block p { margin-left: auto; margin-right: auto; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.center-block .btn-row { justify-content: center; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: start; }
@media (max-width: 860px) { .two-col { grid-template-columns: 1fr; } }

/* Shabbat */
.now-card { margin-top: 28px; padding: 22px 24px; max-width: 520px; background: var(--glass); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: inset 0 0 0 1px var(--glass-ring), var(--glass-shadow); border-radius: var(--r-m); }
.now-card__h { font: 400 1.375rem/1.25 var(--display); color: var(--ink); margin: 0 0 14px; }
.now-card__times { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 0; }
.now-card dt { font: italic 500 1rem/1.3 var(--text); color: var(--cypress); margin-bottom: 4px; }
.now-card dd { margin: 0; font-size: 1.6rem; color: var(--ink); display: grid; }
.now-card dd > span:first-child { color: var(--candle-ink); }
.now-card dd small { font-size: .9rem; color: var(--ink-2); }
.steps { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: 0; }
.steps li { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 24px 0; box-shadow: inset 0 1px 0 var(--line); }
.steps time { font: 400 var(--s2)/1 var(--display); color: var(--cypress); }
.steps h3 { margin-bottom: .25em; }
.steps p { color: var(--ink-2); margin: 0; }
@media (max-width: 560px) { .steps li { grid-template-columns: 1fr; gap: 6px; } }
.faq { margin: 0; display: grid; gap: 22px; }
.faq dt { font: 700 1.1875rem/1.35 var(--text); margin-bottom: 4px; }
.faq dd { margin: 0; color: var(--ink-2); }
.times { width: 100%; border-collapse: collapse; margin: 8px 0 32px; font-size: 1rem; }
.times th, .times td { text-align: left; padding: 12px 10px 12px 0; box-shadow: inset 0 -1px 0 var(--line); font-variant-numeric: tabular-nums; vertical-align: top; }
.times thead th { font: italic 500 1rem/1.3 var(--text); color: var(--cypress); }
.times tbody th { font-weight: 700; }
@media (max-width: 480px) { .times { font-size: .9375rem; } .times th, .times td { padding-right: 6px; } }

/* Events */
.p-hero--events h1 { max-width: none; }
.cal-links { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 8px; }
.days--wide .day { grid-template-columns: minmax(150px, 240px) 1fr; }

/* Donate */
.give-ways { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 20px; }
.way { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; padding: 28px; border-radius: var(--r-m); background: var(--glass); color: var(--ink); text-decoration: none;
  box-shadow: inset 0 0 0 1px var(--glass-ring); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition: background-color .2s linear, transform .26s var(--out); }
.way:hover { background: var(--glass-2); color: var(--ink); transform: translateY(-2px); }
.way--main { background: var(--glass-2); box-shadow: inset 0 0 0 1px var(--glass-ring), inset 0 3px 0 var(--candle), var(--glass-shadow); }
.way__h { font: 400 var(--s2)/1.1 var(--display); }
.way__p { flex: 1; }
.give-q { margin-top: 28px; }
@media (max-width: 820px) { .give-ways { grid-template-columns: 1fr; } }

/* forms */
.form { display: grid; gap: 18px; padding: clamp(22px, 3vw, 32px); }
.field { display: grid; gap: 6px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 560px) { .field-row { grid-template-columns: 1fr; } }
.field label { font-weight: 700; font-size: 1rem; }
.opt { font-weight: 400; color: var(--ink-2); }
.field input, .field textarea { font: 400 1.0625rem/1.4 var(--text); color: var(--ink); background: var(--field); border: 0; border-radius: var(--r-s); padding: 12px 14px; min-height: 48px;
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--ink) 24%, transparent); transition: box-shadow .15s linear; width: 100%; }
.field input:focus, .field textarea:focus { outline: none; box-shadow: inset 0 0 0 2px var(--cypress); }
.field [aria-invalid="true"] { box-shadow: inset 0 0 0 2px #A4442E; }
.form__err { color: #8E3826; font-weight: 500; margin: 0; }
.form__note { font-size: .9rem; color: var(--ink-2); margin: 0; }
.form .btn { justify-self: start; }
