/*
  2026 site refresh — fixes from the September 2026 design audit.
  Loaded after clb-custom-ironwood-styles.css.

  Cascade note: this file is intentionally UNLAYERED so it beats the
  layered theme rules (style.css = theme-defaults, custom styles =
  theme-overrides) and unlayered plugin CSS. The one exception is the
  small @layer theme-overrides block at the very bottom, which exists
  only to out-order a few !important rules in the custom stylesheet.

  Numbers in section titles refer to the audit findings.
*/

/* ------------------------------------------------------------
   Buttons: one primary style everywhere (#3, #13)
   ------------------------------------------------------------ */
.entry-content .button,
.entry-content input[type="submit"],
.entry-footer .button,
.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"],
.single-work .clb-back-to-portfolio-btn-wrapper a.button,
.search-form .search-form-submit {
	background: var(--ironwood-black);
	border: 2px solid var(--ironwood-black);
	border-radius: var(--ironwood-border-radius);
	color: var(--ironwood-white);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.2;
	min-height: 48px;
	padding: 14px 28px;
	text-transform: uppercase;
	transition: background-color .25s ease, border-color .25s ease;
}

.entry-content .button:hover,
.entry-content .button:focus,
.entry-content input[type="submit"]:hover,
.entry-content input[type="submit"]:focus,
.entry-footer .button:hover,
.entry-footer .button:focus,
.gform_wrapper .gform_button:hover,
.gform_wrapper .gform_button:focus,
.gform_wrapper input[type="submit"]:hover,
.gform_wrapper input[type="submit"]:focus,
.single-work .clb-back-to-portfolio-btn-wrapper a.button:hover,
.single-work .clb-back-to-portfolio-btn-wrapper a.button:focus,
.search-form .search-form-submit:hover,
.search-form .search-form-submit:focus {
	background: var(--ironwood-secondary-color);
	border-color: var(--ironwood-secondary-color);
	color: var(--ironwood-white);
}

/* ------------------------------------------------------------
   Forms: readable placeholders, tappable radios (#3)
   ------------------------------------------------------------ */
::placeholder {
	color: #6b6b6b;
	opacity: 1;
}

.gform_wrapper input[type="radio"],
.gform_wrapper input[type="checkbox"] {
	accent-color: var(--ironwood-secondary-color);
	height: 22px;
	margin: 0;
	width: 22px;
	flex: 0 0 auto;
}

.gform_wrapper .gfield_radio .gchoice,
.gform_wrapper .gfield_checkbox .gchoice {
	align-items: center;
	display: flex;
	gap: 10px;
	padding: 6px 0;
}

.gform_wrapper .gfield_radio .gchoice label,
.gform_wrapper .gfield_checkbox .gchoice label {
	font-size: var(--ironwood-font-size-md);
	line-height: 1.3;
	margin: 0;
	max-width: none;
}

/* ------------------------------------------------------------
   Reading width for long-form pages (#10, #17)
   Leaves the home page, centered text, and full-width blocks alone.
   ------------------------------------------------------------ */
body.page:not(.home) .entry-content > :is(p, ul, ol, h2, h3, h4, blockquote):not(.has-text-align-center),
body.page:not(.home) .entry-content :is(.wp-block-group, .wp-block-group__inner-container) > :is(p, ul, ol, h3, h4):not(.has-text-align-center) {
	max-width: 66ch;
}

/* About page: keep the headshot beside the text, not wrapped under it */
.page-id-8 .entry-content figure.alignright {
	margin: 0 0 24px 40px;
}

.page-id-8 .entry-content > p {
	max-width: 680px;
}

.page-id-8 .entry-content figure.alignright img.wp-image-884 {
	width: 320px !important;
}

/* ------------------------------------------------------------
   Services table: opaque sticky header (#11)
   ------------------------------------------------------------ */
.clb-pricing-table-wrapper th {
	backdrop-filter: none;
	background: var(--ironwood-white);
}

/* ------------------------------------------------------------
   Care Plans: CTA row inside each plan card (#9)
   (align-items / height fixes live in the page's own inline styles)
   ------------------------------------------------------------ */
.td-care-plan__cta {
	border-top: 1px solid var(--td-line, #ddd7cf);
	margin-top: 1.5rem;
	padding-top: 1.35rem;
}

.td-care-plan__cta .button {
	display: inline-block;
}

.td-care-plan__cta-note {
	color: #4d473f;
	display: block;
	font-size: .95rem;
	line-height: 1.5;
	margin-top: .7rem;
}

/* ------------------------------------------------------------
   Accordion (Care Plans FAQ, FAQ page): lighter rows (#9)
   ------------------------------------------------------------ */
.entry-content .wp-block-create-block-clb-collapse,
.entry-content .wp-block-create-block-clb-collapse.has-background {
	background: transparent !important;
	margin-bottom: 10px;
	margin-top: 10px;
}

.entry-content .wp-block-create-block-clb-collapse .clb-simple-collapse-toggle-label {
	background: var(--ironwood-light-gray);
	border: 1px solid #e2e2e2;
	color: var(--ironwood-black);
	padding: 16px 56px 16px 20px;
	text-align: left;
}

.entry-content .wp-block-create-block-clb-collapse .clb-simple-collapse-toggle-label:hover,
.entry-content .wp-block-create-block-clb-collapse .clb-simple-toggle-input:checked + .clb-simple-collapse-toggle-label {
	background: #eef2e0;
	color: var(--ironwood-black);
}

.entry-content .wp-block-create-block-clb-collapse .clb-simple-collapsible-content .clb-simple-collapsible-content-inner {
	background: var(--ironwood-white);
	border: 1px solid #e2e2e2;
	border-top: 0;
	padding: 22px 20px;
}

/* ------------------------------------------------------------
   Portfolio / testimonial cards (#13, #14)
   ------------------------------------------------------------ */
/* Title in the colored header now links to the project (replaces the ⓘ icon) */
.clb-single-work-quote-header-panel h3.clb-portfolio-title a {
	border-bottom: 2px solid transparent;
	border-radius: 0;
	color: var(--ironwood-white);
	padding: 0;
	text-decoration: none;
	transition: border-color .25s ease;
}

.clb-single-work-quote-header-panel h3.clb-portfolio-title a:hover,
.clb-single-work-quote-header-panel h3.clb-portfolio-title a:focus {
	border-bottom-color: var(--ironwood-white);
}

.clb-quote-name {
	flex-wrap: wrap;
	gap: 6px 18px;
}

/* ------------------------------------------------------------
   Work single: solid title, obvious link (#12)
   ------------------------------------------------------------ */
.single-work h1.entry-title {
	-webkit-text-fill-color: currentColor;
	background-image: none;
	color: var(--ironwood-black);
}

.single-work .clb-single-work-link a {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
}

/* ------------------------------------------------------------
   Home: the tagline is now the page's h1 (#16)
   ------------------------------------------------------------ */
.home .entry-content h1.wp-block-heading {
	font-size: var(--ironwood-font-size-l-4);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 20px;
}

/* ------------------------------------------------------------
   Header: logo without its white box, desktop sub-menu (#6, #15)
   ------------------------------------------------------------ */
#sitelogo img,
#sitelogo-transparent img {
	mix-blend-mode: multiply;
}

.genesis-nav-menu .sub-menu a {
	font-size: 16px;
	line-height: 1.3;
}

/* ============================================================
   MOBILE + TABLET (below the theme's 960px menu breakpoint)
   ============================================================ */
@media only screen and (max-width: 959px) {

	/* ---- Type scale (#2, #18) ---- */
	:root {
		--ironwood-font-size-default: 1.125rem;
	}

	.entry-title,
	.page h1.entry-title,
	.single-work h1.entry-title {
		font-size: clamp(2rem, 8.5vw, 2.5rem);
		hyphens: auto;
		margin-bottom: 24px;
	}

	.entry-content h2,
	.home .entry-content h1.wp-block-heading {
		font-size: clamp(1.5rem, 6.5vw, 1.75rem);
	}

	.entry-content h3 {
		font-size: 1.35rem;
	}

	h2.clb-every-website-homepage-line {
		font-size: 1.9rem;
	}

	.clb-single-info-card-body-wrapper h3.clb-single-info-card-heading {
		font-size: 1.4rem;
	}

	.clb-single-work-quote-wrapper {
		font-size: 1.2rem;
	}

	.clb-single-work-quote-wrapper .clb-quote-name {
		font-size: 1rem;
	}

	.clb-single-work-quote-header-panel h3 {
		font-size: 1.25rem;
	}

	.single-work .clb-single-work-link a {
		font-size: 1.1rem;
	}

	.home .entry-content .wp-block-cover__inner-container {
		max-width: 100%;
	}

	/* ---- Hero: no more caption collision (#1) ---- */
	.clb-hero-line {
		font-size: 1.5rem;
	}

	.clb-hero-line.clb-hero-line-accent {
		font-size: 2.9rem;
		line-height: 1.05;
		margin-top: 12px;
	}

	.clb-homepage-hero .wp-block-cover__inner-container {
		padding-bottom: 56px;
	}

	.clb-hero-caption-text-wrapper {
		bottom: 12px;
		font-size: .85rem;
		left: 0;
		padding: 0 16px;
		right: 0;
		text-align: center;
	}

	/* ---- Header: one line, ~72px tall (#6) ---- */
	.site-header {
		padding: 0 16px;
	}

	.site-header .title-area {
		align-items: center;
		display: flex;
		float: left;
		gap: 12px;
		max-width: none;
		padding: 10px 0;
	}

	#sitelogo img {
		max-width: 44px;
	}

	.site-title {
		font-size: 19px;
		line-height: 1.1;
		white-space: nowrap;
	}

	.site-title a {
		letter-spacing: .02em;
		text-transform: uppercase;
	}

	.site-header .menu-toggle {
		align-items: center;
		display: flex;
		margin: 0;
		min-height: 48px;
		padding: 10px 0;
	}

	/* ---- Testimonial cards: small photo, short card (#7) ---- */
	.clb-single-work-quote-header-panel {
		display: block;
		padding: 14px 18px;
	}

	.clb-single-work-quote-header-panel h3 {
		margin: 0 0 4px;
	}

	.clb-single-work-quote-wrapper,
	#clb-single-portfolio-featured-item .clb-single-work-quote-wrapper {
		padding: 20px 18px 8px;
	}

	.clb-single-work-quote-wrapper::before {
		display: none;
	}

	.clb-single-work-quote-wrapper a:has(> img.portfolio-quote) {
		float: left;
	}

	.clb-single-work-quote-wrapper img.portfolio-quote {
		border-width: 3px;
		float: left;
		height: 76px;
		margin: 4px 14px 6px 0;
		max-width: 76px;
		object-fit: cover;
		width: 76px;
	}

	.clb-single-work-quote-wrapper .clb-quote-name {
		clear: both;
		padding-top: 6px;
	}

	/* ---- Portfolio: two-up card grid (#8) ---- */
	.clb-work-items-24-wrapper {
		display: grid;
		gap: 12px;
		grid-template-columns: 1fr 1fr;
	}

	.clb-portfolio-full-row-container {
		grid-column: 1 / -1;
	}

	.clb-portfolio-card-outer-wrapper {
		margin-bottom: 0;
		min-height: 190px;
		min-width: 0;
	}

	.clb-portfolio-card-title-wrapper {
		font-size: .95rem;
		padding: 8px;
	}

	/* ---- Work single: stack mockup above the info list (#12) ---- */
	.single-work .clb-single-work-inner-flex-wrapper {
		flex-direction: column;
		gap: 24px;
	}

	.single-work .metabox-site-mockup {
		max-width: 100%;
		order: -1;
	}

	.clb-single-work-metabox {
		margin-top: 48px;
		padding: 20px;
	}

	/* ---- Care Plans title inside the compare block ---- */
	.td-care-compare__title {
		font-size: 1.85rem;
	}
}

@media only screen and (max-width: 599px) {
	.site-inner {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* ------------------------------------------------------------
   In-layer overrides: these out-order !important rules in
   clb-custom-ironwood-styles.css (same layer, loaded later).
   "Learn More" becomes a real text link instead of a 24px chip (#13).
   ------------------------------------------------------------ */
@layer theme-overrides {
	.clb-quote-learn-more-wrapper a {
		background: transparent !important;
		border: 0 !important;
		border-bottom: 2px solid var(--single-work-site-color) !important;
		border-radius: 0 !important;
		color: var(--ironwood-black) !important;
		font-size: var(--ironwood-font-size-md) !important;
		font-weight: 600;
		padding: 4px 0 !important;
	}

	.clb-quote-learn-more-wrapper a:hover,
	.clb-quote-learn-more-wrapper a:focus {
		background: transparent !important;
		border-bottom-color: var(--ironwood-black) !important;
		color: var(--ironwood-black) !important;
	}
}

/* ------------------------------------------------------------
   Copy-audit additions (September 2026)
   ------------------------------------------------------------ */
/* Two short lines under the home-page cards, on the dark band */
.home .clb-every-website-wrapper p.clb-home-more {
	color: var(--ironwood-white);
	font-size: var(--ironwood-font-size-lg);
	margin: 0 auto 12px;
	max-width: 46rem;
}

.home .clb-every-website-wrapper p.clb-home-more:first-of-type {
	margin-top: 8px;
}

.home .clb-every-website-wrapper p.clb-home-more a {
	border-bottom-color: var(--ironwood-primary-color);
	color: var(--ironwood-white);
}

.home .clb-every-website-wrapper p.clb-home-more a:hover,
.home .clb-every-website-wrapper p.clb-home-more a:focus {
	border-bottom-color: var(--ironwood-white);
}

/* Portfolio intro line */
.page .entry-content p.clb-portfolio-intro {
	color: var(--ironwood-dark-gray);
	margin: -10px auto 36px;
	max-width: 40rem;
}
