/*
Theme Name:   Transit is Essential (Astra Child)
Theme URI:    https://transitisessential.org/
Description:  Child theme of Astra for the Transit is Essential coalition site. Put custom CSS and template overrides here so Astra can update safely.
Author:       LivableStreets Alliance
Author URI:   https://www.livablestreets.info
Template:     astra
Version:      1.0.0
Text Domain:  transitisessential-astra-child
*/

/* Custom styles go below this line. */

/* Brand colors and fonts carried over from the original Divi site. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&family=Open+Sans:wght@400;600;700&display=swap');

:root {
	--tie-blue: #0c71c3;
	--tie-hero: #496cdc;
	--tie-green: #6eba01;
	--tie-alt-bg: #f5f7fb;
}

body,
.entry-content p,
.entry-content li {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.main-header-menu .menu-link {
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
}

html {
	scroll-behavior: smooth;
}

/* Keep anchor targets clear of the sticky header. */
.tie-section {
	scroll-margin-top: 90px;
}

/* Header */
.main-header-menu .menu-link {
	font-weight: 600;
}

/* Hero */
.entry-content .tie-hero {
	margin-top: 0;
	margin-bottom: 0;
}

.entry-content .tie-hero-title {
	color: #fff;
	font-weight: 700;
	line-height: 1.4;
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}

/* Sections */
.entry-content .tie-section {
	padding: 60px 20px;
	margin-top: 0;
	margin-bottom: 0;
}

.entry-content .tie-section.tie-alt {
	background: var(--tie-alt-bg);
}

.entry-content .tie-section h2 {
	font-weight: 400;
	letter-spacing: 1px;
	margin-bottom: 1em;
}

.entry-content .tie-section h3 {
	color: var(--tie-blue);
	font-weight: 700;
	font-size: 1.35rem;
}

/* Buttons */
.tie-btn-blue .wp-block-button__link {
	background: var(--tie-blue);
	color: #fff;
	border-radius: 5px;
	font-weight: 700;
	padding: 0.5em 1.2em;
}

.tie-btn-green .wp-block-button__link {
	background: var(--tie-green);
	color: #fff;
	border-radius: 0;
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 0.8em 1.6em;
	border: 2px solid var(--tie-green);
}

.tie-btn-green .wp-block-button__link:hover {
	background: #fff;
	color: var(--tie-green);
}

/* Priorities accordion */
.tie-toggle {
	background: #fff;
	border: 1px solid #d9d9d9;
	padding: 18px 22px;
	margin-bottom: 12px;
}

.tie-toggle summary {
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 1.3rem;
	color: var(--tie-blue);
	cursor: pointer;
}

.tie-toggle p {
	margin: 12px 0 0;
}

/* Member logos */
.tie-member-grid {
	gap: 30px;
	align-items: center;
}

.tie-member-grid .tie-logo {
	margin: 0;
	text-align: center;
}

.tie-member-grid .tie-logo img {
	max-height: 100px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
}

/* News list */
.tie-news {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
	columns: 2 320px;
	column-gap: 40px;
}

.tie-news li {
	break-inside: avoid;
	margin-bottom: 18px;
}

.tie-news-source {
	font-weight: 700;
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #555;
}

/* Header: logo only, sized like the original. */
.site-header .site-title,
.site-header .site-description {
	display: none;
}

.site-header .custom-logo-link img {
	width: 200px;
	max-width: 200px;
	height: auto;
}

@media (max-width: 921px) {
	.site-header .custom-logo-link img {
		width: 150px;
		max-width: 150px;
	}
}

/* Two logos per row on phones. */
@media (max-width: 544px) {
	.tie-member-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 20px;
	}

	.tie-member-grid .tie-logo img {
		max-height: 70px;
	}
}