/* Fly Fisher Pro Site Framework v1
 * Normative tokens: /DESIGN.md
 * Applies typography, palette, commercial components and responsive comparison layouts.
 */

@font-face {
	font-family: "FFP Cantarell";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/cantarell-400-latin.woff2") format("woff2");
}

@font-face {
	font-family: "FFP Cantarell";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/cantarell-700-latin.woff2") format("woff2");
}

@font-face {
	font-family: "FFP Fjalla One";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/fjalla-one-400-latin.woff2") format("woff2");
}

body.ffp-site-framework-v1 {
	--ffp-color-primary: #0d1a2b;
	--ffp-color-secondary: #1565c0;
	--ffp-color-tertiary: #1e88e5;
	--ffp-color-neutral: #bcced6;
	--ffp-color-surface: #f2f7f9;
	--ffp-color-cta: #e6981e;
	--ffp-color-white: #ffffff;
	--ffp-font-heading: "FFP Fjalla One", "Fjalla One", sans-serif;
	--ffp-font-body: "FFP Cantarell", Cantarell, sans-serif;
	--ffp-radius-sm: 4px;
	--ffp-radius-md: 8px;
	--ffp-radius-lg: 12px;
	--ffp-article-measure: 760px;
	--ffp-component-wide: 920px;
	color: var(--ffp-color-primary);
	font-family: var(--ffp-font-body);
}

body.ffp-site-framework-v1 button,
body.ffp-site-framework-v1 input,
body.ffp-site-framework-v1 select,
body.ffp-site-framework-v1 textarea,
body.ffp-site-framework-v1 table,
body.ffp-site-framework-v1 .elementor-button,
body.ffp-site-framework-v1 .ast-button {
	font-family: var(--ffp-font-body) !important;
}

body.ffp-site-framework-v1 h1,
body.ffp-site-framework-v1 h2,
body.ffp-site-framework-v1 h3,
body.ffp-site-framework-v1 h4,
body.ffp-site-framework-v1 h5,
body.ffp-site-framework-v1 h6,
body.ffp-site-framework-v1 .entry-title,
body.ffp-site-framework-v1 .page-title,
body.ffp-site-framework-v1 .widget-title,
body.ffp-site-framework-v1 .elementor-heading-title,
body.ffp-site-framework-v1 .ffp-article-title,
body.ffp-site-framework-v1 .ffp-author-name,
body.ffp-site-framework-v1 .ffp-buy-box h2,
body.ffp-site-framework-v1 .ffp-buy-box h3 {
	font-family: var(--ffp-font-heading) !important;
	font-weight: 400;
}

body.ffp-site-framework-v1 a {
	text-underline-offset: 0.14em;
}

body.ffp-site-framework-v1 .entry-content a:not(.elementor-button):not(.ffp-button):not(.ffp-buy-button),
body.ffp-site-framework-v1 .ffp-article-content a:not(.ffp-button):not(.ffp-buy-button) {
	color: var(--ffp-color-secondary);
}

body.ffp-site-framework-v1 :where(a, button, input, select, textarea):focus-visible {
	outline: 3px solid var(--ffp-color-primary);
	outline-offset: 3px;
}

/* Shared button family. Orange is reserved for the primary verified affiliate action. */
body.ffp-site-framework-v1 .ffp-button,
body.ffp-site-framework-v1 .ffp-buy-button {
	display: inline-flex;
	min-height: 48px;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	padding: 0.75rem 1rem;
	border: 2px solid var(--ffp-color-secondary);
	border-radius: var(--ffp-radius-sm);
	font-family: var(--ffp-font-body);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	text-decoration: none !important;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

/* Compatibility layer for existing site CTAs while legacy posts are migrated. */
body.ffp-site-framework-v1 .elementor-button,
body.ffp-site-framework-v1 .ast-button,
body.ffp-site-framework-v1 a.button.thirstylink,
body.ffp-site-framework-v1 .btn-primary,
body.ffp-site-framework-v1 input[type="submit"],
body.ffp-site-framework-v1 button[type="submit"]:not(.menu-toggle) {
	display: inline-flex;
	min-height: 48px;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	padding: 0.75rem 1rem;
	border: 2px solid var(--ffp-color-cta) !important;
	border-radius: var(--ffp-radius-sm) !important;
	background: var(--ffp-color-cta) !important;
	color: var(--ffp-color-primary) !important;
	font-family: var(--ffp-font-body) !important;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	text-decoration: none !important;
}

body.ffp-site-framework-v1 .elementor-button:hover,
body.ffp-site-framework-v1 .ast-button:hover,
body.ffp-site-framework-v1 a.button.thirstylink:hover,
body.ffp-site-framework-v1 .btn-primary:hover,
body.ffp-site-framework-v1 input[type="submit"]:hover,
body.ffp-site-framework-v1 button[type="submit"]:not(.menu-toggle):hover {
	border-color: var(--ffp-color-primary) !important;
	background: var(--ffp-color-primary) !important;
	color: var(--ffp-color-white) !important;
}

body.ffp-site-framework-v1 .ffp-button--primary,
body.ffp-site-framework-v1 .ffp-buy-button--primary {
	border-color: var(--ffp-color-cta);
	background: var(--ffp-color-cta);
	color: var(--ffp-color-primary) !important;
}

body.ffp-site-framework-v1 .ffp-button--primary:hover,
body.ffp-site-framework-v1 .ffp-buy-button--primary:hover {
	border-color: var(--ffp-color-primary);
	background: var(--ffp-color-primary);
	color: var(--ffp-color-white) !important;
}

body.ffp-site-framework-v1 .ffp-button--secondary,
body.ffp-site-framework-v1 .ffp-buy-button--secondary {
	border-color: var(--ffp-color-secondary);
	background: var(--ffp-color-secondary);
	color: var(--ffp-color-white) !important;
}

body.ffp-site-framework-v1 .ffp-button--secondary:hover,
body.ffp-site-framework-v1 .ffp-buy-button--secondary:hover {
	border-color: var(--ffp-color-primary);
	background: var(--ffp-color-primary);
	color: var(--ffp-color-white) !important;
}

/* Controlled editorial breakout used by CTAs and comparisons only. */
body.ffp-site-framework-v1 .ffp-component--wide,
body.ffp-site-framework-v1 .ffp-buy-box {
	box-sizing: border-box;
}

@media (min-width: 801px) {
	body.ffp-site-framework-v1 .ffp-component--wide,
	body.ffp-site-framework-v1 .ffp-recovery-v1 .ffp-buy-box {
		position: relative;
		left: 50%;
		width: min(var(--ffp-component-wide), calc(100vw - 48px));
		max-width: none;
		transform: translateX(-50%);
	}
}

/* Canonical affiliate box: dual and compact variants share this base. */
body.ffp-site-framework-v1 .ffp-buy-box {
	margin: 2.25rem 0;
	padding: clamp(1.1rem, 3vw, 1.65rem);
	border: 1px solid var(--ffp-color-neutral);
	border-top: 5px solid var(--ffp-color-secondary);
	border-radius: var(--ffp-radius-md);
	background: var(--ffp-color-surface);
	box-shadow: 0 10px 28px rgba(13, 26, 43, 0.10);
	color: var(--ffp-color-primary);
}

body.ffp-site-framework-v1 .ffp-buy-box__kicker {
	margin: 0 0 0.35rem;
	color: var(--ffp-color-secondary);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body.ffp-site-framework-v1 .ffp-buy-box h2 {
	margin: 0 0 0.5rem;
	color: var(--ffp-color-primary);
	font-size: clamp(1.45rem, 3vw, 1.85rem);
	line-height: 1.2;
}

body.ffp-site-framework-v1 .ffp-buy-box__intro {
	margin: 0 0 1rem;
}

body.ffp-site-framework-v1 .ffp-buy-box__choices {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}

body.ffp-site-framework-v1 .ffp-buy-option {
	display: flex;
	min-width: 0;
	flex-direction: column;
	padding: 1.25rem;
	border: 1px solid var(--ffp-color-neutral);
	border-radius: 6px;
	background: var(--ffp-color-white);
}

body.ffp-site-framework-v1 .ffp-buy-option--preferred {
	border: 2px solid var(--ffp-color-cta);
}

body.ffp-site-framework-v1 .ffp-buy-option__label {
	display: inline-block;
	align-self: flex-start;
	margin: 0 0 0.6rem;
	padding: 0.3rem 0.6rem;
	border-radius: var(--ffp-radius-sm);
	background: var(--ffp-color-secondary);
	color: var(--ffp-color-white);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.35;
}

body.ffp-site-framework-v1 .ffp-buy-option--preferred .ffp-buy-option__label {
	background: var(--ffp-color-cta);
	color: var(--ffp-color-primary);
}

body.ffp-site-framework-v1 .ffp-buy-option h3 {
	margin: 0 0 0.55rem;
	color: var(--ffp-color-primary);
	font-size: 1.3rem;
	line-height: 1.25;
}

body.ffp-site-framework-v1 .ffp-buy-option ul {
	margin: 0 0 1rem 1.15rem;
	padding: 0;
}

body.ffp-site-framework-v1 .ffp-buy-option li {
	margin-bottom: 0.35rem;
}

body.ffp-site-framework-v1 .ffp-buy-option li::marker {
	color: var(--ffp-color-secondary);
}

body.ffp-site-framework-v1 .ffp-buy-option .ffp-button,
body.ffp-site-framework-v1 .ffp-buy-option .ffp-buy-button {
	margin-top: auto;
}

body.ffp-site-framework-v1 .ffp-buy-box__note {
	margin: 0.9rem 0 0;
	color: var(--ffp-color-primary);
	font-size: 0.88rem;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact {
	width: 100%;
	max-width: 100%;
	margin: 1.5rem 0;
	padding: 1rem;
	transform: none;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-box__choices {
	grid-template-columns: 1fr;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
	gap: 0.8rem 1rem;
	align-items: center;
	padding: 1rem;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option__label,
body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option h3,
body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option__summary {
	grid-column: 1;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option__label {
	justify-self: start;
}

body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-button,
body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-button {
	grid-column: 2;
	grid-row: 1 / span 3;
	margin: 0;
}

/* Semantic comparison: conventional table above 720px, labeled cards below. */
body.ffp-site-framework-v1 .ffp-comparison,
body.ffp-site-framework-v1 .ffp-comparison *,
body.ffp-site-framework-v1 .ffp-comparison *::before,
body.ffp-site-framework-v1 .ffp-comparison *::after {
	box-sizing: border-box;
}

body.ffp-site-framework-v1 .ffp-comparison {
	container-type: inline-size;
	margin: 1.5rem 0 2.5rem;
	border: 1px solid var(--ffp-color-neutral);
	border-radius: var(--ffp-radius-md);
	background: var(--ffp-color-white);
	overflow: hidden;
}

body.ffp-site-framework-v1 .ffp-comparison__table {
	display: table;
	width: 100%;
	max-width: none;
	margin: 0;
	border-collapse: collapse;
	font-family: var(--ffp-font-body);
	font-size: 0.88rem;
	line-height: 1.45;
}

body.ffp-site-framework-v1 .ffp-comparison__table caption {
	width: 100%;
	box-sizing: border-box;
	padding: 0.9rem 1rem;
	background: var(--ffp-color-surface);
	color: var(--ffp-color-primary);
	font-family: var(--ffp-font-heading);
	font-size: 1.15rem;
	text-align: left;
}

body.ffp-site-framework-v1 .ffp-comparison__table th {
	padding: 0.8rem;
	background: var(--ffp-color-secondary);
	color: var(--ffp-color-white);
	font-weight: 700;
	text-align: left;
}

body.ffp-site-framework-v1 .ffp-comparison .ffp-comparison__table th a:not(.ffp-button):not(.ffp-buy-button),
body.ffp-site-framework-v1 .ffp-comparison .ffp-comparison__table th a:not(.ffp-button):not(.ffp-buy-button):visited {
	color: var(--ffp-color-white);
}

body.ffp-site-framework-v1 .ffp-comparison__table td {
	padding: 0.85rem 0.8rem;
	border-bottom: 1px solid var(--ffp-color-neutral);
	color: var(--ffp-color-primary);
	vertical-align: top;
}

body.ffp-site-framework-v1 .ffp-comparison__table tr:last-child td {
	border-bottom: 0;
}

@container (max-width: 719px) {
	body.ffp-site-framework-v1 .ffp-comparison__table,
	body.ffp-site-framework-v1 .ffp-comparison__table tbody {
		display: block;
		width: 100%;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table caption {
		display: block;
		width: 100%;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table tbody {
		display: grid;
		grid-template-columns: 1fr;
		gap: 1rem;
		padding: 1rem;
		background: var(--ffp-color-surface);
	}

	body.ffp-site-framework-v1 .ffp-comparison__table tr {
		display: block;
		min-width: 0;
		border: 1px solid var(--ffp-color-neutral);
		border-radius: var(--ffp-radius-md);
		background: var(--ffp-color-white);
		overflow: hidden;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table th[scope="row"] {
		display: block;
		width: 100%;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table th[scope="row"] a {
		display: block;
		width: 100%;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table td {
		display: grid;
		width: 100%;
		box-sizing: border-box;
		grid-template-columns: minmax(92px, 32%) minmax(0, 1fr);
		gap: 0.75rem;
		align-items: start;
		padding: 0.8rem;
		border-bottom: 1px solid var(--ffp-color-neutral);
		overflow-wrap: anywhere;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table td::before {
		content: attr(data-label);
		color: var(--ffp-color-secondary);
		font-weight: 700;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table td:last-child {
		border-bottom: 0;
	}

	body.ffp-site-framework-v1 .ffp-comparison__table .ffp-button,
	body.ffp-site-framework-v1 .ffp-comparison__table .ffp-buy-button {
		width: 100%;
	}
}

/* Shared article components used by the Waders candidate and future money pages. */
body.ffp-site-framework-v1 .ffp-article-components {
	color: var(--ffp-color-primary);
	font-family: var(--ffp-font-body);
	font-size: 18px;
	line-height: 1.68;
}

body.ffp-site-framework-v1 .ffp-article-components > :first-child {
	margin-top: 0;
}

body.ffp-site-framework-v1 .ffp-article-components h2,
body.ffp-site-framework-v1 .ffp-article-components h3 {
	color: var(--ffp-color-primary);
	scroll-margin-top: 32px;
}

body.ffp-site-framework-v1 .ffp-article-components blockquote,
body.ffp-site-framework-v1 .ffp-affiliate-disclosure {
	border: 1px solid var(--ffp-color-neutral);
	border-left: 5px solid var(--ffp-color-secondary);
	border-radius: var(--ffp-radius-md);
	background: var(--ffp-color-surface);
	color: var(--ffp-color-primary);
}

body.ffp-site-framework-v1 .ffp-waders__contents {
	margin: 1.5rem 0 2rem;
	padding: 1.1rem 1.25rem;
	border: 1px solid var(--ffp-color-neutral);
	border-radius: var(--ffp-radius-md);
	background: var(--ffp-color-surface);
}

body.ffp-site-framework-v1 .ffp-waders__contents ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem 1.25rem;
	margin: 0.6rem 0 0;
	padding-left: 1.1rem;
}

body.ffp-site-framework-v1 .ffp-waders__review {
	margin: 2.75rem 0;
	padding-top: 0.25rem;
	border-top: 4px solid var(--ffp-color-secondary);
}

body.ffp-site-framework-v1 .ffp-waders__rank,
body.ffp-site-framework-v1 .ffp-waders__evidence,
body.ffp-site-framework-v1 .ffp-waders__research-label {
	display: inline-block;
	margin: 0 0 0.5rem;
	padding: 0.35rem 0.65rem;
	border-radius: var(--ffp-radius-sm);
	background: var(--ffp-color-neutral);
	color: var(--ffp-color-primary);
	font-size: 0.82rem;
	font-weight: 700;
}

body.ffp-site-framework-v1 .ffp-waders__review h2 {
	margin-top: 0.4rem;
}

body.ffp-site-framework-v1 .ffp-waders__figure {
	margin: 1rem 0 1.25rem;
}

body.ffp-site-framework-v1 .ffp-waders__figure img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	border-radius: var(--ffp-radius-md);
	object-fit: cover;
}

body.ffp-site-framework-v1 .ffp-waders__generation {
	margin: 1.15rem 0;
	padding: 1rem 1.1rem;
	border-left: 4px solid var(--ffp-color-secondary);
	background: var(--ffp-color-surface);
}

body.ffp-site-framework-v1 .ffp-waders__facts,
body.ffp-site-framework-v1 .ffp-waders__pros-cons,
body.ffp-site-framework-v1 .ffp-waders__alternatives {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	margin: 1.2rem 0;
}

body.ffp-site-framework-v1 .ffp-waders__facts > div,
body.ffp-site-framework-v1 .ffp-waders__pros-cons > div,
body.ffp-site-framework-v1 .ffp-waders__alternative {
	min-width: 0;
	padding: 1rem;
	border: 1px solid var(--ffp-color-neutral);
	border-radius: var(--ffp-radius-md);
	background: var(--ffp-color-white);
}

body.ffp-site-framework-v1 .ffp-waders__facts strong,
body.ffp-site-framework-v1 .ffp-waders__facts span {
	display: block;
}

body.ffp-site-framework-v1 .ffp-waders__facts span,
body.ffp-site-framework-v1 .ffp-waders__caveat {
	color: var(--ffp-color-primary);
	font-size: 0.92rem;
}

body.ffp-site-framework-v1 .ffp-waders__pros {
	border-top: 4px solid var(--ffp-color-secondary) !important;
	background: var(--ffp-color-surface) !important;
}

body.ffp-site-framework-v1 .ffp-waders__cons {
	border-top: 4px solid var(--ffp-color-neutral) !important;
	background: var(--ffp-color-surface) !important;
}

body.ffp-site-framework-v1 .ffp-waders__pros-cons h3 {
	margin: 0 0 0.5rem;
}

body.ffp-site-framework-v1 .ffp-waders__pros-cons ul {
	margin: 0.25rem 0;
	padding-left: 1.2rem;
}

/* Reserve Astra's intended two-row desktop header before Cantarell settles. */
@media (min-width: 1001px) and (max-width: 1049px) {
	body.ffp-site-framework-v1 #masthead .site-branding {
		flex: 0 0 220px !important;
	}
}

@media (max-width: 800px) {
	body.ffp-site-framework-v1 .entry-content table:not(.ffp-comparison__table),
	body.ffp-site-framework-v1 .elementor-widget-text-editor table:not(.ffp-comparison__table),
	body.ffp-site-framework-v1 .ffp-article-content table:not(.ffp-comparison__table) {
		display: block;
		width: 100% !important;
		max-width: 100% !important;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
	}

	body.ffp-site-framework-v1 .ffp-buy-box__choices,
	body.ffp-site-framework-v1 .ffp-waders__facts,
	body.ffp-site-framework-v1 .ffp-waders__pros-cons,
	body.ffp-site-framework-v1 .ffp-waders__alternatives {
		grid-template-columns: 1fr;
	}

	body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-option {
		display: flex;
		align-items: stretch;
	}

	body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-button,
	body.ffp-site-framework-v1 .ffp-buy-box--compact .ffp-buy-button {
		width: 100%;
		margin-top: 0.25rem;
	}
}

@media (max-width: 600px) {
	body.ffp-site-framework-v1 .ffp-article-components {
		font-size: 17px;
	}

	body.ffp-site-framework-v1 .ffp-waders__contents ul {
		display: block;
	}
}
