/* ==========================================================================
   OECC Single Work Template styles (Bridge child theme: oecc-work.css)
   Source: OECC_Work_Template_Wireframe_v8, translated to live-site classes.
   All selectors are scoped under .oecc-work so nothing leaks into Bridge.
   ========================================================================== */

:root {
	--oecc-magpie: #012E40;
	--oecc-junco: #F0F2F2;
	--oecc-peacock: #025159;
	--oecc-hummingbird: #038C8C;
	--oecc-parakeet: #03A696;
	--oecc-lark: #F2EDB6;
	--oecc-goldfinch: #F2D22E;
	--oecc-warbler: #F29F05;
	--oecc-tanager: #F27405;
	--oecc-oriole: #F25C05;
	--oecc-white: #FFFFFF;
	--oecc-ink: #3a4a52;
	--oecc-sticky-top: 120px;   /* Sidebar rail offset. Set automatically from the header height by the template script. */
	--oecc-header-offset: 0px;  /* Extra hero padding under Bridge's fixed header. Set automatically by the template script. */
}

/* ---------- base ---------- */
.oecc-work, .oecc-work * { box-sizing: border-box; }
.oecc-work { font-family: 'Poppins', sans-serif; color: var(--oecc-ink); -webkit-font-smoothing: antialiased; width: 100%; }
.oecc-work h1, .oecc-work h2, .oecc-work h3, .oecc-work p, .oecc-work ul { margin: 0; padding: 0; }
.oecc-work h1, .oecc-work h2, .oecc-work h3 { font-family: 'Poppins', sans-serif; letter-spacing: 0; word-spacing: normal; text-transform: none; }
.oecc-work a { text-decoration: none; color: inherit; }
.oecc-work img { display: block; max-width: 100%; }
.oecc-wrap { max-width: 1180px; margin: 0 auto; padding: 0 40px; }
.oecc-work p.oecc-eyebrow, .oecc-work span.oecc-eyebrow { font-weight: 700; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.4; margin-bottom: 0; }

/* ---------- buttons ---------- */
.oecc-work .oecc-btn { display: inline-block; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 13px; line-height: 1.2; padding: 14px 26px; border: 1px solid currentColor; border-radius: 0; background: transparent; cursor: pointer; transition: all 0.15s; text-decoration: none; }
.oecc-work .oecc-btn-on-dark { color: var(--oecc-white); }
.oecc-work .oecc-btn-on-dark:hover { background: var(--oecc-white); color: var(--oecc-magpie); }
.oecc-work .oecc-btn-on-light { color: var(--oecc-hummingbird); border-color: var(--oecc-hummingbird); }
.oecc-work .oecc-btn-on-light:hover { background: var(--oecc-hummingbird); color: var(--oecc-white); }
.oecc-work .oecc-btn-on-gold { color: #111; border-color: #111; }
.oecc-work .oecc-btn-on-gold:hover { background: #111; color: var(--oecc-goldfinch); }

/* ---------- hero ---------- */
.oecc-hero { background: var(--oecc-magpie); color: var(--oecc-white); }
.oecc-hero-grid { display: grid; grid-template-columns: 1.35fr 0.65fr; gap: 64px; align-items: center; padding-top: calc(84px + var(--oecc-header-offset)); padding-bottom: 56px; }
.oecc-work p.oecc-hero-eyebrow { color: var(--oecc-white); margin-bottom: 16px; }
.oecc-hero-eyebrow span { color: var(--oecc-goldfinch); }
.oecc-work .oecc-hero-title { font-weight: 700; font-size: 38px; line-height: 1.18; color: var(--oecc-white); margin-bottom: 16px; }
.oecc-hero-subtitle { font-weight: 400; font-size: 15.5px; font-style: normal; line-height: 1.55; color: var(--oecc-white); margin-bottom: 18px; }
.oecc-hero-authors { font-weight: 600; font-size: 15px; color: var(--oecc-white); margin-bottom: 10px; }
.oecc-hero-authors sup { font-size: 0.6em; color: var(--oecc-goldfinch); }
.oecc-hero-affils { list-style: none; }
.oecc-hero-affils li { font-weight: 400; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,0.75); }
.oecc-hero-affils sup { font-size: 0.7em; color: var(--oecc-goldfinch); margin-right: 4px; }
.oecc-hero-art { width: 100%; max-width: 360px; aspect-ratio: 1 / 1; border-radius: 50%; overflow: hidden; margin-left: auto; background: var(--oecc-peacock); }
.oecc-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.oecc-hero-meta { border-top: 1px solid rgba(255,255,255,0.22); }
.oecc-hero-meta-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px; padding-top: 26px; padding-bottom: 34px; }
.oecc-meta-items { display: flex; flex-wrap: wrap; gap: 48px; }
.oecc-meta-item { display: flex; flex-direction: column; gap: 5px; }
.oecc-meta-label { font-weight: 700; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--oecc-parakeet); }
.oecc-meta-value { font-weight: 500; font-size: 14px; color: var(--oecc-white); }
.oecc-meta-value a { color: var(--oecc-white); border-bottom: 1px solid rgba(255,255,255,0.35); }
.oecc-meta-value a:hover { border-bottom-color: var(--oecc-goldfinch); }
.oecc-actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- body: article column + rail ---------- */
.oecc-body { background: var(--oecc-white); }
.oecc-body-grid { display: grid; grid-template-columns: 1fr 320px; gap: 64px; align-items: start; padding-top: 72px; padding-bottom: 64px; }
.oecc-main { min-width: 0; }

/* About This Work: Junco box, Peacock bar (locked decision) */
.oecc-about-work { background: var(--oecc-junco); border-left: 6px solid var(--oecc-peacock); padding: 34px 38px; margin-bottom: 52px; }
.oecc-work span.oecc-about-eyebrow { color: var(--oecc-peacock); margin-bottom: 14px; display: block; }
.oecc-about-work p { font-weight: 400; font-size: 15.5px; line-height: 1.75; color: var(--oecc-ink); margin-bottom: 16px; }
.oecc-keywords { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 22px; padding-top: 20px; border-top: 1px solid rgba(1,46,64,0.12); }
.oecc-keywords-label { font-weight: 700; font-size: 12px; color: var(--oecc-magpie); margin-right: 6px; }
.oecc-kw { font-weight: 600; font-size: 11.5px; color: var(--oecc-white); background: var(--oecc-peacock); padding: 5px 11px; }

/* Work title block */
.oecc-work-title-block { margin-bottom: 34px; }
.oecc-work .oecc-work-title { font-weight: 700; font-size: 30px; line-height: 1.22; color: #111; margin-bottom: 10px; }
.oecc-work-byline { font-weight: 600; font-size: 14px; color: var(--oecc-peacock); }

/* Article prose: applies to Elementor-built content in the column */
.oecc-work .oecc-prose h2 { font-weight: 700; font-size: 24px; line-height: 1.25; color: #111; margin: 44px 0 16px; }
.oecc-work .oecc-prose h3 { font-weight: 700; font-size: 19px; line-height: 1.3; color: #111; margin: 32px 0 12px; }
.oecc-work .oecc-prose h4 { font-weight: 700; font-size: 16.5px; line-height: 1.35; color: #111; margin: 26px 0 10px; }
.oecc-work .oecc-prose h5, .oecc-work .oecc-prose h6 { font-weight: 700; font-size: 15.5px; line-height: 1.4; color: #111; margin: 22px 0 8px; }
.oecc-work .oecc-prose p { font-weight: 400; font-size: 15.5px; line-height: 1.8; color: var(--oecc-ink); margin: 0 0 20px; }
.oecc-work .oecc-prose ul, .oecc-work .oecc-prose ol { margin: 0 0 20px 22px; font-size: 15.5px; line-height: 1.8; color: var(--oecc-ink); }
.oecc-work .oecc-prose a { color: var(--oecc-hummingbird); border-bottom: 1px solid var(--oecc-hummingbird); }
.oecc-work .oecc-prose blockquote,
.oecc-work .oecc-prose .oecc-pullquote { margin: 38px 0; padding: 6px 0 6px 30px; border-left: 5px solid var(--oecc-tanager); background: transparent; }
.oecc-work .oecc-prose blockquote p,
.oecc-work .oecc-prose .oecc-pullquote p { font-weight: 600; font-size: 21px; line-height: 1.4; color: var(--oecc-magpie); font-style: italic; margin: 0; }
.oecc-work .oecc-prose .oecc-references p { padding-left: 2em; text-indent: -2em; margin-bottom: 12px; }
/* Elementor resets inside the column: remove default column padding, let content fill the column */
.oecc-work .oecc-prose .elementor-section.elementor-section-boxed > .elementor-container { max-width: none; }
.oecc-work .oecc-prose .elementor-column-gap-default > .elementor-column > .elementor-element-populated { padding: 0; }
.oecc-work .oecc-prose .elementor-widget:not(:last-child) { margin-bottom: 0; }

/* Sidebar rail: Junco boxes, Magpie top bar (matches live post boxes) */
.oecc-sidebar { display: flex; flex-direction: column; gap: 26px; }
.oecc-sidebar.is-sticky { position: sticky; top: var(--oecc-sticky-top); }
/* Bridge wrappers must not clip sticky positioning on work pages */
body.single-work .content, body.single-work .content_inner { overflow: visible; }
.oecc-sb { background: var(--oecc-junco); border-top: 8px solid var(--oecc-magpie); padding: 26px 26px 28px; }
.oecc-work .oecc-sb-title { font-weight: 700; font-size: 17px; line-height: 1.3; color: #111; margin-bottom: 14px; }
.oecc-sb p { font-weight: 400; font-size: 13.5px; line-height: 1.65; color: var(--oecc-ink); word-wrap: break-word; overflow-wrap: anywhere; }
.oecc-sb p a { color: var(--oecc-hummingbird); border-bottom: 1px solid var(--oecc-hummingbird); }
.oecc-work .oecc-sb-link { display: inline-block; margin-top: 14px; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 12.5px; color: var(--oecc-hummingbird); border: 0; border-bottom: 1px solid var(--oecc-hummingbird); padding: 0 0 2px; background: transparent; cursor: pointer; line-height: 1.4; }
.oecc-contrib { list-style: none; }
.oecc-contrib li { padding: 11px 0; border-bottom: 1px solid rgba(1,46,64,0.1); }
.oecc-contrib li:last-child { border-bottom: 0; padding-bottom: 0; }
.oecc-c-role { font-weight: 700; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--oecc-peacock); display: block; margin-bottom: 3px; }
.oecc-c-name { font-weight: 600; font-size: 14px; color: #111; display: block; }
.oecc-c-affil { font-weight: 400; font-size: 12px; color: #5a6a72; display: block; }

/* ---------- statements band ---------- */
.oecc-stmt { background: var(--oecc-junco); }
.oecc-stmt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding-top: 60px; padding-bottom: 64px; }
.oecc-stmt-grid.is-single { grid-template-columns: 1fr; }
.oecc-work span.oecc-stmt-eyebrow { color: var(--oecc-peacock); margin-bottom: 12px; display: block; }
.oecc-col-rule { width: 44px; height: 4px; background: var(--oecc-magpie); margin-bottom: 18px; }
.oecc-stmt p { font-weight: 400; font-size: 14px; line-height: 1.7; color: var(--oecc-ink); margin-bottom: 12px; }

/* ---------- about the authors ---------- */
.oecc-authors .oecc-wrap { padding-top: 72px; padding-bottom: 80px; }
.oecc-work .oecc-authors-title { font-weight: 700; font-size: 26px; line-height: 1.25; color: #111; margin-bottom: 26px; }
.oecc-authors-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.oecc-author-card { background: var(--oecc-junco); padding: 30px 32px; display: flex; gap: 22px; align-items: flex-start; }
.oecc-author-photo { width: 84px; height: 84px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: var(--oecc-peacock); }
.oecc-author-photo img { width: 100%; height: 100%; object-fit: cover; }
.oecc-author-name { font-weight: 700; font-size: 17px; color: #111; margin-bottom: 2px; }
.oecc-author-affil { font-weight: 600; font-size: 12.5px; color: var(--oecc-peacock); margin-bottom: 14px; }
.oecc-author-bio p { font-weight: 400; font-size: 13.5px; line-height: 1.7; color: var(--oecc-ink); margin-bottom: 10px; }

/* ---------- remix band (Goldfinch) ---------- */
.oecc-remix { background: var(--oecc-goldfinch); color: #111; }
.oecc-remix-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 70px; padding-top: 74px; padding-bottom: 74px; align-items: start; }
.oecc-work p.oecc-remix-eyebrow { color: #111; margin-bottom: 10px; }
.oecc-work .oecc-remix h2 { font-weight: 700; font-size: 34px; line-height: 1.2; color: #111; }
.oecc-remix-rule { width: 64px; height: 5px; background: #111; margin-top: 26px; }
.oecc-remix p { font-weight: 400; font-size: 15px; line-height: 1.75; color: #222; margin-bottom: 18px; }
.oecc-remix .oecc-guide-note { font-size: 13.5px; line-height: 1.65; margin: 26px 0 18px; }
.oecc-remix-acc { display: flex; flex-direction: column; gap: 10px; margin-bottom: 26px; }
.oecc-remix-acc details { border: 1px solid rgba(17,17,17,0.55); background: transparent; }
.oecc-remix-acc summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; font-weight: 700; font-size: 14.5px; color: #111; padding: 15px 18px; }
.oecc-remix-acc summary::-webkit-details-marker { display: none; }
.oecc-remix-acc summary::before { content: '+'; font-weight: 600; font-size: 17px; line-height: 1; }
.oecc-remix-acc details[open] summary::before { content: '\2212'; }
.oecc-remix-acc .oecc-acc-body { padding: 0 18px 16px 47px; }
.oecc-remix-acc .oecc-acc-body p { font-size: 13.5px; line-height: 1.65; margin-bottom: 0; }
.oecc-remix-editable { margin-bottom: 8px; }

/* ---------- more from this collection (Magpie) ---------- */
.oecc-siblings { background: var(--oecc-magpie); }
.oecc-siblings .oecc-wrap { padding-top: 76px; padding-bottom: 84px; }
.oecc-work p.oecc-siblings-eyebrow { color: var(--oecc-goldfinch); margin-bottom: 10px; }
.oecc-work .oecc-siblings h2 { font-weight: 700; font-size: 32px; line-height: 1.2; color: var(--oecc-white); margin-bottom: 14px; }
.oecc-siblings-rule { width: 64px; height: 5px; background: var(--oecc-goldfinch); margin-bottom: 40px; }
.oecc-sib-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.oecc-sib-card { background: var(--oecc-white); display: flex; flex-direction: column; align-items: flex-start; }
.oecc-sib-thumb { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--oecc-peacock); }
.oecc-sib-thumb img { width: 100%; height: 100%; object-fit: cover; }
.oecc-sib-body { padding: 26px 28px 30px; display: flex; flex-direction: column; align-items: flex-start; flex: 1; width: 100%; }
.oecc-sib-format { font-weight: 700; font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--oecc-hummingbird); margin-bottom: 10px; }
.oecc-work .oecc-sib-card h3 { font-weight: 700; font-size: 17px; line-height: 1.35; color: #111; margin-bottom: 8px; }
.oecc-sib-who { font-weight: 600; font-size: 12.5px; color: #5a6a72; margin-bottom: 12px; }
.oecc-sib-blurb { font-weight: 400; font-size: 13px; line-height: 1.65; color: var(--oecc-ink); margin-bottom: 20px; }
.oecc-work .oecc-sib-card .oecc-btn { margin-top: auto; font-size: 12.5px; padding: 12px 22px; }

/* ---------- the collection (white) ---------- */
.oecc-collection-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 70px; align-items: center; padding-top: 84px; padding-bottom: 84px; }
.oecc-coll-art { width: 100%; max-width: 390px; aspect-ratio: 1 / 1; border-radius: 50%; overflow: hidden; margin-left: auto; }
.oecc-coll-art img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.oecc-work p.oecc-collection-eyebrow { color: #111; margin-bottom: 10px; }
.oecc-work .oecc-collection h2 { font-weight: 700; font-size: 34px; line-height: 1.22; color: #111; margin-bottom: 22px; }
.oecc-coll-rule { width: 56px; height: 5px; background: #111; margin-bottom: 24px; }
.oecc-coll-text p { font-weight: 400; font-size: 15px; line-height: 1.75; color: var(--oecc-ink); margin-bottom: 26px; }

/* ---------- about OECC strip (Peacock) ---------- */
.oecc-about { background: var(--oecc-peacock); }
.oecc-about-row { display: flex; gap: 30px; align-items: flex-start; padding-top: 56px; padding-bottom: 56px; }
.oecc-about-mark { width: 100px; height: 100px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: var(--oecc-magpie); }
.oecc-about-mark img { width: 100%; height: 100%; object-fit: cover; }
.oecc-work .oecc-about h2 { font-weight: 700; font-size: 19px; line-height: 1.3; color: var(--oecc-white); margin-bottom: 8px; }
.oecc-about-tagline { font-weight: 600; font-style: italic; font-size: 13.5px; color: var(--oecc-white); margin-bottom: 10px; }
.oecc-about p { font-weight: 400; font-size: 14px; line-height: 1.7; color: rgba(255,255,255,0.88); margin-bottom: 18px; max-width: 820px; }
.oecc-about-editable p { color: rgba(255,255,255,0.88); }

/* ---------- responsive ---------- */
@media (max-width: 900px) {
	.oecc-wrap { padding: 0 24px; }
	.oecc-hero-grid, .oecc-body-grid, .oecc-remix-grid, .oecc-collection-grid, .oecc-stmt-grid { grid-template-columns: 1fr; }
	.oecc-hero-grid { padding-top: 56px; gap: 36px; }
	.oecc-work .oecc-hero-title { font-size: 30px; }
	.oecc-sib-grid, .oecc-authors-grid { grid-template-columns: 1fr; }
	.oecc-hero-art, .oecc-coll-art { margin: 0 auto; }
	.oecc-sidebar.is-sticky { position: static; }
	.oecc-body-grid { gap: 44px; }
}
