/*
Theme Name: Rando Camp
Description: Thème enfant GeneratePress de rando-camp.com, carnet de randonnée et de camping en France. Maquette 8a : thème jour « carnet de terrain » et thème nuit « nuit de bivouac » (bouton Nuit / Jour), Fraunces, DM Sans et Caveat hébergées, crête de montagne en pointillés, polaroïds et tampon, peau des blocs Fox Blocks et Fox Affiliate. Socle Fox embarqué (fox-socle/). Présentation seulement.
Author: Fox
Template: generatepress
Version: 1.0.0
Fox Socle: 1.2.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rando-camp-theme
*/

/*
 * Colours: the GeneratePress palette of inc/site.php, through its variables
 * (--contrast ink, --contrast-2 ink 2, --contrast-3 line, --base sunken,
 * --base-2 page, --base-3 surface, --accent tomato, --highlight anise).
 * The night theme redefines them twice below: under prefers-color-scheme
 * (unless the visitor chose day) and under html[data-theme="night"].
 * --rc-day / --rc-night switch what only one theme shows (.rc-day, .rc-night).
 * Floor: 12 px for any text. No backslash escape anywhere in this file.
 */

:root {
	--rc-serif: "Fraunces", Georgia, "Times New Roman", serif;
	--rc-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--rc-hand: "Caveat", "Segoe Print", "Bradley Hand", cursive;
	--rc-on-accent: #fff;
	--rc-on-hl: #1b1f3b;
	--rc-paper: #fff;
	--rc-line-strong: #9fb4cc;
	--rc-rule: #dde6f0;
	--rc-band: #1b1f3b;
	--rc-band-text: #fff;
	--rc-band-accent: #c7e36b;
	--rc-feature: #1b1f3b;
	--rc-feature-text: #fff;
	--rc-feature-accent: #c7e36b;
	--rc-moment4: #3e4866;
	--rc-ph1: #b9cbdd;
	--rc-ph2: #c7d9bf;
	--rc-ph3: #d9cbb9;
	--rc-ridge: #9fb4cc;
	--rc-ok: #2e7d32;
	--rc-ko: #b3261e;
	--rc-warn: #8a5a00;
	--rc-day: inline;
	--rc-night: none;
	--rc-crest: url("assets/img/crete-jour.svg");
	--rc-sky: none;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="day"]) {
		--contrast: #e9eef7;
		--contrast-2: #b4bfd2;
		--contrast-3: #2c3b58;
		--base: #121d31;
		--base-2: #0e1626;
		--base-3: #172238;
		--accent: #f2a541;
		--highlight: #6fd3c1;
		--rc-on-accent: #0e1626;
		--rc-on-hl: #0e1626;
		--rc-paper: #1e2b45;
		--rc-line-strong: #3d5078;
		--rc-rule: #24324d;
		--rc-band: #f2a541;
		--rc-band-text: #0e1626;
		--rc-band-accent: #0e1626;
		--rc-feature: #f2a541;
		--rc-feature-text: #0e1626;
		--rc-feature-accent: #0e1626;
		--rc-moment4: #6fd3c1;
		--rc-ph1: #22324f;
		--rc-ph2: #26384f;
		--rc-ph3: #2e3550;
		--rc-ridge: #34466a;
		--rc-ok: #7bd88f;
		--rc-ko: #ff8f84;
		--rc-warn: #f2c26b;
		--rc-day: none;
		--rc-night: inline;
		--rc-crest: none;
		--rc-sky: url("assets/img/nuit.svg");
		color-scheme: dark;
	}
}

:root[data-theme="night"] {
	--contrast: #e9eef7;
	--contrast-2: #b4bfd2;
	--contrast-3: #2c3b58;
	--base: #121d31;
	--base-2: #0e1626;
	--base-3: #172238;
	--accent: #f2a541;
	--highlight: #6fd3c1;
	--rc-on-accent: #0e1626;
	--rc-on-hl: #0e1626;
	--rc-paper: #1e2b45;
	--rc-line-strong: #3d5078;
	--rc-rule: #24324d;
	--rc-band: #f2a541;
	--rc-band-text: #0e1626;
	--rc-band-accent: #0e1626;
	--rc-feature: #f2a541;
	--rc-feature-text: #0e1626;
	--rc-feature-accent: #0e1626;
	--rc-moment4: #6fd3c1;
	--rc-ph1: #22324f;
	--rc-ph2: #26384f;
	--rc-ph3: #2e3550;
	--rc-ridge: #34466a;
	--rc-ok: #7bd88f;
	--rc-ko: #ff8f84;
	--rc-warn: #f2c26b;
	--rc-day: none;
	--rc-night: inline;
	--rc-crest: none;
	--rc-sky: url("assets/img/nuit.svg");
	color-scheme: dark;
}

/* Fox Blocks and Fox Affiliate tokens the socle does not map yet (text on
   the accent, borders, fonts, state colours). Set on body, over the plugin
   :root defaults; the mapped ones (accent, text, surfaces) stay the socle's.
   To remove once the socle maps them (see .foxrepo-docs/CHANGES.md). */
body {
	--fxb-on-accent: var(--rc-on-accent);
	--fxb-accent-soft: color-mix(in srgb, var(--accent) 12%, transparent);
	--fxb-border: var(--contrast-3);
	--fxb-border-strong: var(--rc-line-strong);
	--fxb-text-tertiary: var(--contrast-2);
	--fxb-font-display: var(--rc-serif);
	--fxb-font-body: var(--rc-sans);
	--fxb-success: var(--rc-ok);
	--fxb-error: var(--rc-ko);
	--fxb-warning: var(--rc-warn);
	--fox-btn-text: var(--rc-on-accent);
	--fox-border: var(--contrast-3);
	--fox-bg-badge: var(--base);
	--fox-price: var(--contrast);
	--fox-font: var(--rc-sans);
	--fox-img-bg: var(--rc-paper);
	--fox-shadow: none;
	background: var(--base-2);
	color: var(--contrast);
	font-family: var(--rc-sans);
	font-size: 17px;
	line-height: 1.6;
}

button,
input,
select,
textarea {
	font-family: var(--rc-sans);
}

h1,
h2,
h3,
h4,
.main-title {
	font-family: var(--rc-serif);
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.15;
	color: var(--contrast);
}

h1 { font-size: clamp(34px, 5vw, 56px); }
h2 { font-size: clamp(28px, 3.6vw, 36px); }
h3 { font-size: 22px; }
h4 { font-size: 19px; }

a { text-underline-offset: 3px; }

.rc-day { display: var(--rc-day); }
.rc-night { display: var(--rc-night); }

.rc-note,
.rc-eyebrow {
	font-family: var(--rc-hand);
	font-weight: 500;
	font-size: 24px;
	line-height: 1.2;
	color: var(--accent);
}

.rc-eyebrow {
	margin: 0 0 6px;
	font-size: 26px;
}

.rc-eyebrow a {
	color: inherit;
	text-decoration: none;
}

/* ---------------------------------------------------------------- header */

.site-header {
	border-bottom: 1px solid var(--contrast-3);
}

.inside-header {
	padding: 18px 24px;
}

.main-title {
	font-size: 24px;
	line-height: 1;
	margin: 0;
}

.main-title a {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	text-decoration: none;
}

.rc-logo {
	width: 46px;
	height: 46px;
	flex: none;
}

.rc-l-r { fill: var(--rc-ridge); }
.rc-l-t { fill: var(--contrast); }
.rc-l-a { fill: var(--accent); }
.rc-l-s { fill: var(--contrast); }
.rc-l-ray,
.rc-l-p {
	fill: none;
	stroke-width: 2.3;
	stroke-linecap: round;
}
.rc-l-ray { stroke: var(--accent); }
.rc-l-p { stroke: var(--contrast); }

.rc-name { text-transform: lowercase; }

.rc-tagline {
	font-family: var(--rc-hand);
	font-weight: 500;
	font-size: 22px;
	letter-spacing: 0;
	color: var(--accent);
}

.main-navigation .main-nav > ul {
	gap: 8px;
	align-items: center;
}

.main-navigation .main-nav ul li a {
	margin: 4px 0;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--base-3);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	box-shadow: inset 0 0 0 2px var(--contrast);
}

.main-navigation .menu-bar-items {
	align-items: center;
	margin-left: 8px;
}

.rc-toggle {
	display: none;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 16px;
	border: 1px solid var(--contrast-3);
	border-radius: 999px;
	background: var(--contrast);
	color: var(--base-2);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.rc-js .rc-toggle { display: inline-flex; }

.rc-toggle:hover,
.rc-toggle:focus {
	background: var(--accent);
	color: var(--rc-on-accent);
}

.rc-toggle svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

/* ------------------------------------------------------- buttons, links */

.entry-content a {
	text-decoration-color: var(--accent);
	text-decoration-thickness: 2px;
}

.entry-content a:hover {
	color: var(--contrast);
	text-decoration-color: var(--contrast);
}

.wp-block-button__link,
.fxb-smartlink--button,
.fox-showcase__btn,
.fox-hl__btn,
.fct-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 0 24px;
	border: 2px solid var(--accent);
	border-radius: 14px;
	background: var(--accent);
	color: var(--rc-on-accent);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
}

.entry-content .wp-block-button__link,
.entry-content .fxb-smartlink--button,
.entry-content .fox-product-link.fox-showcase__btn,
.entry-content .fox-product-link.fox-hl__btn,
.entry-content .fox-product-link.fct-btn {
	color: var(--rc-on-accent);
	text-decoration: none;
}

.entry-content .wp-block-button__link:hover,
.entry-content .fxb-smartlink--button:hover,
.entry-content .fox-product-link.fox-showcase__btn:hover,
.entry-content .fox-product-link.fox-hl__btn:hover,
.entry-content .fox-product-link.fct-btn:hover {
	border-color: var(--contrast);
	background: var(--contrast);
	color: var(--base-2);
}

.entry-content .is-style-outline .wp-block-button__link {
	border-color: var(--contrast);
	background: transparent;
	color: var(--contrast);
}

.entry-content .is-style-outline .wp-block-button__link:hover {
	background: var(--contrast);
	color: var(--base-2);
}

/* ------------------------------------------------------------------ home */

/* Full-bleed bands of the home: #page goes full width and clips them (body
   cannot: its overflow propagates to the viewport); the content keeps the
   1180 px container. */
.rc-home .site.grid-container {
	max-width: none;
	overflow-x: clip;
}

.rc-home .site-content {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 24px;
}

.rc-home .entry-content > * {
	margin-top: 0;
	margin-bottom: 0;
}

[class*="rc-"] > .wp-block-group__inner-container {
	max-width: none;
	margin: 0;
	padding: 0;
}

.rc-hero {
	position: relative;
	isolation: isolate;
	padding: 56px 0 190px;
}

.rc-hero::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0 calc(50% - 50vw);
	background: var(--rc-sky) center bottom / cover no-repeat;
}

.rc-hero__grid.wp-block-columns {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 11fr) minmax(0, 10fr);
	gap: 40px;
	align-items: end;
	margin: 0;
}

/* The day crest. Its viewBox is 1000 x 230 (preserveAspectRatio none): x
   stretches with the box below, y is 1:1. Two summits are pinned to the
   content: u = 480 (y 40) to the centre of the note « commencez par ici »
   (right-aligned in the 11fr column, about 180 px wide) and u = 520 (y 10) to the
   centre of the stamp (2 % into the 10fr column, 104 px wide, 30 px up).
   Solving L + 0.48 Wd = xA and L + 0.52 Wd = xB for a grid width W gives the
   left and width below, exact at every width from 900 px up. */
.rc-hero__grid::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: calc(100% - 40px);
	left: calc(40.952% - 2420px);
	width: calc(23.81% + 4790px);
	height: 230px;
	background: var(--rc-crest) 0 0 / 100% 100% no-repeat;
	pointer-events: none;
}

.rc-hero__grid > .wp-block-column > * {
	margin-top: 0;
	margin-bottom: 0;
}

.rc-kicker {
	margin: 0 0 14px !important;
	color: var(--accent);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.rc-hero__title {
	font-size: clamp(46px, 7vw, 92px);
	line-height: 1.1;
	letter-spacing: -.015em;
}

.rc-hl {
	padding: .02em .2em;
	background: var(--highlight);
	color: var(--rc-on-hl);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

.rc-lede {
	max-width: 46ch;
	margin: 36px 0 34px !important;
	color: var(--contrast-2);
	font-size: 19px;
}

.rc-hero__cta.is-layout-flex {
	gap: 12px;
	align-items: flex-end;
}

.rc-hero__cta .wp-block-buttons {
	gap: 12px;
}

.rc-hero__cta .rc-hero__note {
	margin: 0 0 0 auto;
	text-align: right;
}

.rc-hero__photos {
	position: relative;
	padding-top: 130px;
}

.rc-polaroid {
	padding: 12px 12px 18px;
	background: var(--rc-paper);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.rc-polaroid--1 {
	position: absolute;
	top: 20px;
	left: 4%;
	width: 62%;
	transform: rotate(-5deg);
}

.rc-polaroid--2 {
	position: relative;
	width: 54%;
	margin-left: 44% !important;
	transform: rotate(4deg);
}

.rc-polaroid--2::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: -14px;
	left: 14%;
	width: 110px;
	height: 28px;
	background: var(--highlight);
	opacity: .9;
	transform: rotate(-12deg);
}

.rc-ph,
.rc-feature__ph {
	display: flex;
	align-items: flex-end;
	aspect-ratio: 1;
	padding: 10px;
	background: var(--rc-ph1);
	color: var(--contrast-2);
	font-size: 12px;
}

.rc-ph--2 { background: var(--rc-ph2); }

.rc-ph p,
.rc-polaroid__cap {
	margin: 0;
}

.rc-polaroid__cap {
	margin-top: 10px !important;
	font-family: var(--rc-hand);
	font-size: 24px;
	line-height: 1.2;
	text-align: center;
}

.rc-stamp {
	position: absolute;
	z-index: 2;
	bottom: 30px;
	left: 2%;
	display: grid;
	place-items: center;
	width: 104px;
	height: 104px;
	margin: 0 !important;
	border: 2px solid var(--accent);
	border-radius: 50%;
	color: var(--accent);
	font-family: var(--rc-serif);
	font-size: 14px;
	line-height: 1.1;
	text-align: center;
	text-transform: uppercase;
	transform: rotate(14deg);
}

.rc-band {
	padding: 18px 0;
	gap: 10px 28px;
	background: var(--rc-band);
	box-shadow: 0 0 0 100vmax var(--rc-band);
	clip-path: inset(0 -100vmax);
	color: var(--rc-band-text);
	font-family: var(--rc-serif);
	font-size: 18px;
}

.rc-band p,
.rc-band ul {
	margin: 0;
}

.rc-band__label { color: var(--rc-band-accent); }

.rc-band__list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	padding: 0;
	list-style: none;
}

.rc-band__list li { margin: 0; }

.rc-band__list li + li::before {
	content: "✶" / "";
	margin-right: 28px;
}

.rc-section {
	padding: 72px 0 24px;
}

.rc-section:last-child {
	padding-bottom: 80px;
}

.rc-sec-head.is-layout-flex {
	gap: 6px 18px;
	align-items: baseline;
	margin-bottom: 28px !important;
}

.rc-sec-head h2 {
	margin: 0;
	font-size: clamp(32px, 4vw, 44px);
	letter-spacing: -.03em;
}

.rc-sec-head .rc-note { margin: 0; }

.rc-grid > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.rc-grid--4 > .wp-block-group__inner-container {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rc-rub,
.rc-moment,
.rc-tag {
	position: relative;
	margin: 0 !important;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.rc-rub,
.rc-tag {
	border-radius: 14px 40px 40px 14px;
}

.rc-rub > .wp-block-group__inner-container,
.rc-tag > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 0 16px;
	align-items: center;
	padding: 20px;
}

.rc-rub p,
.rc-rub h3,
.rc-moment p,
.rc-moment h3,
.rc-tag p,
.rc-tag h3 {
	margin: 0;
}

.rc-rub__n {
	grid-row: span 2;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 2px dashed var(--accent);
	border-radius: 50%;
	color: var(--accent);
	font-family: var(--rc-serif);
	font-size: 14px;
}

.rc-rub__title { font-size: 21px; }

.rc-rub__text,
.rc-moment p:last-child,
.rc-tag p {
	color: var(--contrast-2);
	font-size: 15px;
}

/* Whole card clickable: the heading link stretches over its card. */
.rc-rub h3 a,
.rc-moment h3 a,
.rc-tag h3 a,
.rc-feature__title a,
.rc-latest .fxb-lcard__title-link {
	color: inherit;
	text-decoration: none;
}

.rc-rub h3 a::after,
.rc-moment h3 a::after,
.rc-tag h3 a::after,
.rc-feature__title a::after,
.rc-latest .fxb-lcard__title-link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.rc-rub:hover,
.rc-moment:hover,
.rc-tag:hover,
.rc-latest .fxb-lcard:hover {
	box-shadow: 0 0 0 2px var(--contrast);
}

.rc-moment {
	border-radius: 16px;
}

.rc-moment > .wp-block-group__inner-container {
	padding: 22px;
}

.rc-moment__when {
	font-family: var(--rc-hand);
	font-size: 40px;
	line-height: 1;
	color: var(--accent);
}

.rc-moment:last-child .rc-moment__when { color: var(--rc-moment4); }

.rc-moment__title {
	margin: 12px 0 6px !important;
	font-size: 20px;
}

/* Les dernières pages: Fox Blocks link-cards, as pinned polaroids. */
.rc-latest .fxb-link-cards__list {
	gap: 32px;
}

.rc-latest .fxb-lcard {
	position: relative;
	padding: 14px 14px 22px;
	border: 0;
	border-radius: 6px;
	background: var(--rc-paper);
	box-shadow: 0 0 0 1px var(--contrast-3);
	transform: rotate(-1.5deg);
}

.rc-latest li:nth-child(2) .fxb-lcard { transform: rotate(1deg); }
.rc-latest li:nth-child(3) .fxb-lcard { transform: rotate(-.5deg); }

.rc-latest .fxb-lcard:not(:has(img))::before {
	content: "[photo]";
	display: flex;
	align-items: flex-end;
	aspect-ratio: 4 / 3;
	padding: 10px;
	background: var(--rc-ph1);
	color: var(--contrast-2);
	font-size: 12px;
}

.rc-latest li:nth-child(2) .fxb-lcard::before { background: var(--rc-ph2); }
.rc-latest li:nth-child(3) .fxb-lcard::before { background: var(--rc-ph3); }

.rc-latest .fxb-lcard__body { padding: 0; }

.rc-latest .fxb-lcard__cat {
	display: block;
	margin: 14px 0 4px;
	padding: 0;
	background: none;
	color: var(--accent);
	font-family: var(--rc-hand);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: lowercase;
}

.rc-latest .fxb-lcard__title {
	font-family: var(--rc-serif);
	font-size: 22px;
	line-height: 1.2;
}

.rc-duo > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
	gap: 20px;
}

.rc-feature .wp-block-post-template {
	margin: 0;
	padding: 0;
	list-style: none;
}

.rc-feature .wp-block-post {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 360px;
	margin: 0;
	padding: 28px;
	border-radius: 20px;
	background: var(--rc-feature);
	color: var(--rc-feature-text);
}

.rc-feature .wp-block-post > * { margin: 0; }

.rc-feature__ph.wp-block-paragraph {
	aspect-ratio: auto;
	margin-bottom: auto !important;
	padding: 0;
	background: none;
	color: inherit;
	font-size: 13px;
}

.rc-feature .wp-block-post:has(.rc-feature__img) .rc-feature__ph { display: none; }

.rc-feature__img {
	margin-bottom: 16px !important;
	overflow: hidden;
	border-radius: 12px;
}

.rc-feature__note.rc-note {
	margin-bottom: 8px !important;
	color: var(--rc-feature-accent);
	font-size: 26px;
}

.rc-feature__title {
	color: inherit;
	font-size: 32px;
	line-height: 1.1;
}

.rc-bag > .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.rc-bag__title {
	margin: 0;
	font-size: 26px;
}

.rc-tag > .wp-block-group__inner-container {
	grid-template-columns: 16px minmax(0, 1fr);
	padding: 18px;
}

.rc-tag > .wp-block-group__inner-container::before {
	content: "";
	grid-row: span 2;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--base-2);
	box-shadow: 0 0 0 2px var(--contrast);
}

.rc-tag__title { font-size: 20px; }

.rc-tag--hl {
	background: var(--highlight);
	box-shadow: none;
	color: var(--rc-on-hl);
}

.rc-tag--hl h3,
.rc-tag--hl p { color: var(--rc-on-hl); }

.rc-tag--hl > .wp-block-group__inner-container::before { box-shadow: 0 0 0 2px var(--rc-on-hl); }

/* --------------------------------------------- article, page, archive */

.site-content .inside-article,
.page-header {
	background: transparent;
}

.no-sidebar:not(.rc-home) .site-main > article,
.no-sidebar .page-header {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.entry-header .entry-title {
	margin-bottom: 12px;
}

.entry-meta {
	color: var(--contrast-2);
	font-size: 14px;
}

.entry-content > h2 {
	margin: 1.8em 0 .5em;
}

.entry-content > h3 {
	margin: 1.5em 0 .4em;
}

.entry-content ul li::marker,
.entry-content ol li::marker {
	color: var(--accent);
}

.entry-content blockquote {
	margin: 1.5em 0;
	padding: 4px 0 4px 20px;
	border-left: 3px solid var(--accent);
	font-size: 19px;
}

.entry-content .wp-block-table table,
.entry-content table {
	border-collapse: collapse;
	border: 1px solid var(--contrast-3);
}

.entry-content th,
.entry-content td {
	padding: 10px 12px;
	border: 1px solid var(--contrast-3);
}

.blog .site-main > article,
.archive .site-main > article,
.search .site-main > article {
	position: relative;
	margin-bottom: 16px;
	padding: 24px 28px;
	border-radius: 14px 40px 40px 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.blog .site-main > article .inside-article,
.archive .site-main > article .inside-article {
	padding: 0;
}

.blog .entry-title,
.archive .entry-title {
	font-size: 26px;
}

.page-header .page-title { margin: 0; }

.taxonomy-description {
	color: var(--contrast-2);
}

.widget-area .widget-title,
.widget-area .wp-block-heading {
	font-size: 22px;
}

.wp-block-search__button {
	border: 0;
	border-radius: 10px;
	background: var(--accent);
	color: var(--rc-on-accent);
	font-weight: 700;
}

/* ---------------------------------------------------------------- footer */

.site-info {
	font-size: 14px;
}

.inside-site-info {
	padding: 28px 24px 36px;
}

.site-info .copyright-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	text-align: left;
}

.rc-foot-brand {
	font-family: var(--rc-serif);
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.02em;
}

.rc-foot-end,
.rc-foot-menu {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rc-foot-menu li { margin: 0; }

.site-info a {
	text-decoration: underline;
}

/* ------------------------------------------------------ Fox Blocks skin */

/* key-points: an index card of the field notebook (ruled, red margin). */
.entry-content .fxb-key-points-block {
	margin: 2em 0;
	padding: 22px 24px 22px 56px;
	border: 0;
	border-radius: 6px;
	background:
		linear-gradient(90deg, transparent 38px, var(--accent) 38px 39px, transparent 39px),
		repeating-linear-gradient(var(--rc-paper) 0 31px, var(--rc-rule) 31px 32px);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.fxb-key-points__heading {
	margin: 0 0 12px;
	color: var(--accent);
	font-family: var(--rc-hand);
	font-size: 28px;
	font-weight: 500;
	line-height: 1.15;
}

.fxb-key-points__item {
	border: 0;
	background: transparent;
}

.entry-content .fxb-key-points__number {
	display: grid;
	place-items: center;
	flex: none;
	width: 36px;
	height: 36px;
	border: 2px dashed var(--accent);
	border-radius: 50%;
	background: transparent;
	color: var(--accent);
	font-family: var(--rc-serif);
	font-size: 15px;
	font-weight: 800;
}

.fxb-key-points__title {
	margin: 0 0 4px;
	font-size: 18px;
}

/* expert-tip: a handwritten note taped in the notebook. */
.entry-content .fxb-expert-tip {
	position: relative;
	margin: 2.2em 0;
	padding: 24px 24px 20px;
	border: 0;
	border-radius: 4px;
	background: color-mix(in srgb, var(--highlight) 20%, var(--base-3));
	box-shadow: 0 0 0 1px var(--contrast-3);
	color: var(--contrast);
	transform: rotate(-.6deg);
}

.entry-content .fxb-expert-tip::before {
	content: "";
	position: absolute;
	top: -12px;
	left: calc(50% - 50px);
	width: 100px;
	height: 24px;
	background: var(--highlight);
	opacity: .85;
	transform: rotate(-3deg);
}

.entry-content .fxb-expert-tip--warning {
	background: color-mix(in srgb, var(--accent) 10%, var(--base-3));
}

.entry-content .fxb-expert-tip--warning::before { background: var(--accent); }

.fxb-expert-tip__icon { color: var(--accent); }

.entry-content .fxb-expert-tip__title {
	display: block;
	margin-bottom: 4px;
	color: var(--accent);
	font-family: var(--rc-hand);
	font-size: 30px;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: 0;
}

.fxb-expert-tip__content p { margin: 0; }

/* verdict-box: a rubber stamp, double ring in the accent. */
.entry-content .fxb-verdict-box {
	margin: 2.2em 0;
	padding: 26px 28px;
	border: 2px solid var(--accent);
	border-radius: 12px;
	background: var(--rc-paper);
	box-shadow: inset 0 0 0 5px var(--rc-paper), inset 0 0 0 6px var(--accent);
	transform: rotate(-.8deg);
}

.entry-content .fxb-verdict-box .fxb-badge {
	display: inline-block;
	padding: 4px 12px;
	border: 2px solid var(--accent);
	border-radius: 999px;
	background: transparent;
	color: var(--accent);
	font-family: var(--rc-serif);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	transform: rotate(-4deg);
}

.fxb-verdict-box__title {
	margin: 12px 0 8px;
	font-size: 24px;
}

.fxb-verdict-box__text { font-size: 18px; }

.fxb-verdict-box__hint { color: var(--contrast-2); }

/* pros-cons: two notebook cards, headings underlined by the highlighter. */
.entry-content .fxb-pros-cons {
	gap: 16px;
	margin: 2em 0;
}

.entry-content .fxb-pros-cons__column {
	padding: 20px 22px;
	border: 0;
	border-radius: 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.fxb-pros-cons__heading {
	display: inline-block;
	margin: 0 0 10px;
	font-size: 19px;
	background: linear-gradient(transparent 60%, color-mix(in srgb, var(--highlight) 70%, transparent) 60%);
}

.fxb-pros-cons__column--cons .fxb-pros-cons__heading {
	background: linear-gradient(transparent 60%, color-mix(in srgb, var(--accent) 30%, transparent) 60%);
}

/* criteria-scores: thin bars. */
.entry-content .fxb-scores {
	padding: 20px 22px;
	border: 0;
	border-radius: 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.fxb-scores__title {
	margin: 0 0 14px;
	font-size: 20px;
}

.fxb-scores__name { font-family: var(--rc-serif); font-weight: 800; }

.entry-content .fxb-scores [class*="__track"],
.entry-content .fxb-scores [class*="__bar-bg"] {
	height: 4px;
	border-radius: 2px;
	background: var(--contrast-3);
}

.entry-content .fxb-scores [class*="__fill"] {
	height: 4px;
	border-radius: 2px;
	background: var(--accent);
}

/* comparison-table and Fox Affiliate comparison: ruled table. */
.entry-content .fxb-ctable,
.entry-content .fct-wrap {
	margin: 2em 0;
}

.fxb-ctable__title { font-size: 20px; }

.entry-content .fxb-ctable__table,
.entry-content .fct-table {
	border: 0;
	border-radius: 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.entry-content .fxb-ctable__table th,
.entry-content .fxb-ctable__table td,
.entry-content .fct-table th,
.entry-content .fct-table td {
	border: 0;
	border-bottom: 1px dashed var(--contrast-3);
	background: transparent;
	color: var(--contrast);
}

.entry-content .fxb-ctable__table thead th,
.entry-content .fct-table thead th {
	border-bottom: 2px solid var(--contrast);
	font-family: var(--rc-serif);
	font-weight: 800;
}

.entry-content .fxb-ctable__pname,
.entry-content .fct-th__title {
	color: var(--contrast);
	font-family: var(--rc-serif);
	font-weight: 800;
}

.fxb-ctable__yes { color: var(--rc-ok); }
.fxb-ctable__no { color: var(--rc-ko); }

/* faq: questions as Fraunces headings, dashed separators. */
.entry-content .fxb-faq__item {
	border: 0;
	border-bottom: 1px dashed var(--rc-line-strong);
	border-radius: 0;
	background: transparent;
}

.entry-content .fxb-faq__question-text {
	font-family: var(--rc-serif);
	font-size: 19px;
	font-weight: 800;
}

.fxb-faq__icon { color: var(--accent); }

/* link-cards in an article: notebook cards with the tag radius. */
.entry-content .fxb-link-cards:not(.rc-latest *) .fxb-lcard {
	border: 0;
	border-radius: 14px 40px 40px 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
}

.fxb-lcard__title {
	font-family: var(--rc-serif);
	font-weight: 800;
}

.fxb-lcard__excerpt { color: var(--contrast-2); }

.entry-content .fxb-lcard__cta {
	color: var(--accent);
	font-weight: 700;
	text-decoration: none;
}

.entry-content .fxb-smartlink--link {
	color: var(--contrast);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-decoration-thickness: 2px;
}

.entry-content a.fxb-smartlink--inline {
	color: var(--contrast);
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-decoration-thickness: 2px;
}

.fxb-smartlink--pending {
	color: inherit;
	text-decoration: none;
}

.entry-content .fxb-smartlink--button.fxb-smartlink--pending {
	border-style: dashed;
	border-color: var(--contrast-3);
	background: transparent;
	color: var(--contrast-2);
}

/* --------------------------------------------------- Fox Affiliate skin */

/* product and highlight cards: luggage tags (round end, eyelet). */
.entry-content .fox-showcase,
.entry-content .fox-hl__item {
	position: relative;
	border: 0;
	border-radius: 40px 14px 14px 40px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
	color: var(--contrast);
}

.entry-content .fox-showcase {
	padding-left: 52px;
}

.entry-content .fox-showcase::before,
.entry-content .fox-hl__item::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 22px;
	left: 20px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--base-2);
	box-shadow: 0 0 0 2px var(--contrast);
}

.entry-content .fox-showcase__title a,
.entry-content .fox-hl__product-title a {
	color: var(--contrast);
	font-family: var(--rc-serif);
	font-weight: 800;
	text-decoration: none;
}

.entry-content .fox-hl__desc,
.entry-content .fox-box__availability {
	color: var(--contrast-2);
}

.entry-content .fct-td--label,
.entry-content .fct-na,
.entry-content .fct-card__spec-label {
	color: var(--contrast-2);
}

.entry-content .fct-card {
	border: 0;
	border-radius: 14px;
	background: var(--base-3);
	box-shadow: 0 0 0 1px var(--contrast-3);
	color: var(--contrast);
}

.entry-content .fct-card__title a { color: var(--contrast); }

.entry-content .fox-showcase::before {
	top: calc(50% - 8px);
}

/* The badge of a highlight card: a handwritten label next to the eyelet. */
.entry-content .fox-hl .fox-hl-badge {
	padding: 14px 20px 0 48px;
	border: 0;
	background: transparent;
	color: var(--accent);
	font-family: var(--rc-hand);
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}

/* Fox Affiliate colours and sizes written in its stylesheet instead of its
   tokens (light fills, green stock label, 11 px labels): the skin puts them
   back on the palette. Listed as defects of the plugin. */
.entry-content .fct-table .fct-td,
.entry-content .fct-card__footer {
	background: transparent;
}

.entry-content .fct-row--cta .fct-td,
.entry-content .fct-card__footer {
	background: var(--base);
}

.entry-content .fct-avail--yes,
.entry-content .fox-box__availability {
	color: var(--rc-ok);
}

.entry-content .fct-td--label,
.entry-content .fct-avail,
.entry-content .fct-card__spec-label,
.entry-content .fox-box__availability {
	font-size: 12px;
}

/* Card dots of the comparison carousel: an 8 px dot in a 24 px target
   (WCAG 2.2 target size; the plugin draws 7 px buttons). */
.entry-content .fct-cards-dot {
	box-sizing: content-box;
	width: 8px;
	height: 8px;
	padding: 8px;
	background-clip: content-box;
	background-color: var(--contrast-3);
	transform: none;
}

.entry-content .fct-cards-dot.is-active {
	background-color: var(--accent);
}

.fox-sticky-bar .fox-sticky-bar__inner {
	background: var(--base-3);
	box-shadow: 0 -1px 0 var(--contrast-3);
	color: var(--contrast);
}

.fox-sticky-bar .fox-sticky-bar__img-wrap { background: var(--rc-paper); }

.fox-sticky-bar .fox-sticky-bar__title { color: var(--contrast); }

.fox-sticky-bar .fox-sticky-bar__close { color: var(--contrast-2); }

.fox-sticky-bar .fox-sticky-bar__close:hover { background: var(--base); color: var(--contrast); }

/* ------------------------------------------------------------ responsive */

@media (min-width: 769px) and (max-width: 1060px) {
	.rc-tagline { display: none; }
	.main-navigation .main-nav ul li a { padding: 8px 11px; font-size: 14px; }
}

@media (max-width: 1024px) {
	.rc-grid--4 > .wp-block-group__inner-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.rc-hero { padding: 40px 0 160px; }
	.rc-hero::before { background-position: 62% bottom; }
	.rc-hero__grid.wp-block-columns { grid-template-columns: minmax(0, 1fr); gap: 48px; }
	.rc-hero__grid::after { top: calc(100% + 30px); left: calc(50% - 2000px); width: 4000px; height: 120px; }
	.rc-hero__photos { width: 100%; max-width: 460px; margin: 0 auto; }
	.rc-hero__cta .rc-hero__note { width: auto; margin-left: 0; }
	.rc-grid > .wp-block-group__inner-container,
	.rc-duo > .wp-block-group__inner-container { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.rc-duo > .wp-block-group__inner-container { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
	.inside-header { padding: 14px 16px; }
	.main-navigation .main-nav ul li a { margin: 2px 0; }
	.main-navigation .main-nav > ul { gap: 4px; padding: 8px 0; }
	.rc-tagline { font-size: 20px; }
}

@media (max-width: 560px) {
	.rc-home .site-content { padding: 0 16px; }
	.rc-grid > .wp-block-group__inner-container,
	.rc-grid--4 > .wp-block-group__inner-container { grid-template-columns: minmax(0, 1fr); }
	.rc-latest .fxb-link-cards__list { grid-template-columns: minmax(0, 1fr); }
	.rc-feature__title { font-size: 26px; }
	.rc-lede { font-size: 17px; margin: 24px 0 26px !important; }
	.blog .site-main > article,
	.archive .site-main > article { padding: 20px; }
}