/* Block-editor markup → Front Door styles.
   Pages are built from core blocks carrying the mockup's class names
   (Advanced → Additional CSS class). base.css styles those classes; this file
   covers where core blocks' markup differs from the mockup's. */

:where(.entry) figure { margin: 0; }
/* Core gives images a bottom margin; the design spaces them itself */
:where(.entry) .wp-block-image { margin: 0; }
.wp-block-image.person__img { margin-bottom: 1rem; }
.entry h2:not([class*="h2"]):not([class*="h3"]) { font-family: 'Lequire', 'Montserrat', sans-serif; font-weight: 400; text-transform: uppercase; font-size: clamp(1.9rem, 3.4vw, 2.9rem); line-height: 1; margin-bottom: 1rem; }
.entry h3:not([class]) , .entry h3.wp-block-heading:not([class*="h3"]):not([class*="__"]) { font-size: 1.2rem; font-weight: 700; line-height: 1.3; }
.entry :where(.wp-block-list:not([class*="res"])) { list-style: disc; padding-left: 1.25rem; }
.entry a:not([class]) { text-underline-offset: .2em; text-decoration-thickness: 1px; }
.entry a:not([class]):hover { text-decoration-color: var(--orange); text-decoration-thickness: 2px; }

/* ---------- buttons: default = primary, Outline = secondary, Text link = text ---------- */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; }
.wp-block-buttons.ctas, .entry .wp-block-buttons { margin-top: 1.75rem; }
.wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px;
  padding: .8rem 1.4rem; border-radius: var(--radius); border: 2px solid transparent;
  font: 700 .95rem/1.2 'Montserrat', 'Montserrat Fallback', system-ui, sans-serif; letter-spacing: .01em; text-decoration: none;
  background: var(--btn-bg); color: var(--btn-fg);
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.wp-block-button__link:hover { background: var(--peach); color: var(--btn-fg); }
.is-style-outline .wp-block-button__link { background: transparent; border-color: var(--btn2-line); color: var(--fg); }
.is-style-outline .wp-block-button__link:hover { background: var(--btn2-line); color: var(--bg); }
.is-style-text .wp-block-button__link { padding: 0; min-height: 0; border: 0; background: none; color: var(--link); text-decoration: underline; text-underline-offset: .3em; text-decoration-thickness: 2px; }
.is-style-text .wp-block-button__link:hover { background: none; text-decoration-color: var(--orange); }

/* ---------- text + image ---------- */
.b-text__copy .wp-block-heading { margin-bottom: 1.25rem; }

/* ---------- cards ---------- */
.card .wp-block-buttons { margin-top: auto; padding-top: .5rem; }
.card { border-top: 4px solid var(--orange); }
.card:nth-child(3n + 2) { border-top-color: var(--peach); }
.card:nth-child(3n) { border-top-color: var(--slate); }
/* 4 or 8 cards: rows of 2 or 4 so nothing is left alone on the last row,
   and the top bars run through all four colors of the header stripe. */
.b-cards__grid:has(> .card:nth-child(4n):last-child) { grid-template-columns: 1fr; gap: 2.5rem 2rem; }
@media (min-width: 640px) { .b-cards__grid:has(> .card:nth-child(4n):last-child) { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .b-cards__grid:has(> .card:nth-child(4n):last-child) { grid-template-columns: repeat(4, 1fr); } }
.b-cards__grid:has(> .card:nth-child(4n):last-child) > .card:nth-child(4n + 1) { border-top-color: var(--orange); }
.b-cards__grid:has(> .card:nth-child(4n):last-child) > .card:nth-child(4n + 2) { border-top-color: var(--peach); }
.b-cards__grid:has(> .card:nth-child(4n):last-child) > .card:nth-child(4n + 3) { border-top-color: var(--slate); }
.b-cards__grid:has(> .card:nth-child(4n):last-child) > .card:nth-child(4n) { border-top-color: var(--charcoal); }

/* ---------- accordion (Details blocks) ---------- */
/* The +/− is two bars drawn as backgrounds, so opening can turn the + a half
   turn while its upright bar shrinks away into a −, instead of swapping glyphs. */
.acc summary::after { content: ''; flex: none; width: 16px; height: 16px; background: linear-gradient(currentColor, currentColor) center / 16px 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 16px no-repeat; transition: transform .4s cubic-bezier(.32, .72, 0, 1), background-size .4s cubic-bezier(.32, .72, 0, 1); }
.acc[open] summary::after { transform: rotate(180deg); background-size: 16px 2px, 2px 0; }
.acc--js:not(.acc--open) summary::after { transform: none; background-size: 16px 2px, 2px 16px; }
.acc > :not(summary) { max-width: 70ch; }
.acc > :not(summary):last-child { padding-bottom: 1.5rem; }
.acc > p + p, .acc > summary + p { margin-top: 0; }
/* JS-enhanced motion: the outer wrapper's height animates, so it carries no
   padding; the inner one holds the spacing the container rules gave the item. */
.acc.acc--js > .acc__body { padding: 0; overflow: clip; }
.acc__inner { display: flow-root; padding-bottom: 1.5rem; }
.acc__inner > p:first-child { margin-top: 0; }
.acc > p + p { margin-top: 1em; }

/* ---------- facts ---------- */
.b-facts .fact { border-top: 2px solid var(--line); padding-top: 1rem; }
.fact__k { font-size: .9rem; font-weight: 600; color: var(--muted); }
.fact__v { font-size: 1.3rem; font-weight: 700; line-height: 1.3; margin-top: .25rem !important; }

/* ---------- quote ---------- */
.wp-block-quote.b-quote { border: 0; padding: 0; text-align: center; max-width: 52rem; margin-inline: auto; }
.b-quote p { font-size: clamp(1.35rem, 2.6vw, 2rem); line-height: 1.4; font-weight: 500; }
.b-quote p::before { content: '“'; } .b-quote p::after { content: '”'; }
.b-quote cite { display: block; margin-top: 1rem; font-style: normal; font-weight: 700; color: var(--muted); }

/* ---------- people ---------- */
.person__img img { aspect-ratio: 2 / 3; object-fit: cover; }
.person__role { margin-top: .2rem !important; }
.person__email { margin-top: .6rem !important; }
.person__email a { font-weight: 700; font-size: .9rem; text-underline-offset: .3em; }

/* ---------- lists in blocks ---------- */
.b-links .wp-block-list { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 1.25rem; list-style: none; padding: 0; }
.b-covenant .wp-block-list, .b-list .wp-block-list { list-style: none; padding: 0; }
.b-covenant li .refs { display: block; margin-top: .25rem; }

/* ---------- resources ---------- */
.res-jump .wp-block-list { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; }
.res__sites { list-style: none; padding: 0; }
.book__cover a { display: block; }
.book__link { margin-top: .35rem !important; }
.book__link a { font-size: .9rem; font-weight: 700; text-underline-offset: .3em; text-decoration-thickness: 2px; text-decoration-color: var(--orange); }

/* ---------- embeds ---------- */
.wp-block-embed iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius); }
.wp-block-embed__wrapper { position: relative; }
.b-video .wp-block-heading { margin-bottom: 1.5rem; }

/* Images placed into a text block keep the design's cut corner */
.ofc-page .b-text__media { clip-path: polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%); }
.ofc-page .b-text__media img { border-radius: 0; }
.ofc-page .b-text.is-flipped .b-text__media { clip-path: polygon(var(--cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut)); }

/* ---------- partner logos (Who we are) ---------- */
/* Like the live site: a full-width charcoal band with the partners' white icons. */
.b-logos { background: var(--charcoal); color: var(--white); margin-inline: calc(50% - 50vw); padding: clamp(3.5rem, 7vw, 5.5rem) max(var(--gutter), calc(50vw - 620px)); text-align: center; --focus: var(--orange); }
.b-logos .h2 { color: var(--white); }
.b-logos .logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 2.5rem; margin-top: 2.5rem; }
.b-logos .logo { display: grid; justify-items: center; gap: 1rem; }
.b-logos .logo__img { margin: 0; }
.b-logos .logo__img img { height: 84px; width: auto; }
.b-logos .logo__name a { color: var(--white); font-weight: 700; text-underline-offset: .3em; }
.ofc-page:has(> .b-logos:last-child) { padding-bottom: 0; } /* the band meets the Join band below */

/* ---------- Formation Night schedule ([formation_schedule], from Bre's sheet) ---------- */
.b-sched > .h2 { margin-bottom: 1.5rem; }
.sched { list-style: none; padding: 0; margin: 0; }
.sched__item { display: grid; grid-template-columns: 4.5rem 1fr; gap: 1.25rem; padding: 1.5rem 0; border-top: 2px solid var(--line); }
.sched__item:last-child { border-bottom: 2px solid var(--line); }
.sched__item--next { border-top: 4px solid var(--orange); }
.sched__date time { display: grid; line-height: 1.1; }
.sched__dow { font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.sched__md { font-size: 1.35rem; font-weight: 800; margin-top: .2rem; }
.sched__tag { display: inline-block; margin-bottom: .5rem !important; padding: .2rem .55rem; border-radius: var(--radius); background: var(--orange); color: var(--charcoal); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sched__title { font-size: 1.2rem; font-weight: 700; line-height: 1.3; }
.sched__item--next .sched__title { font-size: clamp(1.3rem, 2.2vw, 1.6rem); }
.sched__sum { margin-top: .35rem !important; max-width: 66ch; }
.sched__meta { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin-top: .6rem !important; font-size: .95rem; color: var(--muted); }
.sched__meta b { font-weight: 700; color: var(--fg); margin-right: .25rem; }
/* A week off reads as a note, not a topic. */
.sched__item--off .sched__tag { background: var(--tint-2); }
.sched__item--off .sched__title, .sched__item--off .sched__md { color: var(--muted); }
.sched__item--off.sched__item--next { border-top-color: var(--slate); }
@media (min-width: 760px) { .sched__item { grid-template-columns: 6.5rem 1fr; gap: 2rem; padding: 1.75rem 0; } .sched__md { font-size: 1.6rem; } }

/* ---------- Events ([ofc_events], from Planning Center) ---------- */
/* Date-tile cards grouped by month; the tiles cycle through the header stripe's four colors. */
.b-events > .h2 { margin-bottom: .5rem; }
.evt-month { margin: 2rem 0 1rem; font-size: .85rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.evts { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
@media (min-width: 760px) { .evts { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; } }
.evt__link { display: flex; align-items: stretch; height: 100%; text-decoration: none; color: inherit; background: var(--tint); border-radius: var(--radius); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.evt__link:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(9, 10, 13, .1); }
.evt__date { flex: none; width: 5.75rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem .5rem; background: var(--orange); color: var(--charcoal); line-height: 1; text-align: center; }
.evt--c1 .evt__date { background: var(--peach); }
.evt--c2 .evt__date { background: var(--slate); color: var(--white); }
.evt--c3 .evt__date { background: var(--charcoal); color: var(--white); }
.evt__mon, .evt__dow { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.evt__day { font-family: 'Lequire', 'Montserrat', sans-serif; font-size: 2.6rem; margin: .3rem 0 .2rem; }
.evt__body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: .3rem; padding: 1.1rem 1.25rem; }
.evt__title { font-size: 1.1rem; font-weight: 700; line-height: 1.3; }
.evt__meta { font-size: .92rem; color: var(--muted); }
.evt__sum { font-size: .92rem; line-height: 1.5; }
.evt__rep { align-self: flex-start; margin-top: .2rem; padding: .15rem .55rem; border-radius: 999px; background: var(--white); font-size: .75rem; font-weight: 600; color: var(--muted); }
.evt__go { flex: none; width: 2.75rem; display: flex; align-items: center; justify-content: center; }
.evt__go::before { content: ''; width: .55rem; height: .55rem; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); opacity: .45; transition: opacity .2s, transform .2s; }
.evt__link:hover .evt__go::before { opacity: 1; transform: translateX(3px) rotate(45deg); }

/* "Every week": a charcoal band like the partner logos, weekday names in the display face. */
.b-weekly { background: var(--charcoal); color: var(--white); margin-inline: calc(50% - 50vw); padding: clamp(3rem, 6vw, 4.5rem) max(var(--gutter), calc(50vw - 620px)); --focus: var(--orange); }
.b-weekly .h2 { color: var(--white); margin-bottom: 2rem; }
.weekly { list-style: none; padding: 0; margin: 0; display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); background: var(--charcoal-3); border: 1px solid var(--charcoal-3); border-radius: var(--radius); overflow: hidden; }
.weekly__item { background: var(--charcoal); }
.weekly__item a { display: grid; align-content: start; gap: .35rem; height: 100%; padding: 1.5rem 1.6rem; color: var(--white); text-decoration: none; transition: background-color .2s; }
.weekly__item a:hover { background: var(--charcoal-2); }
.weekly__day { font-family: 'Lequire', 'Montserrat', sans-serif; font-size: clamp(1.8rem, 3vw, 2.3rem); text-transform: uppercase; line-height: 1; color: var(--orange); }
.weekly__time { font-weight: 700; }
.weekly__name { color: rgba(255, 255, 255, .75); }
.weekly__sum { margin-top: .4rem; font-size: .92rem; line-height: 1.5; color: rgba(255, 255, 255, .6); max-width: 46ch; }
.b-weekly__all { margin-top: 1.75rem !important; }
.b-weekly__all a { color: var(--white); font-weight: 700; text-underline-offset: .3em; text-decoration-thickness: 2px; text-decoration-color: var(--orange); }
.ofc-page:has(> .b-weekly:last-child) { padding-bottom: 0; } /* the band meets the Join band below */