/* Riverbend – styles that theme.json can't express. */

:root {
	--rb-muted: #4f6d76;
	--rb-line: #d7e7e3;
}

/* Template parts sit flush against each other. */
.wp-site-blocks > * + * { margin-block-start: 0; }

/* Narrow text blocks inside wide constrained sections line up with the
   section's left edge instead of being centred. */
.is-layout-constrained > :is(.rb-hero-title, .rb-section-title, .rb-lede),
.rb-page-head.is-layout-constrained > :is(h1, .wp-block-post-title, .wp-block-post-excerpt, .wp-block-query-title, .rb-lede) {
	margin-left: max(0px, calc((100% - var(--wp--style--global--wide-size, 1200px)) / 2)) !important;
	margin-right: auto !important;
}

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

.rb-header { position: relative; z-index: 20; }
.rb-brand { gap: 0.6rem; }
.rb-mark { flex: none; display: block; }
.rb-header .wp-block-site-title { font-stretch: 85%; }
.rb-header .wp-block-navigation a { text-decoration: none; }
.rb-header .wp-block-navigation a:hover,
.rb-header .wp-block-navigation .current-menu-item > a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; text-decoration-color: var(--wp--preset--color--lagoon); }
.rb-header .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem; }
.rb-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { font-family: var(--wp--preset--font-family--display); font-size: 2rem; font-weight: 800; }

@media (max-width: 600px) {
	.rb-header-cta { display: none !important; }
}

/* --------------------------------------------------------------- hero */

.rb-hero { position: relative; overflow: hidden; }
.rb-hero::after {
	/* Ripple lines drifting across the deep water, behind the text. */
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='120'%3E%3Cpath d='M0 60 Q 30 50 60 60 T 120 60 T 180 60 T 240 60' fill='none' stroke='%2316B3B0' stroke-opacity='.22' stroke-width='2'/%3E%3Cpath d='M-60 100 Q -30 92 0 100 T 60 100 T 120 100 T 180 100 T 240 100' fill='none' stroke='%2316B3B0' stroke-opacity='.12' stroke-width='2'/%3E%3C/svg%3E");
	background-size: 240px 120px;
	pointer-events: none;
	animation: rb-drift 18s linear infinite;
}
.rb-hero > * { position: relative; z-index: 1; }
.rb-hero-title {
	max-width: 11.5ch;
	font-stretch: 78%;
	line-height: 0.9 !important;
	letter-spacing: -0.035em !important;
	color: var(--wp--preset--color--sand);
	text-wrap: balance;
}
.rb-hero-row { gap: 1.5rem 3rem !important; margin-top: 2rem !important; }
.rb-hero-row .rb-lede { max-width: 44ch; margin: 0; color: #d6efee; }
.rb-promises {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.75rem;
	list-style: none;
	padding: 0;
	margin-top: 2.25rem !important;
	font-weight: 600;
	color: #bfe3e2;
}
.rb-promises li { display: flex; align-items: center; gap: 0.6rem; }
.rb-promises li::before {
	content: "";
	width: 22px;
	height: 8px;
	border-radius: 50%;
	background: var(--wp--preset--color--life-jacket);
	box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.18);
	flex: none;
}

.rb-btn-light .wp-block-button__link {
	background: transparent !important;
	color: var(--wp--preset--color--white) !important;
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55) !important;
}
.rb-btn-light .wp-block-button__link:hover { box-shadow: inset 0 0 0 2px #fff !important; }
.wp-block-button__link { transition: transform 0.15s, background-color 0.2s; }
.wp-block-button__link:active { transform: translateY(3px); box-shadow: 0 1px 0 #d94f00; }

/* ----------------------------------------------------- booking overlap */

.rb-booking { position: relative; z-index: 2; margin-top: -9.5rem !important; }
.rb-booking .pj-app { max-width: var(--wp--style--global--wide-size, 1200px); }
.rb-page-head--overlap + .rb-booking { margin-top: -8rem !important; }
.rb-plugin-missing {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2rem 2.25rem;
	border-radius: 20px;
	background: var(--wp--preset--color--white);
	box-shadow: 0 30px 60px -30px rgba(6, 50, 60, 0.45);
	font-size: 1.125rem;
}
.rb-plugin-missing p { margin: 0; }
.rb-admin-hint { margin-top: 0.75rem !important; font-size: 0.95rem; color: var(--rb-muted); }

/* ----------------------------------------------------- shared section bits */

.rb-section-title { max-width: 16ch; font-stretch: 85%; }
.rb-lede { max-width: 52ch; color: var(--rb-muted); }
.rb-faq .rb-lede, .rb-page-head .rb-lede { color: #b9d9d8; }
.rb-page-head .wp-block-post-title, .rb-page-head h1 { font-stretch: 80%; line-height: 0.92; letter-spacing: -0.035em; color: var(--wp--preset--color--sand); max-width: 14ch; }
.rb-page-head .wp-block-post-excerpt { max-width: 46ch; }
.rb-page-head .wp-block-post-excerpt__more-link { display: none; }
body.archive .rb-blog-title, body.archive .rb-page-head > .rb-lede { display: none; }

.rb-arrow-link a {
	font-weight: 700;
	color: var(--wp--preset--color--deep);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
	text-decoration-color: var(--wp--preset--color--lagoon);
}
.rb-arrow-link a:hover { text-decoration-color: var(--wp--preset--color--life-jacket); }

/* --------------------------------------------------------- trip steps */

.rb-steps { counter-reset: rb-step; position: relative; padding-top: 4.5rem; }
.rb-steps::before {
	/* The river line joining the buoys. */
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 18px;
	height: 26px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='26'%3E%3Cpath d='M0 13 Q 50 0 100 13 T 200 13' fill='none' stroke='%2316B3B0' stroke-width='3' stroke-dasharray='8 8' stroke-linecap='round'/%3E%3C/svg%3E");
	background-size: 200px 26px;
	background-repeat: repeat-x;
}
.rb-step { position: relative; counter-increment: rb-step; }
.rb-step::before {
	content: counter(rb-step);
	position: absolute;
	top: -4.5rem;
	left: 0;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: linear-gradient(transparent 40%, #e5484d 40% 60%, transparent 60%) #fff;
	box-shadow: 0 0 0 3px var(--wp--preset--color--paper), 0 3px 0 rgba(14, 52, 65, 0.25);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 1.15rem;
	color: #fff;
	-webkit-text-stroke: 4px #b4232b;
	paint-order: stroke fill;
}
.rb-step:last-child::before { background: linear-gradient(transparent 40%, var(--wp--preset--color--life-jacket) 40% 60%, transparent 60%) #fff; -webkit-text-stroke-color: #c4520f; }
.rb-step h3 { margin-top: 0; }
.rb-step p { color: var(--rb-muted); }
@media (max-width: 781px) {
	.rb-steps { padding-top: 0; padding-left: 4rem; gap: 2rem !important; }
	.rb-steps::before { top: 0; bottom: 0; left: 8px; right: auto; width: 26px; height: auto; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='200'%3E%3Cpath d='M13 0 Q 0 50 13 100 T 13 200' fill='none' stroke='%2316B3B0' stroke-width='3' stroke-dasharray='8 8' stroke-linecap='round'/%3E%3C/svg%3E"); background-size: 26px 200px; background-repeat: repeat-y; }
	.rb-step::before { top: 0; left: -4rem; }
}

/* ------------------------------------------------------------- waters */

.rb-water { gap: 0; }
.rb-water .wp-block-media-text__media img { border-radius: 28px 28px 28px 6px; aspect-ratio: 4 / 3; object-fit: cover; box-shadow: 0 2px 0 rgba(14, 52, 65, 0.12); }
.rb-water.has-media-on-the-right .wp-block-media-text__media img { border-radius: 28px 28px 6px 28px; }
.rb-water .wp-block-media-text__content { padding: 0 0 0 clamp(1.5rem, 5vw, 4.5rem); }
.rb-water.has-media-on-the-right .wp-block-media-text__content { padding: 0 clamp(1.5rem, 5vw, 4.5rem) 0 0; }
.rb-water h3 { font-size: var(--wp--preset--font-size--xx-large); font-stretch: 85%; margin-bottom: 0.75rem; }
.rb-water p { max-width: 44ch; }
.rb-facts { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; padding: 0; margin: 1.25rem 0 !important; }
.rb-facts li { padding: 0.3rem 0.85rem; border-radius: 99px; background: var(--wp--preset--color--paper); font-size: 0.875rem; font-weight: 600; }
.rb-facts li:first-child { background: var(--wp--preset--color--deep); color: #fff; }
@media (max-width: 600px) {
	.rb-water .wp-block-media-text__content,
	.rb-water.has-media-on-the-right .wp-block-media-text__content { padding: 1.5rem 0 0; }
}

/* ------------------------------------------------------------- guides */

.rb-avatar { width: 112px; height: 112px; display: block; margin-bottom: 1.25rem; }
.rb-guide:nth-child(2) .rb-avatar { transform: rotate(20deg); }
.rb-guide:nth-child(3) .rb-avatar { transform: rotate(-12deg); }
.rb-guide h3 { margin-bottom: 0.15rem; font-stretch: 85%; }
.rb-role { margin-top: 0 !important; font-weight: 700; color: var(--wp--preset--color--deep); }
.rb-guide p:last-child { color: var(--rb-muted); }

/* ---------------------------------------------------------------- faq */

.rb-faq-item { border-top: 1px solid rgba(255, 255, 255, 0.16); padding: 0; margin: 0 !important; }
.rb-faq-item:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
.rb-faq-item summary {
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding: 1.15rem 0;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.3rem;
	letter-spacing: -0.01em;
}
.rb-faq-item summary::-webkit-details-marker { display: none; }
.rb-faq-item summary::after {
	content: "";
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background:
		linear-gradient(#fff, #fff) center / 14px 2px no-repeat,
		linear-gradient(#fff, #fff) center / 2px 14px no-repeat,
		rgba(255, 255, 255, 0.1);
	transition: transform 0.25s;
}
.rb-faq-item[open] summary::after { transform: rotate(45deg); background-color: var(--wp--preset--color--life-jacket); }
.rb-faq-item summary:focus-visible { outline: 3px solid var(--wp--preset--color--lagoon); outline-offset: 4px; }
.rb-faq-item p { margin: 0 0 1.25rem; max-width: 60ch; color: #c9e2e1; }

/* ------------------------------------------------------- journal cards */

.rb-post-grid { row-gap: 2.5rem !important; }
.rb-card-img img { border-radius: 20px 20px 20px 4px; transition: transform 0.35s; }
.rb-card-img { overflow: hidden; border-radius: 20px 20px 20px 4px; }
.rb-post-grid li:hover .rb-card-img img { transform: scale(1.04); }
.rb-post-grid .wp-block-post-title a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--lagoon); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.rb-post-grid .wp-block-post-excerpt { color: var(--rb-muted); }
.rb-single-img img { border-radius: 24px; }
.rb-journal .wp-block-query:not(:has(li)) { display: none; }

/* ---------------------------------------------------------------- visit */

.rb-map img { border-radius: 28px; display: block; }
.rb-hours { list-style: none; padding: 0; }
.rb-hours li { padding: 0.65rem 0; border-bottom: 1px solid rgba(14, 52, 65, 0.15); display: flex; gap: 1rem; }
.rb-hours strong { min-width: 6.5rem; }

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

.rb-footer-river { margin: 0 !important; }
.rb-footer-river img { width: 100%; height: clamp(110px, 14vw, 200px); object-fit: cover; display: block; }
.rb-footer .wp-block-site-title { font-stretch: 85%; }
.rb-footer h4 { font-size: 1rem; color: var(--wp--preset--color--sand); letter-spacing: 0; }
.rb-footer-nav a { text-decoration: none; }
.rb-footer-nav a:hover { text-decoration: underline; }
.rb-colophon { margin-top: var(--wp--preset--spacing--50) !important; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.12); color: #8fb3bf; }

/* --------------------------------------------------------------- motion */

@keyframes rb-drift { to { background-position: -240px 0; } }
@media (prefers-reduced-motion: reduce) {
	.rb-hero::after { animation: none; }
	.rb-card-img img, .wp-block-button__link, .rb-faq-item summary::after { transition: none; }
}

:where(.wp-site-blocks) :focus-visible { outline: 3px solid var(--wp--preset--color--life-jacket); outline-offset: 2px; }

/* Keep grid columns equal even before lazy-loaded images arrive. */
.rb-post-grid > li { min-width: 0; }
.rb-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }