/* Holidays in the Bible: page styles. The shell and editorial tokens come from
   research.css; the section patterns follow judaism-christianity-islam.css so
   the two guides read as one family. Status colours are the site's existing
   chart palette, validated with the dataviz checks in this order. */
.holidays-page{
  --jewish:#765a22;--christian:#8b4d42;--islamic:#3f7058;
  --s-torah:#D2691E;--s-hebrew-bible:#0B9E90;--s-deuterocanon:#7A3E8E;--s-nt-told:#B8860B;
  --s-nt-named:#1F8FBF;--s-event-also-bible:#B23A3A;--s-themes-later:#5A4FCF;--s-none:#8A8171;
}
.holidays-page main{padding-top:28px;padding-bottom:64px}
.holidays-page .research-hero h1{max-width:none}
.holidays-page .research-hero{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.holidays-page .research-hero .page-art{width:100%}
.holidays-page .research-hero .page-art img{width:100%;height:auto;aspect-ratio:1200/630;max-height:none;object-fit:cover}

/* scope, orientation, section headers */
.scope-panel{display:grid;grid-template-columns:130px minmax(0,1fr);gap:26px;margin:0 0 20px;padding:22px 0;border-block:1px solid var(--line)}
.scope-panel h2{font:500 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.scope-panel p{margin:0;color:var(--ink-2);line-height:1.75}
.scope-panel p+p{margin-top:10px}
.section-kicker{display:block;margin-bottom:9px;font:500 10px/1.4 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--accent)}
.orientation{padding:42px 0 34px;border-top:1px solid var(--line)}
.orientation h2,.holiday-group>header h2,.prose-section>header h2,.year-section>header h2,.directory-section>header h2,.verses-section>header h2,.method-section h2,.faq-section h2{font:400 36px/1.18 var(--serif);letter-spacing:-.02em}
.orientation-intro{margin:12px 0 25px;color:var(--ink-2);font-size:16px;line-height:1.8}
.orientation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.orientation-card{padding:22px 0;border-top:1px solid var(--line-2)}
.orientation-card.jewish{border-color:var(--jewish)}
.orientation-card.christian{border-color:var(--christian)}
.orientation-card.islamic{border-color:var(--islamic)}
.orientation-card h3{margin-bottom:8px;font:400 26px/1.25 var(--serif)}
.orientation-card p{color:var(--ink-2);font-size:15px;line-height:1.8}
.holidays-page .research-nav{margin:24px 0 36px}

.holiday-group,.prose-section,.year-section,.directory-section,.verses-section{padding:42px 0;border-top:1px solid var(--line)}
.holiday-group>header,.prose-section>header,.year-section>header,.directory-section>header,.verses-section>header{display:grid;grid-template-columns:72px minmax(0,1fr);gap:24px;margin-bottom:26px}
.group-number{font:italic 28px/1.25 var(--serif);color:var(--accent)}
.group-intro{margin-top:8px;color:var(--ink-2);line-height:1.75;font-size:17px}
.group-prose{margin:0 0 30px}
.group-prose p,.prose p{color:var(--ink-2);line-height:1.8;margin-bottom:18px;font-size:15.5px}
.prose h3{font:400 24px/1.3 var(--serif);margin:30px 0 12px}
.prose h3:first-child{margin-top:0}
a.src{font:10px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);text-decoration:none;white-space:nowrap}
a.src:hover{color:var(--accent);text-decoration:underline}

/* holiday cards */
.holiday-cards{display:grid;gap:22px}
.holiday-card{border-block:1px solid var(--line);padding:22px 0 20px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.holiday-card+.holiday-card{border-top:0}
.card-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:4px}
.card-head h3{font:400 26px/1.25 var(--serif)}
.card-head .also{font:italic 14px/1.4 var(--serif);color:var(--ink-3)}
.card-head .badges{flex-basis:100%}
.badges{display:flex;flex-wrap:wrap;gap:6px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px 3px 7px;border:1px solid var(--line-2);border-radius:999px;font:500 10.5px/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);background:color-mix(in srgb,var(--card) 60%,transparent)}
.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.badge-torah::before{background:var(--s-torah)}
.badge-hebrew-bible::before{background:var(--s-hebrew-bible)}
.badge-deuterocanon::before{background:var(--s-deuterocanon)}
.badge-nt-told::before{background:var(--s-nt-told)}
.badge-nt-named::before{background:var(--s-nt-named)}
.badge-event-also-bible::before{background:var(--s-event-also-bible)}
.badge-themes-later::before{background:var(--s-themes-later)}
.badge-none::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--s-none)}
.holiday-card p{margin:0;color:var(--ink-2);font-size:14.5px;line-height:1.75}
.holiday-card p strong{font:500 10px/1.6 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-right:6px}
.card-summary{font-size:16px!important;color:var(--ink)!important;line-height:1.7!important}
.card-note{padding:12px 16px;border-left:3px solid var(--line-2);background:var(--card-2);border-radius:0 4px 4px 0;font-size:14px!important}
.card-passages a{overflow-wrap:anywhere}
.card-passages .parallel{color:var(--ink-3)}
.card-sources{margin-left:8px;font:10px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);text-decoration:none}
.card-sources:hover{color:var(--accent);text-decoration:underline}
.card-more{justify-self:start;margin-top:6px;font-size:13px;text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:3px}

/* year chart */
.year-chart{margin:0 0 18px}
.year-chart-canvas{overflow-x:auto;padding-bottom:6px}
.year-chart-canvas svg{display:block;min-width:760px;width:100%;height:auto;font-family:var(--sans)}
.year-chart-canvas .lane-band{fill:color-mix(in srgb,var(--card-2) 55%,transparent)}
.year-chart-canvas .lane-band.alt{fill:transparent}
.year-chart-canvas .lane-label{font:500 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;fill:var(--ink-3)}
.year-chart-canvas .month{font:11px var(--sans);fill:var(--ink-3)}
.year-chart-canvas .month-line{stroke:var(--line);stroke-width:1}
.year-chart-canvas .mark,.year-chart-canvas .span{pointer-events:none}
.year-chart-canvas .mark{stroke:var(--bg);stroke-width:2}
.year-chart-canvas .mark.none{fill:var(--bg);stroke:var(--s-none);stroke-width:1.5}
.year-chart-canvas .span{stroke:var(--bg);stroke-width:2;rx:4;opacity:.85}
.year-chart-canvas .mark-label{font:11px var(--sans);fill:var(--ink-2);pointer-events:none}
.year-chart-canvas .hit{fill:transparent;cursor:default}
.year-chart-canvas .hit:hover+.mark,.year-chart-canvas .hit:focus-visible+.mark{stroke:var(--ink);stroke-width:2}
.year-chart-canvas .hit:focus-visible{outline:none}
.year-chart figcaption{margin:12px 0 0;font:italic 14px/1.6 var(--serif);color:var(--ink-2)}
.year-legend span{display:inline-flex;align-items:center;gap:7px}
.year-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.year-legend .l-torah i{background:var(--s-torah)}
.year-legend .l-hebrew-bible i{background:var(--s-hebrew-bible)}
.year-legend .l-deuterocanon i{background:var(--s-deuterocanon)}
.year-legend .l-nt-told i{background:var(--s-nt-told)}
.year-legend .l-nt-named i{background:var(--s-nt-named)}
.year-legend .l-event-also-bible i{background:var(--s-event-also-bible)}
.year-legend .l-themes-later i{background:var(--s-themes-later)}
.year-legend .l-none i{background:transparent;box-shadow:inset 0 0 0 1.5px var(--s-none)}
.chart-tip{position:absolute;z-index:5;max-width:280px;padding:10px 12px;border:1px solid var(--line-2);border-radius:5px;background:var(--card);color:var(--ink);font:13px/1.5 var(--sans);box-shadow:0 4px 18px rgba(38,34,27,.12);pointer-events:none}
.chart-tip b{display:block;font:400 17px/1.3 var(--serif)}
.chart-tip small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:3px}
.chart-tip .badges{margin-top:6px}
.year-chart-wrap{position:relative}

/* dates and directory tables */
.dates-table caption,.directory-table caption{caption-side:top;text-align:left;padding:0 0 14px;color:var(--ink-3);font-size:12.5px;line-height:1.65}
.research-table td small{display:block;margin-top:4px;color:var(--ink-3);font-size:12px}
.directory-table td:first-child a:not(.row-more){font:400 17px/1.3 var(--serif);color:var(--ink);text-decoration:none}
.directory-table td:first-child a:not(.row-more):hover{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.directory-table .badges{gap:4px}
.directory-table .badge{padding:2px 7px 2px 6px;font-size:9.5px}
.directory-table td:last-child a{overflow-wrap:anywhere}
.row-more{font-size:12px;text-decoration:none;border-bottom:1px solid var(--line-2)}
.directory-controls{display:grid;grid-template-columns:1.6fr 1fr 1.2fr;gap:20px;align-items:end;margin:0 0 20px;padding:22px;background:var(--card-2);border:1px solid var(--line);border-radius:6px}
.directory-controls label{display:grid;gap:8px;font:11px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.directory-controls input,.directory-controls select{width:100%;min-width:0;min-height:44px;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);padding:10px;color:var(--ink);font:14px var(--sans);letter-spacing:0;text-transform:none}
#directory-status{grid-column:1/-1;font-size:12px;color:var(--ink-3)}
#directory-empty{padding:36px 0;color:var(--ink-2)}

/* verses */
.verses-section .group-intro a{color:var(--accent)}
.vlist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 32px;margin-top:8px}
.vc{position:relative;min-width:0;overflow-wrap:anywhere;border-top:1px solid var(--line-2);padding:16px 0 36px;display:flex;flex-direction:column;gap:8px}
.vc-top{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.vc-ref{font:400 20px/1.25 var(--serif);color:var(--ink);text-decoration:none}
.vc-ref:hover{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.vc-n{font:10.5px var(--mono);letter-spacing:.06em;color:var(--ink-3)}
.vc-mem{margin-left:auto;font:500 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:2px}
.vc-mem:hover{border-color:var(--accent)}
.vc-t{font:italic 17px/1.65 var(--serif);color:var(--ink);margin:0}
.vc-c{font-size:13.5px;line-height:1.7;color:var(--ink-2);margin:0}
/* version switcher (attached by /verse-switcher.js) */
.vswitch{margin:0 0 22px;font-size:13.5px;color:var(--ink-2)}
.vswitch label{display:block;max-width:100%}
.vswitch select{margin-left:6px;min-height:40px;max-width:100%;padding:8px 10px;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);color:var(--ink);font:14px var(--sans)}
.vswitch-credit{margin:6px 0 0;font-size:12px;color:var(--ink-3)}
.vc-share{position:absolute;right:0;bottom:8px}

/* FAQ, method, sources, cite */
.faq-section,.method-section{padding:48px 0;border-top:1px solid var(--line)}
.faq-section details{border-bottom:1px solid var(--line);padding:20px 0}
.faq-section summary{cursor:pointer;font:400 23px/1.35 var(--serif)}
.faq-section details p{padding-top:13px;color:var(--ink-2);line-height:1.75}
.method-grid{display:grid;grid-template-columns:1fr;gap:26px;margin:12px 0 24px}
.method-grid>div>p{line-height:1.8;color:var(--ink-2);margin:0 0 18px}
.method-note{padding:20px;border-left:3px solid var(--accent);background:var(--card-2);color:var(--ink-2);font-size:13.5px;line-height:1.75}
.source-disclosure{margin:0}
.sources{counter-reset:source;columns:2;column-gap:48px;padding-left:0;list-style:none}
.sources li:not(.source-group){position:relative;counter-increment:source;break-inside:avoid;margin-bottom:12px;padding-left:31px;color:var(--ink-2);font-size:13px;line-height:1.65}
.sources li:not(.source-group)::before{content:"[" counter(source) "]";position:absolute;left:0;top:.15em;font:10px/1.65 var(--mono);color:var(--ink-3)}
.sources a{overflow-wrap:anywhere}
.source-group{column-span:all;margin:20px 0 10px;font:500 10px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.source-group:first-child{margin-top:0}
.editorial-note{margin-top:28px;padding-top:20px;border-top:1px solid var(--line);color:var(--ink-3);font-size:12px;line-height:1.7}
.cite{margin-top:28px;padding:20px 22px;border:1px solid var(--line);border-radius:6px;background:color-mix(in srgb,var(--card) 70%,transparent)}
.cite h3{font:400 22px/1.3 var(--serif);margin-bottom:10px}
.cite p{color:var(--ink-2);font-size:13.5px;line-height:1.7;margin:0 0 8px}
.cite code{font:12px var(--mono);color:var(--ink);overflow-wrap:anywhere;white-space:normal}
[hidden]{display:none!important}

@media(max-width:900px){
  .orientation-grid{grid-template-columns:1fr}
  .directory-controls{grid-template-columns:1fr 1fr}
  .vlist{grid-template-columns:1fr}
  .sources{columns:1}
}
@media(max-width:600px){
  .holidays-page main{padding-top:18px;padding-bottom:40px}
  .holidays-page .research-hero h1{font-size:40px}
  .scope-panel{grid-template-columns:1fr;gap:8px}
  .orientation,.holiday-group,.prose-section,.year-section,.directory-section,.verses-section,.faq-section,.method-section{padding:34px 0}
  .orientation h2,.holiday-group>header h2,.prose-section>header h2,.year-section>header h2,.directory-section>header h2,.verses-section>header h2,.method-section h2,.faq-section h2{font-size:30px}
  .holiday-group>header,.prose-section>header,.year-section>header,.directory-section>header,.verses-section>header{grid-template-columns:1fr;gap:5px}
  .card-head h3{font-size:23px}
  .directory-controls{grid-template-columns:1fr;padding:16px}
  .directory-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .directory-table,.directory-table tbody,.directory-table tr,.directory-table td{display:block;width:100%}
  .directory-table tr{margin:0 0 14px;border:1px solid var(--line);border-radius:5px;background:var(--card);overflow:hidden}
  .directory-table td{border-bottom:1px solid var(--line);padding:11px 14px}
  .directory-table td:last-child{border-bottom:0}
  .directory-table td::before{content:attr(data-label);display:block;margin-bottom:5px;font:500 9px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
  .directory-section .research-table-wrap{overflow:visible}
}

/* year switcher and today line */
.year-controls,.dates-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 16px;font-size:13.5px;color:var(--ink-2)}
.year-controls label,.dates-controls label{display:inline-flex;align-items:center;gap:8px}
.year-controls select,.dates-controls select{min-height:38px;padding:6px 10px;border:1px solid var(--line-2);border-radius:4px;background:var(--bg);color:var(--ink);font:14px var(--sans)}
.year-controls button{min-width:38px;min-height:38px;padding:0 12px;border:1px solid var(--line-2);border-radius:4px;background:var(--card);color:var(--accent);font:14px var(--sans);cursor:pointer}
.year-controls button:hover{border-color:var(--accent)}
.year-controls .year-prev,.year-controls .year-next{font-size:20px;line-height:1}
.year-status,.dates-status{color:var(--ink-3);font-size:12.5px}
.year-chart-canvas .today line{stroke:var(--ink);stroke-width:1.2;stroke-dasharray:3 3}
.year-chart-canvas .today text{font:500 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;fill:var(--ink)}

/* Shared research composition for the overview and dedicated guides. */
.holidays-page .research-hero h1{text-wrap:balance}
.holidays-page .holiday-card{padding:28px 0;gap:28px;align-items:start}
.holidays-page .holiday-card:has(.holiday-card-art){grid-template-columns:minmax(220px,.8fr) minmax(0,1.4fr)}
.holiday-card-art{display:block;min-width:0}
.holiday-card-art img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border-radius:6px}
.holiday-card-copy{min-width:0;display:grid;gap:10px}
.holiday-card-copy h3{text-wrap:balance}
.holidays-page .orientation-card{background:var(--card-2);padding:24px;border-radius:4px}
.holidays-page .research-table-wrap{max-height:none}
.holidays-page .year-chart{padding:24px;border:1px solid var(--line);border-radius:6px;background:color-mix(in srgb,var(--bg) 55%,white)}
@media(max-width:900px){
 .holidays-page .research-hero{grid-template-columns:1fr;gap:24px}
 .holidays-page .research-hero .page-art{max-width:640px}
}
@media(max-width:600px){
 .holidays-page .holiday-card:has(.holiday-card-art){grid-template-columns:1fr;gap:18px}
 .holidays-page .year-chart{padding:14px}
}
