/*
Theme Name: Speak Up One-Pager
Theme URI: https://speakupmag.org
Author: Speak Up
Description: The speakupmag.org placeholder — one page of ledger rows (a name on the left, text on the right, the longer parts folded). Design in theme.json; this file is mechanics only. Copy lives in the Home page.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: speakup-org
*/

html { scroll-behavior: smooth; }
:focus-visible { outline: 2px solid var(--wp--preset--color--brand); outline-offset: 3px; }

/* Header: sticky, logo left, anchor links + Donate right. */
.su-hdr { position: sticky; top: 0; z-index: 20; background: var(--wp--preset--color--paper); border-bottom: 1px solid var(--wp--preset--color--line); }
.admin-bar .su-hdr { top: 32px; }
.su-hdr .wp-block-site-logo img { height: 46px; width: auto; }
.su-hdr .wp-block-navigation a:hover { color: var(--wp--preset--color--brand); }
.su-hdr .wp-block-button__link { padding: 10px 18px; }

/* THE LEDGER — rows are Columns blocks (class su-ledger-row), folds are Details blocks. */
.su-ledger-row { border-top: 1px solid var(--wp--preset--color--line); padding: 68px 0 60px; margin-block: 0 !important; scroll-margin-top: 90px; }
.su-ledger-last { border-bottom: 1px solid var(--wp--preset--color--line); }
.su-ledger-row h2 { margin: 0; line-height: 1.15; }
.su-ledger-k { margin: 8px 0 0 !important; font-family: var(--wp--preset--font-family--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--faint); line-height: 1.5; }
.su-ledger-row .wp-block-column > * + * { margin-top: 22px; }
.su-ledger-row p { max-width: 62ch; }
.su-thumb { margin-top: 26px !important; max-width: 220px; }
.su-thumb img { aspect-ratio: 4 / 3; width: 100%; height: auto; object-fit: cover; border-radius: 3px; display: block; }
.su-thumb.su-thumb-top img { object-position: 50% 20%; }

.su-ledger-row .wp-block-details { margin: 0 !important; padding: 0; }
.su-ledger-row .wp-block-details:has(+ :not(.wp-block-details)),
.su-ledger-row .wp-block-details:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.wp-block-details summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 18px 0; font-weight: 500; font-size: 20px; line-height: 1.3; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-family: var(--wp--preset--font-family--mono); font-size: 20px; color: var(--wp--preset--color--brand); line-height: 1; flex: none; transition: transform .2s; }
.wp-block-details[open] > summary::after { transform: rotate(45deg); }
.wp-block-details[open] > summary { color: var(--wp--preset--color--brand); }
.wp-block-details > :not(summary):last-child { margin-bottom: 20px; }

/* Year lists (Milestones, In the news): a paragraph per item, the year in bold first. */
.su-years p { display: grid; grid-template-columns: 56px 1fr; gap: 14px; margin: 0 0 10px; max-width: none; }
.su-years p > strong:first-child { font-family: var(--wp--preset--font-family--mono); font-weight: 500; font-size: 13px; color: var(--wp--preset--color--brand); padding-top: 4px; }
.su-years p em { display: block; font-style: normal; font-family: var(--wp--preset--font-family--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--faint); }

/* Magazine fan: a Gallery block with class su-fan. Add, remove or reorder covers in the editor; up to 5 fan out. */
.wp-block-gallery.su-fan { display: block !important; position: relative; height: 215px; max-width: 300px; margin-top: 30px !important; }
.wp-block-gallery.has-nested-images.su-fan figure.wp-block-image { position: absolute !important; top: 18px; left: 30px; width: 114px !important; margin: 0 !important;
	transform-origin: 50% 100%; transition: transform .35s ease; box-shadow: 0 6px 18px rgba(28, 26, 23, .22); border-radius: 2px; overflow: hidden; }
.wp-block-gallery.has-nested-images.su-fan figure.wp-block-image img { aspect-ratio: 795 / 972; width: 100%; height: auto; object-fit: cover; display: block; }
.su-fan figure.wp-block-image:nth-child(1) { transform: translateX(0) rotate(-12deg); z-index: 1; }
.su-fan figure.wp-block-image:nth-child(2) { transform: translateX(24px) rotate(-4deg); z-index: 2; }
.su-fan figure.wp-block-image:nth-child(3) { transform: translateX(48px) rotate(2deg); z-index: 3; }
.su-fan figure.wp-block-image:nth-child(4) { transform: translateX(72px) rotate(8deg); z-index: 4; }
.su-fan figure.wp-block-image:nth-child(5) { transform: translateX(96px) rotate(14deg); z-index: 5; }
.su-fan:hover figure.wp-block-image:nth-child(1) { transform: translateX(-6px) rotate(-15deg); }
.su-fan:hover figure.wp-block-image:nth-child(2) { transform: translateX(22px) rotate(-6deg); }
.su-fan:hover figure.wp-block-image:nth-child(3) { transform: translateX(50px) rotate(3deg); }
.su-fan:hover figure.wp-block-image:nth-child(4) { transform: translateX(78px) rotate(11deg); }
.su-fan:hover figure.wp-block-image:nth-child(5) { transform: translateX(106px) rotate(19deg); }

/* Next meetings (blocks/meetings, ported from speakupgroups): when · what · where, read live from Luma. */
.su-meetings { display: flex; flex-direction: column; }
.su-meeting { display: grid; grid-template-columns: 200px minmax(0,1fr); gap: 2px 20px; padding: 16px 0; border-top: 1px solid var(--wp--preset--color--line); text-decoration: none; }
.su-meeting:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.su-meeting-when { font-family: var(--wp--preset--font-family--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--brand); padding-top: 6px; }
.su-meeting-what { font-family: var(--wp--preset--font-family--display); font-size: 22px; line-height: 1.15; }
.su-meeting-where { grid-column: 2; font-family: var(--wp--preset--font-family--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--faint); }
.su-meeting:hover .su-meeting-what { color: var(--wp--preset--color--brand); }
@media (max-width: 640px) { .su-meeting { grid-template-columns: 1fr; gap: 2px; } .su-meeting-where { grid-column: 1; } }

/* Big "Visit" buttons. */
.su-visit .wp-block-button__link { font-size: 15px; padding: 16px 26px; }
.su-visit { margin-top: 32px !important; }

/* Contact: sub-rows inside the Contact row. */
.su-sub { border-top: 1px solid var(--wp--preset--color--line); padding: 26px 0; margin: 0 !important; }
.su-sub:first-child { border-top: 0; padding-top: 0; }
.su-sub h3 { margin: 0; }
.su-mail a { font-size: 22px; text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--line); }
.su-mail a:hover { border-color: var(--wp--preset--color--brand); }
.su-kit { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; }
.su-kit input { font: 17px var(--wp--preset--font-family--read); padding: 11px 14px; border: 1px solid #d6d1c7; border-radius: 6px; background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); flex: 1 1 220px; min-width: 0; }
.su-kit button { font: 400 13px/1 var(--wp--preset--font-family--mono); letter-spacing: .08em; text-transform: uppercase; background: var(--wp--preset--color--brand); color: var(--wp--preset--color--paper); border: 1.5px solid var(--wp--preset--color--brand); border-radius: 100px; padding: 12px 20px; cursor: pointer; }
.su-kit button:hover { background: var(--wp--preset--color--brand-deep); border-color: var(--wp--preset--color--brand-deep); }
.su-tally { width: 100%; border: 0; min-height: 420px; }

/* Donate band at the foot of the page. */
.su-give { scroll-margin-top: 80px; margin-top: 96px !important; border-top: 1px solid var(--wp--preset--color--line); }
.su-give h2 { font-size: clamp(34px, 4.5vw, 48px); }
.su-give iframe { width: 100%; max-width: 500px; min-width: 250px; border: 0; display: block; }

.su-foot { border-top: 1px solid var(--wp--preset--color--line); }
.su-foot .su-ledger-k { margin: 0 !important; }

@media (max-width: 781px) {
	.su-ledger-row { padding: 48px 0 44px; }
	.su-ledger-row .wp-block-column + .wp-block-column { margin-top: 24px; }
	.su-thumb { max-width: 160px; }
	.wp-block-gallery.su-fan { height: 200px; }
	.wp-block-gallery.has-nested-images.su-fan figure.wp-block-image { width: 108px !important; }
	.su-hdr .wp-block-site-logo img { height: 38px; }
	.su-hdr { position: static; } /* the header wraps to three lines on a phone; don't pin it over the page */
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .wp-block-details summary::after, .su-fan figure.wp-block-image { transition: none; } }