/* ============================
   CryptoFaucets.cash Pro UI
   Full replacement CSS
   ============================ */

/* Tokens */
:root {
	--cf-max: 900px;
	--cf-wide: 1080px;
	--cf-pad: clamp(16px, 4vw, 32px);

	--cf-gold: #d4a017;
	--cf-gold-soft: #fff6d8;
	--cf-green: #2f7d32;
	--cf-green-dark: #166534;
	--cf-orange: #ff6600;
	--cf-pink: #f21b5a;

	--cf-text: #111827;
	--cf-muted: #4b5563;
	--cf-border: rgba(17,24,39,.10);

	--cf-radius: 16px;
	--cf-radius-sm: 12px;

	--cf-shadow: 0 10px 30px rgba(17,24,39,.08);
	--cf-shadow-soft: 0 6px 18px rgba(17,24,39,.06);
	--cf-shadow-hover: 0 16px 38px rgba(17,24,39,.12);

	--cf-card-bg: rgba(255,255,255,.94);
	--cf-card-bg-soft: rgba(255,255,255,.84);
}

/* ============================
   Base
   ============================ */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 84px;
}

html,
body {
	scroll-snap-type: none !important;
	background: #fff !important;
}

body {
	color: var(--cf-text);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	background: #fff !important;
}

.wp-site-blocks,
.wp-site-blocks > header,
.wp-block-template-part,
.site-header,
main,
.wp-block-post-content,
.entry-content {
	background: #fff !important;
}

.wp-site-blocks > * {
	padding-left: var(--cf-pad);
	padding-right: var(--cf-pad);
}

.wp-block-post-content,
.entry-content,
.post-content,
main article {
	max-width: var(--cf-max);
	margin-left: auto;
	margin-right: auto;
	line-height: 1.72;
	font-size: clamp(16px, 1.15vw, 18px);
}

p {
	margin: 1em 0;
}

strong,
b {
	font-weight: 800;
}

::selection {
	background: var(--cf-gold-soft);
	color: var(--cf-text);
}

/* ============================
   Header / Brand
   ============================ */

.wp-block-site-title,
.wp-block-site-title a,
.site-title,
.site-title a {
	color: var(--cf-gold) !important;
	font-weight: 850 !important;
	letter-spacing: -.02em;
	text-decoration: none !important;
}

.wp-block-site-tagline,
.site-description {
	color: var(--cf-green) !important;
	font-weight: 800 !important;
	letter-spacing: -.01em;
}

.wp-site-blocks > header,
.site-header {
	border-bottom: 1px solid rgba(17,24,39,.06);
}

.wp-site-blocks > header a {
	text-decoration: none;
}

/* ============================
   Headings
   ============================ */

h1,
.wp-block-post-title {
	letter-spacing: -.045em;
	line-height: 1.05;
	text-wrap: balance;
}

h2,
h3 {
	letter-spacing: -.025em;
	line-height: 1.15;
	text-wrap: balance;
}

h2 {
	margin-top: 2.4em;
	padding-top: .15em;
}

h3 {
	margin-top: 1.8em;
}

h2[id],
h3[id],
.cf-faucet-panel h2,
h2.cf-faucet-snap {
	scroll-margin-top: 84px;
}

/* ============================
   Links and focus states
   ============================ */

.wp-block-post-content a,
.entry-content a {
	color: var(--cf-green-dark);
	text-decoration: none;
	font-weight: 650;
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0 2px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size .18s ease, opacity .18s ease;
}

.wp-block-post-content a:hover,
.entry-content a:hover {
	background-size: 100% 2px;
	opacity: .9;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid rgba(212,160,23,.42);
	outline-offset: 3px;
	border-radius: 8px;
}

/* ============================
   Media
   ============================ */

img,
figure,
.wp-block-image img {
	border-radius: var(--cf-radius-sm);
}

.wp-block-image img {
	box-shadow: var(--cf-shadow);
}

figure {
	margin-left: auto;
	margin-right: auto;
}

figcaption {
	color: var(--cf-muted);
	font-size: .92em;
	text-align: center;
}

/* ============================
   Lists
   ============================ */

.wp-block-post-content :is(ul, ol),
.entry-content :is(ul, ol) {
	max-width: var(--cf-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.25em;
}

.wp-block-post-content li,
.entry-content li {
	margin: .45em 0;
}

/* ============================
   General cards
   ============================ */

.cf-card {
	background: linear-gradient(180deg, var(--cf-card-bg) 0%, var(--cf-card-bg-soft) 100%);
	border: 1px solid var(--cf-border);
	border-left: 5px solid var(--cf-orange);
	border-radius: var(--cf-radius);
	box-shadow: var(--cf-shadow-soft);
	padding: clamp(16px, 3vw, 22px);
}

.cf-card-stack > * {
	margin-top: 12px;
}

.cf-card-stack > :first-child {
	margin-top: 0;
}

.cf-cards {
	padding-left: 0 !important;
	list-style: none;
	margin: 1.4em auto;
	max-width: var(--cf-max);
}

.cf-cards > li {
	background: linear-gradient(180deg, var(--cf-card-bg) 0%, var(--cf-card-bg-soft) 100%);
	border: 1px solid var(--cf-border);
	border-left: 5px solid var(--cf-orange);
	border-radius: var(--cf-radius);
	box-shadow: var(--cf-shadow-soft);
	padding: clamp(16px, 3vw, 22px);
	margin: 14px 0;
	transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.cf-cards > li:hover {
	transform: translateY(-2px);
	box-shadow: var(--cf-shadow-hover);
	border-color: rgba(212,160,23,.34);
}

.cf-cards > li > a:first-child {
	font-weight: 850;
	font-size: 1.06em;
	color: var(--cf-pink);
}

.cf-cards > li :is(ul, ol) {
	margin: .8em 0 0;
	padding-left: 1.2em;
}

/* ============================
   Faucet cards, normal page scroll
   ============================ */

.cf-faucet-scroll {
	width: min(var(--cf-max), 100%);
	max-height: none !important;
	margin: 2rem auto !important;
	padding: 0 !important;
	overflow: visible !important;
	scroll-snap-type: none !important;
	border-radius: 0 !important;
}

.cf-faucet-panel {
	box-sizing: border-box;
	min-height: 0 !important;
	margin: 0 auto 2rem;
	padding: clamp(18px, 3.5vw, 26px);
	background: linear-gradient(180deg, var(--cf-card-bg) 0%, var(--cf-card-bg-soft) 100%);
	border: 1px solid var(--cf-border);
	border-left: 5px solid var(--cf-orange);
	border-radius: var(--cf-radius);
	box-shadow: var(--cf-shadow-soft);
	scroll-snap-align: none !important;
	scroll-snap-stop: normal !important;
	transition: box-shadow .16s ease, transform .16s ease;
}

.cf-faucet-panel:hover {
	box-shadow: var(--cf-shadow-hover);
	transform: translateY(-1px);
}

.cf-faucet-panel h2:first-child {
	margin-top: 0;
}

.cf-faucet-panel figure {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.cf-faucet-panel img {
	width: 100%;
	height: auto;
}

.cf-faucet-panel p a[href="#links"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin-top: .5rem;
	color: var(--cf-orange) !important;
	font-size: .9em;
	font-weight: 800;
	text-align: center;
	background-image: none !important;
}

/* ============================
   Callouts / Quotes
   ============================ */

.wp-block-post-content blockquote,
.entry-content blockquote {
	margin: 1.6em 0;
	padding: 16px 18px;
	border-left: 5px solid var(--cf-gold);
	background: var(--cf-gold-soft);
	border-radius: var(--cf-radius-sm);
	box-shadow: 0 4px 14px rgba(17,24,39,.04);
}

.wp-block-post-content blockquote p,
.entry-content blockquote p {
	margin: .6em 0;
}

.cf-review-date,
.cf-freshness-note {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	color: var(--cf-muted);
}

.cf-review-date {
	font-size: .95em;
	font-style: italic;
}

.cf-freshness-note {
	padding: 14px 16px;
	background: var(--cf-gold-soft);
	border: 1px solid rgba(212,160,23,.22);
	border-radius: var(--cf-radius-sm);
	box-shadow: 0 4px 14px rgba(17,24,39,.04);
}

/* ============================
   General tables
   ============================ */

.wp-block-table {
	overflow-x: auto;
}

.wp-block-post-content table,
.entry-content table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	border-radius: var(--cf-radius-sm);
	border: 1px solid var(--cf-border);
	background: #fff;
	box-shadow: 0 6px 18px rgba(17,24,39,.04);
}

.wp-block-post-content th,
.wp-block-post-content td,
.entry-content th,
.entry-content td {
	padding: 12px 14px;
	border-bottom: 1px solid rgba(17,24,39,.07);
	vertical-align: top;
}

.wp-block-post-content th,
.entry-content th {
	text-align: left;
	background: rgba(17,24,39,.045);
	font-weight: 850;
}

.wp-block-post-content tr:nth-child(even) td,
.entry-content tr:nth-child(even) td {
	background: rgba(17,24,39,.018);
}

.wp-block-post-content tr:last-child td,
.entry-content tr:last-child td {
	border-bottom: 0;
}

/* ============================
   Faucet comparison table
   Use with:
   is-style-stripes cf-faucet-picks-table
   ============================ */

figure.wp-block-table.cf-faucet-picks-table {
	width: min(860px, 94vw);
	max-width: 860px;
	padding: 0 !important;
	margin: 2rem auto !important;
	overflow: hidden;
	border-radius: var(--cf-radius);
	background: transparent !important;
	box-shadow: var(--cf-shadow);
}

figure.wp-block-table.cf-faucet-picks-table table {
	width: 100%;
	margin: 0 !important;
	table-layout: auto;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-radius);
	overflow: hidden;
	background: #fff;
}

figure.wp-block-table.cf-faucet-picks-table thead th {
	background: #111827 !important;
	color: #fff !important;
	font-size: 15px;
	font-weight: 850;
	line-height: 1.25;
	text-align: left;
	padding: 13px 14px;
	border: 0 !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody td {
	font-size: 15px;
	line-height: 1.42;
	padding: 13px 14px;
	vertical-align: top;
	border-bottom: 1px solid rgba(17,24,39,.07);
	background: #fff !important;
	word-break: normal !important;
	overflow-wrap: normal !important;
	hyphens: none !important;
	height: auto !important;
	min-height: 0 !important;
	transition: background .18s ease, color .18s ease;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr {
	height: auto !important;
	min-height: 0 !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(even) td {
	background: rgba(17,24,39,.025) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:last-child td {
	border-bottom: 0;
}

figure.wp-block-table.cf-faucet-picks-table figcaption:empty {
	display: none !important;
}

figure.wp-block-table.cf-faucet-picks-table th:nth-child(1),
figure.wp-block-table.cf-faucet-picks-table td:nth-child(1) {
	width: 31%;
	font-weight: 850;
}

figure.wp-block-table.cf-faucet-picks-table th:nth-child(2),
figure.wp-block-table.cf-faucet-picks-table td:nth-child(2) {
	width: 22%;
}

figure.wp-block-table.cf-faucet-picks-table th:nth-child(3),
figure.wp-block-table.cf-faucet-picks-table td:nth-child(3) {
	width: 21%;
}

figure.wp-block-table.cf-faucet-picks-table th:nth-child(4),
figure.wp-block-table.cf-faucet-picks-table td:nth-child(4) {
	width: 26%;
}

figure.wp-block-table.cf-faucet-picks-table tbody td:first-child a {
	color: var(--cf-pink);
	font-weight: 850;
	text-decoration: none;
	background-image: none !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:hover td {
	background: rgba(255,190,120,.16) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(1):hover td {
	background: rgba(245,185,65,.22) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(2):hover td {
	background: rgba(45,150,245,.15) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(3):hover td {
	background: rgba(255,111,65,.18) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(4):hover td {
	background: rgba(54,162,235,.16) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(5):hover td {
	background: rgba(111,92,255,.15) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(6):hover td {
	background: rgba(46,204,113,.15) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(7):hover td {
	background: rgba(0,170,130,.15) !important;
}

figure.wp-block-table.cf-faucet-picks-table tbody tr:nth-child(8):hover td {
	background: rgba(247,147,26,.18) !important;
}

/* ============================
   Buttons
   ============================ */

.wp-block-button__link,
.wp-element-button {
	border-radius: 999px !important;
	font-weight: 850 !important;
	letter-spacing: -.01em;
	box-shadow: 0 8px 20px rgba(255,102,0,.18);
	transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.wp-block-button__link:hover,
.wp-element-button:hover {
	transform: translateY(-1px);
	box-shadow: 0 12px 28px rgba(255,102,0,.24);
	opacity: .96;
}

/* ============================
   Animated three-dot menu icon
   Desktop + mobile, no duplicate toggles
   ============================ */

@media (min-width: 1000px) {
	button.toggle.nav-toggle.mobile-nav-toggle {
		display: none !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	button.toggle.nav-toggle.desktop-nav-toggle {
		display: inline-flex !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}
}

@media (max-width: 999px) {
	button.toggle.nav-toggle.desktop-nav-toggle {
		display: none !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle {
		display: inline-flex !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}
}

button.toggle.nav-toggle.desktop-nav-toggle,
button.toggle.nav-toggle.mobile-nav-toggle {
	position: relative;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 8px 12px !important;
	border-radius: 999px !important;
	background: rgba(212,160,23,.10) !important;
	box-shadow: 0 6px 16px rgba(17,24,39,.06);
	transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}

button.toggle.nav-toggle.desktop-nav-toggle::before,
button.toggle.nav-toggle.mobile-nav-toggle::before {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: inherit;
	border: 1px solid rgba(212,160,23,.35);
	opacity: .45;
	transform: scale(.94);
	animation: cf-menu-pulse 2.6s ease-out infinite;
	pointer-events: none;
}

button.toggle.nav-toggle.desktop-nav-toggle .toggle-inner,
button.toggle.nav-toggle.mobile-nav-toggle .toggle-inner {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	position: relative;
	z-index: 1;
}

button.toggle.nav-toggle.desktop-nav-toggle .toggle-text,
button.toggle.nav-toggle.mobile-nav-toggle .toggle-text {
	color: #111827 !important;
	font-weight: 800 !important;
	font-size: 14px;
	letter-spacing: -.01em;
}

button.toggle.nav-toggle.desktop-nav-toggle .toggle-icon,
button.toggle.nav-toggle.mobile-nav-toggle .toggle-icon {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 12px;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	transform-origin: center;
	transition: transform .18s ease;
}

button.toggle.nav-toggle.desktop-nav-toggle .toggle-icon::before,
button.toggle.nav-toggle.mobile-nav-toggle .toggle-icon::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 50%;
	width: 5px;
	height: 5px;
	border-radius: 999px;
	background: rgba(17,24,39,.38);
	box-shadow:
		10px 0 0 rgba(17,24,39,.38),
		20px 0 0 rgba(17,24,39,.38);
	transform: translateY(-50%);
	animation: cf-menu-dot-sequence 1.35s ease-in-out infinite;
}

button.toggle.nav-toggle.desktop-nav-toggle:hover,
button.toggle.nav-toggle.desktop-nav-toggle:focus-visible,
button.toggle.nav-toggle.mobile-nav-toggle:hover,
button.toggle.nav-toggle.mobile-nav-toggle:focus-visible {
	background: rgba(212,160,23,.18) !important;
	box-shadow: 0 10px 24px rgba(17,24,39,.10);
	transform: translateY(-1px);
}

button.toggle.nav-toggle.desktop-nav-toggle:hover .toggle-icon,
button.toggle.nav-toggle.desktop-nav-toggle:focus-visible .toggle-icon,
button.toggle.nav-toggle.mobile-nav-toggle:hover .toggle-icon,
button.toggle.nav-toggle.mobile-nav-toggle:focus-visible .toggle-icon {
	transform: scale(1.12);
}

button.toggle.nav-toggle.desktop-nav-toggle:active,
button.toggle.nav-toggle.mobile-nav-toggle:active {
	transform: scale(.96);
}

@keyframes cf-menu-pulse {
	0% {
		opacity: .42;
		transform: scale(.94);
	}

	70% {
		opacity: 0;
		transform: scale(1.16);
	}

	100% {
		opacity: 0;
		transform: scale(1.16);
	}
}

@keyframes cf-menu-dot-sequence {
	0%,
	100% {
		background: var(--cf-gold);
		box-shadow:
			10px 0 0 rgba(17,24,39,.38),
			20px 0 0 rgba(17,24,39,.38);
	}

	33% {
		background: rgba(17,24,39,.38);
		box-shadow:
			10px 0 0 var(--cf-gold),
			20px 0 0 rgba(17,24,39,.38);
	}

	66% {
		background: rgba(17,24,39,.38);
		box-shadow:
			10px 0 0 rgba(17,24,39,.38),
			20px 0 0 var(--cf-gold);
	}
}

/* ============================
   Mobile
   ============================ */

@media (max-width: 700px) {
	html {
		scroll-padding-top: 0 !important;
	}

	h2[id],
	h3[id],
	.cf-faucet-panel h2,
	h2.cf-faucet-snap {
		scroll-margin-top: 0 !important;
	}

	.wp-site-blocks > * {
		padding-left: 16px;
		padding-right: 16px;
	}
}

	.wp-block-post-content,
	.entry-content,
	.post-content,
	main article {
		font-size: 16px;
		line-height: 1.68;
	}

	h1,
	.wp-block-post-title {
   font-size: clamp(48px, 13vw, 64px) !important;
	letter-spacing: -.045em;
	line-height: 1.02;
	}

	.cf-card,
	.cf-cards > li,
	.cf-faucet-panel {
		padding: 16px;
		border-radius: 14px;
	}

	.header-inner,
	.header-inner.section-inner {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 12px !important;
		flex-wrap: nowrap !important;
	}

	.header-titles-wrapper,
	.header-titles {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		margin: 0 !important;
	}

	.header-navigation-wrapper,
	.header-toggles,
	.toggle-wrapper {
		flex: 0 0 auto !important;
		margin-left: auto !important;
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle {
		width: 42px !important;
		min-width: 42px !important;
		height: 42px !important;
		min-height: 42px !important;
		padding: 0 !important;
		margin-right: -45px !important;
		gap: 0 !important;
		border-radius: 999px !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle .toggle-inner {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		height: 100% !important;
		gap: 0 !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle .toggle-text {
		display: none !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle .toggle-icon {
		width: 30px !important;
		height: 12px !important;
		margin: 0 !important;
	}

	button.toggle.nav-toggle.mobile-nav-toggle::before {
		inset: -3px !important;
	}

	figure.wp-block-table.cf-faucet-picks-table {
		width: 100%;
		max-width: 100%;
		margin: 1.5rem auto !important;
		border-radius: 14px;
	}

	figure.wp-block-table.cf-faucet-picks-table thead th,
	figure.wp-block-table.cf-faucet-picks-table tbody td {
		font-size: 13.5px;
		line-height: 1.35;
		padding: 9px;
	}

	figure.wp-block-table.cf-faucet-picks-table th:nth-child(1),
	figure.wp-block-table.cf-faucet-picks-table td:nth-child(1) {
		width: 31% !important;
		min-width: 0 !important;
	}

	figure.wp-block-table.cf-faucet-picks-table th:nth-child(2),
	figure.wp-block-table.cf-faucet-picks-table td:nth-child(2) {
		width: 22% !important;
	}

	figure.wp-block-table.cf-faucet-picks-table th:nth-child(3),
	figure.wp-block-table.cf-faucet-picks-table td:nth-child(3) {
		width: 21% !important;
	}

	figure.wp-block-table.cf-faucet-picks-table th:nth-child(4),
	figure.wp-block-table.cf-faucet-picks-table td:nth-child(4) {
		width: 26% !important;
	}
}

@media (max-width: 420px) {
	figure.wp-block-table.cf-faucet-picks-table thead th,
	figure.wp-block-table.cf-faucet-picks-table tbody td {
		font-size: 12.8px;
		padding: 8px 7px;
	}
}

/* ============================
   Accessibility
   ============================ */

@media (prefers-reduced-motion: reduce) {
	html,
	.cf-faucet-scroll,
	* {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}

	button.toggle.nav-toggle.desktop-nav-toggle::before,
	button.toggle.nav-toggle.mobile-nav-toggle::before,
	button.toggle.nav-toggle.desktop-nav-toggle .toggle-icon::before,
	button.toggle.nav-toggle.mobile-nav-toggle .toggle-icon::before {
		animation: none !important;
	}
}