/* Robin Elise Weiss theme: the few rules theme.json cannot express. */

:root {
	--rew-green: #354e4c;
	--rew-teal: #4d7674;
	--rew-mauve: #944e6e;
	--rew-light-blue: #98c0cd;
	--rew-ice: #e5f8fd;
	--rew-white: #ffffff;
	--rew-shadow: 0 1px 2px rgba(53, 78, 76, 0.08), 0 8px 24px rgba(53, 78, 76, 0.08);
}

/* Header: sticky from tablet up, like the old site. Static on phones. */
.rew-header {
	box-shadow: 0 1px 0 rgba(53, 78, 76, 0.12);
	z-index: 50;
}
@media (max-width: 781px) {
	.rew-header {
		position: static !important;
	}
}
.rew-logo img {
	height: auto;
	display: block;
}

/* Navigation */
.wp-block-navigation .wp-block-navigation-item__content {
	padding: 0.35rem 0;
}
.wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--rew-white);
	border: 1px solid var(--rew-light-blue);
	border-radius: 8px;
	box-shadow: var(--rew-shadow);
	padding: 0.5rem 0;
	min-width: 240px;
}
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.5rem 1rem;
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
}
.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--rew-ice);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	border: 0;
	box-shadow: none;
	background: transparent;
}

/* Cards: white panels on the Ice Blue ground */
.rew-card {
	background: var(--rew-white);
	border: 1px solid var(--rew-light-blue);
	border-radius: 12px;
	overflow: hidden;
}
.rew-card .wp-block-image img {
	border-radius: 0;
}
.rew-card > .wp-block-group__inner-container,
.rew-card .rew-card-body {
	padding: 1.25rem;
}

/* Photo banners */
.wp-block-cover .wp-block-cover__inner-container h1,
.wp-block-cover .wp-block-cover__inner-container h2,
.wp-block-cover .wp-block-cover__inner-container h3,
.wp-block-cover .wp-block-cover__inner-container h4 {
	color: var(--rew-white);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.wp-block-cover .wp-block-cover__inner-container p {
	color: var(--rew-white);
}

/* Uppercase line under a banner heading, and small uppercase sub-headings */
.rew-eyebrow {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* Check-mark lists */
ul.rew-check {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}
ul.rew-check li {
	position: relative;
	padding-left: 1.6rem;
	margin-bottom: 0.5rem;
}
ul.rew-check li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--rew-mauve);
	font-weight: 700;
}
.has-darkest-green-background-color ul.rew-check li::before {
	color: var(--rew-light-blue);
}

/* Reversed blocks: links and headings on Darkest Green */
.has-darkest-green-background-color,
.has-darkest-green-background-color h1,
.has-darkest-green-background-color h2,
.has-darkest-green-background-color h3,
.has-darkest-green-background-color h4,
.has-darkest-green-background-color p {
	color: var(--rew-white);
}
.has-darkest-green-background-color a:not(.wp-block-button__link) {
	color: var(--rew-light-blue);
}
.has-darkest-green-background-color a:not(.wp-block-button__link):hover {
	color: var(--rew-white);
}
.has-darkest-green-background-color .wp-block-button__link {
	background-color: var(--rew-mauve);
	color: var(--rew-white);
}
.has-darkest-green-background-color .wp-block-button__link:hover {
	background-color: var(--rew-white);
	color: var(--rew-green);
}

/* Testimonials */
p.rew-testimonial,
.rew-testimonial p {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.3rem;
	line-height: 1.4;
}
.rew-testimonial-mark img {
	width: 56px;
	height: auto;
}

/* "You can also find me at" cards: photo, who it is for, one button */
.rew-find-me a {
	text-decoration: none;
}
.rew-site-card {
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.rew-site-card:hover {
	border-color: var(--rew-mauve);
	box-shadow: var(--rew-shadow);
}
.rew-site-card .rew-site-photo {
	margin: 0;
}
.rew-site-card .rew-site-photo img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 0;
}
.rew-site-card .rew-card-body {
	flex: 1;
	display: flex;
	flex-direction: column;
}
.rew-site-card .rew-card-body .wp-block-buttons {
	margin-top: auto;
	padding-top: 0.5rem;
}
.rew-site-card h3 {
	margin: 0.25rem 0 0.5rem;
}
.rew-site-who {
	color: var(--rew-teal);
	margin: 0;
}

/* Narrow reading column (mentoring page) */
.rew-narrow > * {
	max-width: 820px;
}

.rew-narrow > .wp-block-image.is-resized {
	margin-left: auto;
	margin-right: auto;
	display: table;
}

/* FAQ: click-to-open questions */
.rew-faq-title {
	margin-top: 3rem;
}
.rew-faq {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.rew-faq-item {
	background: var(--rew-white);
	border: 1px solid var(--rew-light-blue);
	border-radius: 10px;
	padding: 0;
	margin: 0;
}
.rew-faq-item[open] {
	border-color: var(--rew-teal);
	box-shadow: var(--rew-shadow);
}
.rew-faq-item > summary {
	list-style: none;
	cursor: pointer;
	position: relative;
	padding: 1.1rem 3.25rem 1.1rem 1.4rem;
	font-family: var(--wp--preset--font-family--heading, "Cormorant Garamond", serif);
	font-size: 1.45rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--rew-green);
}
.rew-faq-item > summary::-webkit-details-marker {
	display: none;
}
.rew-faq-item > summary::after {
	content: "+";
	position: absolute;
	right: 1.25rem;
	top: 50%;
	transform: translateY(-50%);
	font-family: Arial, sans-serif;
	font-size: 1.6rem;
	line-height: 1;
	color: var(--rew-mauve);
}
.rew-faq-item[open] > summary::after {
	content: "\2212";
}
.rew-faq-item > :not(summary) {
	padding: 0 1.4rem;
}
.rew-faq-item > ul,
.rew-faq-item > ol {
	padding-left: 2.9rem;
}
.rew-faq-item > :last-child {
	padding-bottom: 1.1rem;
}

/* "Why I do what I do" statement, kept inside the page width */
.rew-why-quote {
	font-family: var(--wp--preset--font-family--heading, "Cormorant Garamond", serif);
	font-size: clamp(1.6rem, 2.6vw, 2.1rem);
	font-style: italic;
	line-height: 1.25;
	color: var(--rew-teal);
	border-left: 4px solid var(--rew-mauve);
	padding: 0.25rem 0 0.25rem 1.5rem;
	margin: 0;
}

/* Class rows on the photo band: buttons sit level at the bottom of each column */
.rew-class-row > .wp-block-column {
	display: flex;
	flex-direction: column;
}
.rew-class-row > .wp-block-column > .wp-block-buttons {
	margin-top: auto;
}

/* Keyboard focus: always visible */
a:focus-visible,
summary:focus-visible,
.wp-element-button:focus-visible {
	outline: 3px solid var(--rew-mauve);
	outline-offset: 3px;
}

/* Footer */
.rew-footer a {
	color: var(--rew-ice);
}
.rew-footer a:hover {
	color: var(--rew-white);
}
.rew-footer .wp-block-navigation .wp-block-navigation-item__content {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 400;
}
.rew-footer-fine {
	font-size: 0.85rem;
	opacity: 0.9;
}

/* Images */
.rew-rounded img {
	border-radius: 12px;
}

/* Quote band */
p.rew-quote,
.rew-quote p {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.5rem;
	line-height: 1.35;
	font-style: italic;
}

/* Media and Text on a green block keeps its text readable */
.wp-block-media-text.has-darkest-green-background-color .wp-block-media-text__content {
	padding: 2rem;
}

/* Pasted HTML pages (hello, writing archive) manage their own look. Give them room. */
.page-template-page-hello main,
.page-template-blank main {
	padding: 0;
}

/* Images never grow past their box (pasted HTML pages rely on this, as the old theme supplied it) */
img {
	max-width: 100%;
	height: auto;
}

/* Linked headings read as headings, not as underlined links */
h1 a, h2 a, h3 a, h4 a,
.wp-block-heading a {
	text-decoration: none;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover,
.wp-block-heading a:hover {
	text-decoration: underline;
}
.rew-card-title {
	letter-spacing: 0.04em;
}

/* Header on Darkest Green (the alternate header colour) */
.rew-header.has-darkest-green-background-color .wp-block-navigation a,
.rew-header.has-darkest-green-background-color .wp-block-navigation .wp-block-navigation-item__content {
	color: var(--rew-white);
}
.rew-header.has-darkest-green-background-color .wp-block-navigation a:hover {
	color: var(--rew-light-blue);
}
.rew-header.has-darkest-green-background-color .wp-block-navigation__submenu-container {
	background: var(--rew-green);
	border-color: var(--rew-teal);
}
.rew-band-mark img {
	opacity: 0.85;
}

/* Linked headings on a photo band or a green block stay white */
.wp-block-cover .wp-block-heading a,
.has-darkest-green-background-color .wp-block-heading a {
	color: inherit;
}
.wp-block-cover .wp-block-heading a:hover,
.has-darkest-green-background-color .wp-block-heading a:hover {
	color: var(--rew-light-blue);
	text-decoration: underline;
}

/* On dark green and photo bands the mauve focus ring is too faint: use Ice Blue there */
.has-darkest-green-background-color :focus-visible,
.wp-block-cover :focus-visible,
.rew-footer :focus-visible {
	outline-color: var(--rew-ice);
}
