/*
Theme Name: Digital Identity Token
Theme URI: https://digitalidentitytoken.com/
Author: Digital Identity Token
Author URI: https://digitalidentitytoken.com/
Description: WordPress theme for DigitalIdentityToken.com — a privacy-preserving, tokenized identity site. It reproduces the original single-page design (hero, interactive selective-disclosure demonstration, trust model, use-case explorer and illustrative case studies) and adds a full native WordPress blog, page templates, a dedicated Contact page, an accessible menu system and a secure contact form with administrator notification and visitor confirmation e-mails.
Version: 1.1.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: digital-identity-token
Tags: blog, custom-logo, custom-menu, featured-images, block-styles, wide-blocks, translation-ready, full-width-template, threaded-comments

Digital Identity Token WordPress theme, (C) 2026 DigitalIdentityToken.com.
Digital Identity Token is distributed under the terms of the GNU GPL v2 or later.

--------------------------------------------------------------------------
TABLE OF CONTENTS
--------------------------------------------------------------------------
 1.0  Design tokens
 2.0  Reset and base elements
 3.0  Accessibility helpers
 4.0  Site header and navigation
 5.0  Hero
 6.0  Selective-disclosure demonstration
 7.0  Identity model section
 8.0  Use-case explorer
 9.0  Case studies
10.0  Contact section and form
11.0  Site footer
12.0  Page header (interior templates)
13.0  WordPress content (block editor)
14.0  Blog listings, pagination and search
15.0  Comments
16.0  Error page (404)
17.0  Animations and motion preferences
18.0  Responsive rules
19.0  Print
-------------------------------------------------------------------------- */

/* 1.0 Design tokens ----------------------------------------------------- */

:root {
	--ink: #051614;
	--ink-2: #08211f;
	--panel: #0b2a27;
	--teal: #20d5c4;
	--teal-dark: #0f8d83;
	--aqua: #a9fff4;
	--cream: #f3f0e8;
	--paper: #fbfaf6;
	--text: #102724;
	--muted: #89a09b;
	--line: rgba(255, 255, 255, 0.13);
	--teal-contrast: #04302b;
	--danger: #b3261e;
	--danger-bg: #fdecea;
	--success: #0f8d83;
	--success-bg: #e6f6f3;
	--radius: 0;
	--shell: 1180px;
	--gutter: 64px;
	--header-height: 88px;
	--font-sans: Arial, Helvetica, sans-serif;
	--font-serif: Georgia, "Times New Roman", serif;
}

/* 2.0 Reset and base elements ------------------------------------------- */

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

body {
	margin: 0;
	background: var(--ink);
	color: #fff;
	font-family: var(--font-sans);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

button,
input,
textarea,
select {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

button {
	color: inherit;
}

img,
svg,
video,
canvas,
iframe {
	display: block;
	max-width: 100%;
}

img,
video {
	height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
ul,
ol {
	margin: 0;
}

ul,
ol {
	padding: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

table {
	border-collapse: collapse;
	text-indent: 0;
}

hr {
	height: 0;
	border: 0;
	border-top: 1px solid var(--line);
}

::selection {
	background: var(--teal);
	color: var(--ink);
}

:focus-visible {
	outline: 2px solid var(--teal);
	outline-offset: 3px;
}

.shell {
	width: min(var(--shell), calc(100% - var(--gutter)));
	margin-inline: auto;
}

.visually-hidden,
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* 3.0 Accessibility helpers --------------------------------------------- */

.skipLink {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 100;
	padding: 10px 14px;
	background: var(--teal);
	color: var(--ink);
	transform: translateY(-150%);
	transition: transform 0.2s ease;
}

.skipLink:focus {
	transform: translateY(0);
}

/* 4.0 Site header and navigation ----------------------------------------- */

.siteHeader {
	position: relative;
	z-index: 20;
	background: var(--ink);
}

.is-front-page .siteHeader {
	position: absolute;
	inset: 0 0 auto;
	background: transparent;
}

.nav {
	height: var(--header-height);
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--line);
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: 13px;
	font-weight: 700;
	letter-spacing: -0.045em;
	white-space: nowrap;
}

.brand em {
	color: var(--teal);
	font-style: normal;
}

.brand .custom-logo-link {
	display: inline-flex;
}

.brand img,
.brand .custom-logo {
	width: auto;
	max-height: 44px;
}

.mark {
	width: 58px;
	height: 58px;
	display: grid;
	place-items: center;
	color: var(--aqua);
	border: 1px solid rgba(32, 213, 196, 0.36);
	background: rgba(5, 22, 20, 0.66);
	transform: rotate(45deg);
}

.mark svg {
	width: 34px;
	height: 34px;
	transform: rotate(-45deg);
}

.mark.compact {
	width: 36px;
	height: 36px;
}

.mark.compact svg {
	width: 22px;
	height: 22px;
}

.navLinks {
	display: flex;
	align-items: center;
	gap: 30px;
	color: #afc2be;
	font-size: 13px;
}

.navLinks ul {
	display: contents;
	list-style: none;
}

.navLinks li {
	display: block;
}

.navLinks a {
	position: relative;
	display: inline-block;
	padding: 6px 0;
	transition: color 0.2s ease;
}

.navLinks a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 0;
	height: 1px;
	background: var(--teal);
	transition: right 0.2s ease;
}

.navLinks a:hover,
.navLinks a:focus-visible,
.navLinks .current-menu-item > a,
.navLinks .current_page_item > a,
.navLinks .current-menu-anchor > a,
.navLinks a.isActive {
	color: #fff;
}

.navLinks a:hover::after,
.navLinks a:focus-visible::after,
.navLinks .current-menu-item > a::after,
.navLinks .current_page_item > a::after,
.navLinks a.isActive::after {
	right: 0;
}

.navLinks .sub-menu {
	display: block;
	position: absolute;
	z-index: 30;
	top: 100%;
	left: 0;
	min-width: 210px;
	margin: 0;
	padding: 8px 0;
	background: #08211ff7;
	border: 1px solid var(--line);
	box-shadow: 0 25px 60px rgba(0, 0, 0, 0.35);
}

.navLinks li {
	position: relative;
}

.navLinks .sub-menu a {
	display: block;
	padding: 10px 16px;
}

.navLinks .sub-menu .sub-menu {
	top: -8px;
	left: 100%;
}

.headerCta {
	min-height: 42px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 0 17px;
	border: 1px solid rgba(169, 255, 244, 0.35);
	color: var(--aqua);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	transition: background 0.2s ease, color 0.2s ease;
}

.headerCta:hover,
.headerCta:focus-visible {
	background: var(--teal);
	color: var(--ink);
}

.arrow {
	width: 18px;
	height: 18px;
	flex: none;
}

.menuButton {
	display: none;
	width: 44px;
	height: 44px;
	border: 1px solid var(--line);
	background: transparent;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.menuIcon {
	width: 19px;
	height: 12px;
	display: block;
	position: relative;
}

.menuIcon i {
	position: absolute;
	left: 0;
	width: 19px;
	height: 1px;
	background: #fff;
	transition: transform 0.2s ease, top 0.2s ease;
}

.menuIcon i:first-child {
	top: 2px;
}

.menuIcon i:last-child {
	top: 10px;
}

.menuIcon.isOpen i:first-child {
	top: 6px;
	transform: rotate(45deg);
}

.menuIcon.isOpen i:last-child {
	top: 6px;
	transform: rotate(-45deg);
}

/* 5.0 Hero --------------------------------------------------------------- */

.hero {
	min-height: 790px;
	position: relative;
	overflow: hidden;
	background: radial-gradient(circle at 75% 45%, #0c3732 0, var(--ink) 44%);
	padding-top: var(--header-height);
}

.hero::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.2;
	pointer-events: none;
	background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 72px 72px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 42%, #000);
	mask-image: linear-gradient(90deg, transparent, #000 42%, #000);
}

.heroGlow {
	position: absolute;
	right: -130px;
	top: 180px;
	width: 540px;
	height: 540px;
	border-radius: 50%;
	background: rgba(32, 213, 196, 0.09);
	filter: blur(55px);
}

.heroGrid {
	min-height: 645px;
	display: grid;
	grid-template-columns: 1.03fr 0.97fr;
	align-items: center;
	gap: 64px;
	position: relative;
	z-index: 2;
}

.heroCopy {
	padding: 72px 0 36px;
}

.eyebrow {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--teal);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.19em;
	text-transform: uppercase;
}

.eyebrow > span {
	display: inline-block;
	width: 30px;
	height: 1px;
	background: currentColor;
}

h1,
h2 {
	margin: 25px 0;
	font-family: var(--font-serif);
	font-weight: 400;
	letter-spacing: -0.052em;
}

h1 {
	max-width: 720px;
	font-size: clamp(60px, 6.1vw, 92px);
	line-height: 0.96;
}

h1 em,
h2 em {
	color: var(--teal);
	font-weight: 400;
}

.heroLead {
	max-width: 655px;
	margin: 0;
	color: #a9bbb7;
	font-size: 18px;
	line-height: 1.65;
}

.heroActions {
	display: flex;
	gap: 13px;
	margin-top: 33px;
	flex-wrap: wrap;
}

.button {
	min-height: 54px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	padding: 0 23px;
	border: 1px solid transparent;
	background: transparent;
	cursor: pointer;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.button:hover {
	transform: translateY(-2px);
}

.button.primary {
	background: var(--teal);
	color: var(--ink);
}

.button.primary:hover {
	background: var(--aqua);
}

.button.secondary {
	color: #d3dfdc;
	border-color: rgba(255, 255, 255, 0.24);
}

.button.secondary:hover {
	border-color: var(--teal);
	color: var(--aqua);
}

.heroSignals {
	display: flex;
	flex-wrap: wrap;
	gap: 19px 25px;
	margin-top: 31px;
	color: #7f9792;
	font-size: 10px;
	letter-spacing: 0.03em;
}

.heroSignals span {
	display: flex;
	align-items: center;
	gap: 8px;
}

.heroSignals i {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--teal);
	box-shadow: 0 0 10px var(--teal);
}

.heroIndex {
	height: 57px;
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid var(--line);
	color: #607773;
	font-size: 9px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* 6.0 Selective-disclosure demonstration ---------------------------------- */

.proofDemo {
	height: 600px;
	display: grid;
	place-items: center;
	position: relative;
}

.demoOrbit {
	position: absolute;
	border: 1px solid rgba(32, 213, 196, 0.2);
	border-radius: 50%;
}

.orbitOne {
	width: 500px;
	height: 500px;
	animation: slowPulse 6s ease-in-out infinite;
}

.orbitTwo {
	width: 390px;
	height: 390px;
	animation: slowPulse 6s 1.2s ease-in-out infinite reverse;
}

.tokenCard {
	width: min(390px, 84%);
	min-height: 500px;
	padding: 25px;
	position: relative;
	z-index: 3;
	background: linear-gradient(145deg, rgba(15, 58, 54, 0.97), rgba(5, 24, 22, 0.98));
	border: 1px solid rgba(169, 255, 244, 0.34);
	box-shadow: 0 40px 110px rgba(0, 0, 0, 0.5);
	clip-path: polygon(0 0, 91% 0, 100% 7%, 100% 100%, 9% 100%, 0 93%);
}

.tokenHeader {
	display: flex;
	justify-content: space-between;
	color: #87a5a0;
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.18em;
}

.liveDot {
	color: var(--aqua);
}

.liveDot::before {
	content: "";
	width: 5px;
	height: 5px;
	display: inline-block;
	margin-right: 7px;
	border-radius: 50%;
	background: var(--teal);
	box-shadow: 0 0 8px var(--teal);
}

.tokenIdentity {
	display: flex;
	align-items: center;
	gap: 23px;
	margin: 31px 0 28px;
	padding-bottom: 26px;
	border-bottom: 1px solid var(--line);
}

.tokenIdentity small,
.requestHead small,
.useOutcome small {
	display: block;
	margin-bottom: 7px;
	color: #728b86;
	font-size: 7px;
	font-weight: 700;
	letter-spacing: 0.18em;
}

.tokenIdentity strong {
	display: block;
	font: 400 19px var(--font-serif);
	color: #e3fffb;
}

.requestHead {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-bottom: 12px;
}

.requestHead strong {
	display: block;
	font-size: 12px;
}

.requestHead > span {
	color: var(--teal);
	font-size: 8px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.claimList {
	border-top: 1px solid var(--line);
}

.claim {
	width: 100%;
	min-height: 46px;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr auto 26px;
	align-items: center;
	gap: 10px;
	border: 0;
	border-bottom: 1px solid var(--line);
	background: transparent;
	text-align: left;
	cursor: pointer;
}

.claim span {
	color: #bacac6;
	font-size: 11px;
}

.claim b {
	color: #637c77;
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.claim i {
	width: 23px;
	height: 13px;
	border-radius: 99px;
	border: 1px solid #44605a;
	position: relative;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.claim i::after {
	content: "";
	position: absolute;
	width: 7px;
	height: 7px;
	top: 2px;
	left: 3px;
	border-radius: 50%;
	background: #57706b;
	transition: left 0.2s ease, background 0.2s ease;
}

.claim.selected b {
	color: var(--teal);
}

.claim.selected i {
	border-color: var(--teal);
	background: rgba(32, 213, 196, 0.13);
}

.claim.selected i::after {
	left: 11px;
	background: var(--teal);
}

.generateProof {
	width: 100%;
	min-height: 48px;
	margin-top: 20px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border: 0;
	background: var(--teal);
	color: var(--ink);
	cursor: pointer;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transition: background 0.2s ease;
}

.generateProof:hover,
.generateProof.isReady {
	background: var(--aqua);
}

.demoNote {
	margin: 12px 8px 0;
	color: #617873;
	font-size: 8px;
	line-height: 1.5;
	text-align: center;
}

.demoNote p {
	margin: 0;
}

.proofTag {
	position: absolute;
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px 13px;
	background: rgba(5, 22, 20, 0.92);
	border-left: 1px solid var(--teal);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
	color: #99ada8;
	font-size: 8px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.proofTag span {
	color: var(--teal);
}

.tagIssuer {
	left: -5px;
	top: 135px;
}

.tagVerifier {
	right: -13px;
	bottom: 112px;
}

/* 7.0 Identity model section --------------------------------------------- */

.platformSection {
	padding: 115px 0 0;
	background: var(--cream);
	color: var(--text);
}

.sectionIntro {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	column-gap: 80px;
	align-items: end;
}

.sectionIntro .eyebrow {
	grid-column: 1 / -1;
}

.darkEyebrow {
	color: var(--teal-dark);
}

.sectionIntro h2,
.caseHeader h2 {
	font-size: clamp(45px, 5vw, 68px);
	line-height: 1.04;
}

.sectionIntro h2 em,
.caseHeader h2 em {
	color: var(--teal-dark);
}

.sectionIntro > p:last-child,
.caseHeader > p {
	margin-bottom: 31px;
	color: #63736f;
	font-size: 15px;
	line-height: 1.75;
}

.trustFlow {
	margin-top: 62px;
	display: grid;
	grid-template-columns: 1fr 56px 1fr 56px 1fr;
	align-items: stretch;
	border-top: 1px solid #cdd3ce;
	border-bottom: 1px solid #cdd3ce;
}

.trustFlow article {
	min-height: 260px;
	padding: 27px 15px;
	text-align: center;
}

.trustFlow article small {
	display: block;
	margin-bottom: 28px;
	color: #76847f;
	font-size: 8px;
	letter-spacing: 0.18em;
}

.flowIcon {
	width: 55px;
	height: 55px;
	display: grid;
	place-items: center;
	margin: 0 auto 21px;
	border: 1px solid #b9c6c1;
	font: 400 20px var(--font-serif);
	color: var(--teal-dark);
	transform: rotate(45deg);
}

.flowIcon > * {
	transform: rotate(-45deg);
}

.flowIcon .mark {
	border: 0;
	background: transparent;
	color: var(--teal-dark);
}

.trustFlow h3 {
	margin: 0 0 10px;
	font: 400 21px var(--font-serif);
}

.trustFlow p {
	max-width: 235px;
	margin: auto;
	color: #71807c;
	font-size: 12px;
	line-height: 1.65;
}

.flowArrow {
	display: grid;
	place-items: center;
	color: var(--teal-dark);
	font-size: 26px;
}

.flowCenter {
	background: #e8f0eb;
}

.outcomes {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-left: 1px solid #cdd3ce;
}

.outcomes > div {
	min-height: 145px;
	padding: 25px;
	border-right: 1px solid #cdd3ce;
}

.outcomes strong {
	display: block;
	margin-bottom: 12px;
	font: 400 18px var(--font-serif);
}

.outcomes span {
	display: block;
	color: #74827e;
	font-size: 11px;
	line-height: 1.55;
}

/* 8.0 Use-case explorer --------------------------------------------------- */

.explorer {
	margin-top: 115px;
	padding: 74px;
	display: grid;
	grid-template-columns: 0.72fr 1.28fr;
	gap: 75px;
	background: var(--ink);
	color: #fff;
	position: relative;
	overflow: hidden;
}

.explorer::after {
	content: "";
	position: absolute;
	width: 360px;
	height: 360px;
	right: -180px;
	bottom: -180px;
	border-radius: 50%;
	border: 1px solid rgba(32, 213, 196, 0.22);
	box-shadow: 0 0 0 65px rgba(32, 213, 196, 0.035), 0 0 0 130px rgba(32, 213, 196, 0.02);
}

.explorerIntro {
	position: relative;
	z-index: 2;
}

.explorerIntro h2 {
	font-size: clamp(43px, 4.7vw, 62px);
	line-height: 1.04;
}

.explorerIntro > p:last-child {
	color: #8ea39e;
	font-size: 14px;
	line-height: 1.7;
}

.explorerPanel {
	min-width: 0;
	position: relative;
	z-index: 2;
}

.useTabs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-bottom: 1px solid var(--line);
}

.useTabs button {
	min-height: 66px;
	padding: 0 8px;
	border: 0;
	border-top: 1px solid transparent;
	background: transparent;
	color: #718682;
	cursor: pointer;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.useTabs button span {
	display: block;
	margin-bottom: 6px;
	font-size: 7px;
}

.useTabs button:hover {
	color: #d7e5e2;
}

.useTabs button.active {
	color: var(--aqua);
	border-color: var(--teal);
	background: rgba(32, 213, 196, 0.06);
}

.useDetail {
	padding: 31px 0 0;
}

.useDetail[hidden] {
	display: none;
}

.useDetailCopy > p {
	margin: 0 0 10px;
	color: var(--teal);
	font-size: 8px;
	letter-spacing: 0.17em;
	text-transform: uppercase;
}

.useDetailCopy h3 {
	margin: 0 0 11px;
	font: 400 27px var(--font-serif);
}

.useDetailCopy > span {
	display: block;
	min-height: 48px;
	color: #8fa49f;
	font-size: 12px;
	line-height: 1.65;
}

.miniFlow {
	margin-top: 24px;
	display: grid;
	grid-template-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
	align-items: stretch;
}

.miniFlow > div {
	min-height: 110px;
	padding: 14px;
	border: 1px solid var(--line);
}

.miniFlow i {
	display: grid;
	place-items: center;
	color: var(--teal);
	font-style: normal;
}

.miniFlow small {
	display: block;
	margin-bottom: 16px;
	color: #617973;
	font-size: 6px;
	letter-spacing: 0.14em;
}

.miniFlow strong {
	display: block;
	color: #c3d2ce;
	font-size: 9px;
	line-height: 1.55;
}

.miniFlow .proofStep {
	border-color: rgba(32, 213, 196, 0.55);
	background: rgba(32, 213, 196, 0.08);
}

.miniFlow .proofStep small,
.miniFlow .proofStep strong {
	color: var(--aqua);
}

.useOutcome {
	margin-top: 16px;
	padding: 15px 18px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: var(--teal);
	color: var(--ink);
}

.useOutcome small {
	margin: 0;
	color: #0b685f;
}

.useOutcome strong {
	font: 400 14px var(--font-serif);
}

/* 9.0 Case studies -------------------------------------------------------- */

.caseStudies {
	padding: 120px 0;
}

.caseHeader {
	display: grid;
	grid-template-columns: 1fr 0.68fr;
	gap: 100px;
	align-items: end;
}

.caseGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 45px;
	border-top: 1px solid #c6cdc8;
	border-left: 1px solid #c6cdc8;
}

.caseGrid article {
	min-height: 390px;
	padding: 29px;
	display: flex;
	flex-direction: column;
	border-right: 1px solid #c6cdc8;
	border-bottom: 1px solid #c6cdc8;
	transition: background 0.25s ease, transform 0.25s ease;
}

.caseGrid article:hover {
	background: var(--paper);
	transform: translateY(-5px);
}

.caseNumber {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	margin-bottom: 45px;
	border: 1px solid #abc0ba;
	color: var(--teal-dark);
	font-size: 9px;
	transform: rotate(45deg);
}

.caseGrid small {
	color: var(--teal-dark);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.caseGrid h3 {
	margin: 16px 0 14px;
	font: 400 24px/1.2 var(--font-serif);
}

.caseGrid p {
	margin: 0;
	color: #6c7a76;
	font-size: 13px;
	line-height: 1.7;
}

.caseGrid > article > strong {
	margin-top: auto;
	padding-top: 25px;
	border-top: 1px solid #d7dcd8;
	color: #243b37;
	font-size: 11px;
}

.caseGrid > article > strong span {
	display: block;
	margin-bottom: 7px;
	color: #8a9793;
	font-size: 7px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

/* 10.0 Contact section and form ------------------------------------------- */

.contactSection {
	min-height: 720px;
	padding: 110px 0;
	position: relative;
	overflow: hidden;
	background: var(--ink-2);
}

.contactSection::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.18;
	background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 72px 72px;
	-webkit-mask-image: linear-gradient(90deg, #000, transparent 75%);
	mask-image: linear-gradient(90deg, #000, transparent 75%);
}

.contactGlow {
	position: absolute;
	left: -180px;
	bottom: -250px;
	width: 550px;
	height: 550px;
	border-radius: 50%;
	background: rgba(32, 213, 196, 0.09);
	filter: blur(50px);
}

.contactGrid {
	display: grid;
	grid-template-columns: 0.85fr 1.15fr;
	gap: 100px;
	position: relative;
	z-index: 2;
}

.contactCopy h2 {
	font-size: clamp(48px, 5vw, 68px);
	line-height: 1.02;
}

.contactCopy > p {
	max-width: 520px;
	color: #91a6a1;
	font-size: 15px;
	line-height: 1.75;
}

.contactPoints {
	margin-top: 40px;
}

.contactPoints > div {
	display: grid;
	grid-template-columns: 42px 1fr;
	gap: 15px;
	padding: 17px 0;
	border-top: 1px solid var(--line);
}

.contactPoints > div:last-child {
	border-bottom: 1px solid var(--line);
}

.contactPoints > div > span {
	width: 34px;
	height: 34px;
	display: grid;
	place-items: center;
	border: 1px solid rgba(32, 213, 196, 0.4);
	color: var(--teal);
	font-size: 8px;
}

.contactPoints p {
	margin: 0;
	color: #728a85;
	font-size: 11px;
	line-height: 1.55;
}

.contactPoints strong {
	display: block;
	margin-bottom: 3px;
	color: #dbe7e4;
	font: 400 15px var(--font-serif);
}

.contactCard {
	padding: 35px;
	background: #f5f3ed;
	color: var(--text);
	box-shadow: 0 40px 90px rgba(0, 0, 0, 0.2);
}

/* The contact page reuses the section markup; give it a heading slot. */
.contactPageHead {
	padding: 150px 0 0;
	position: relative;
	z-index: 2;
}

.contactPageHead h1 {
	font: 400 clamp(40px, 5vw, 60px) / 1.05 var(--font-serif);
	margin: 0 0 18px;
}

.contactPageHead p {
	max-width: 560px;
	color: #91a6a1;
	font-size: 15px;
	line-height: 1.75;
	margin: 0;
}

.formHeading {
	display: flex;
	justify-content: space-between;
	padding-bottom: 22px;
	border-bottom: 1px solid #cbd2ce;
}

.formHeading span,
.formHeading b {
	font-size: 8px;
	letter-spacing: 0.14em;
}

.formHeading span {
	color: var(--teal-dark);
	font-weight: 700;
}

.formHeading b {
	color: #81908c;
	font-weight: 400;
}

.fieldRow {
	display: grid;
	grid-template-columns: 135px 1fr;
	align-items: center;
	border-bottom: 1px solid #cbd2ce;
}

.fieldRow label {
	color: #53645f;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fieldRow input,
.fieldRow select,
.fieldRow textarea {
	width: 100%;
	border: 0;
	outline: 0;
	background: transparent;
	color: var(--text);
	appearance: none;
	-webkit-appearance: none;
	border-radius: 0;
}

.fieldRow select {
	padding-right: 24px;
	background-image: linear-gradient(45deg, transparent 50%, #53645f 50%),
		linear-gradient(135deg, #53645f 50%, transparent 50%);
	background-position: calc(100% - 12px) calc(50% + 1px), calc(100% - 7px) calc(50% + 1px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}

.fieldRow input,
.fieldRow select {
	min-height: 57px;
}

.fieldRow textarea {
	padding: 18px 0;
	resize: vertical;
	line-height: 1.5;
}

.fieldRow input::placeholder,
.fieldRow textarea::placeholder {
	color: #9ba7a3;
	opacity: 1;
}

.fieldRow input:focus,
.fieldRow select:focus,
.fieldRow textarea:focus {
	box-shadow: inset 0 -1px var(--teal-dark);
}

.fieldRow.has-error {
	border-bottom-color: var(--danger);
}

.fieldRow.has-error input,
.fieldRow.has-error select,
.fieldRow.has-error textarea {
	box-shadow: inset 0 -1px var(--danger);
}

.fieldError {
	grid-column: 2;
	padding: 6px 0 8px;
	color: var(--danger);
	font-size: 10px;
	line-height: 1.5;
}

.messageField {
	align-items: start;
}

.messageField label {
	padding-top: 20px;
	line-height: 1.5;
}

.formButton {
	width: 100%;
	margin-top: 24px;
}

.privacyNote {
	margin: 12px 0 0;
	color: #8d9995;
	font-size: 8px;
	line-height: 1.55;
	text-align: center;
}

.privacyNote a {
	text-decoration: underline;
}

/* Honeypot: hidden from sight, still reachable by naive bots. */
.ditHoneypot {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.formNotice {
	margin: 0 0 22px;
	padding: 15px 17px;
	border-left: 3px solid;
	font-size: 12px;
	line-height: 1.6;
}

.formNotice.is-success {
	background: var(--success-bg);
	border-color: var(--success);
	color: #0a5b54;
}

.formNotice.is-error {
	background: var(--danger-bg);
	border-color: var(--danger);
	color: #7d1a15;
}

.formNotice p {
	margin: 0 0 6px;
}

.formNotice p:last-child {
	margin-bottom: 0;
}

.formNotice a {
	text-decoration: underline;
}

/* 11.0 Site footer -------------------------------------------------------- */

footer {
	padding: 38px 0;
	border-top: 1px solid var(--line);
	background: var(--ink);
}

.footerGrid {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	align-items: center;
	gap: 24px;
}

.footerGrid > p {
	color: #748a85;
	font: 400 13px var(--font-serif);
	text-align: center;
}

.footerLinks {
	display: flex;
	justify-content: flex-end;
	gap: 22px;
	color: #819590;
	font-size: 10px;
	flex-wrap: wrap;
}

.footerLinks ul {
	display: contents;
	list-style: none;
}

.footerLinks li {
	display: block;
}

.footerLinks a:hover,
.footerLinks a:focus-visible,
.footerLinks a.isActive {
	color: var(--aqua);
}

.footerGrid > small {
	grid-column: 1 / -1;
	padding-top: 20px;
	border-top: 1px solid var(--line);
	color: #506762;
	font-size: 8px;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

/* 12.0 Page header (interior templates) ----------------------------------- */

.pageHero {
	position: relative;
	overflow: hidden;
	background: radial-gradient(circle at 78% 30%, #0c3732 0, var(--ink) 46%);
	padding: 76px 0 66px;
}

.pageHero::before {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.2;
	pointer-events: none;
	background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
	background-size: 72px 72px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 45%, #000);
	mask-image: linear-gradient(90deg, transparent, #000 45%, #000);
}

.pageHero .shell {
	position: relative;
	z-index: 2;
}

.pageHero h1 {
	font-size: clamp(42px, 4.6vw, 68px);
	line-height: 1.02;
	max-width: 16ch;
}

.pageHero .pageLead {
	max-width: 655px;
	margin: 0;
	color: #a9bbb7;
	font-size: 17px;
	line-height: 1.7;
}

.breadcrumbs {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	color: #748a85;
	font-size: 9px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.breadcrumbs li {
	display: inline;
}

.breadcrumbs li + li::before {
	content: " / ";
	margin: 0 6px;
	color: #445b57;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
	color: var(--aqua);
}

/* 13.0 WordPress content (block editor) ----------------------------------- */

.site-main {
	display: block;
}

.pageSection {
	padding: 78px 0 96px;
	background: var(--cream);
	color: var(--text);
}

.pageSection.is-dark {
	background: var(--ink);
	color: #fff;
}

.entryContent {
	max-width: 860px;
}

.entryContent > * + * {
	margin-top: 1.35em;
}

.entryContent h1,
.entryContent h2,
.entryContent h3,
.entryContent h4,
.entryContent h5,
.entryContent h6 {
	font-family: var(--font-serif);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1.15;
	margin: 1.9em 0 0;
	color: var(--text);
}

.is-dark .entryContent h1,
.is-dark .entryContent h2,
.is-dark .entryContent h3,
.is-dark .entryContent h4,
.is-dark .entryContent h5,
.is-dark .entryContent h6 {
	color: #fff;
}

.entryContent > :first-child {
	margin-top: 0;
}

.entryContent h2 {
	font-size: clamp(32px, 3.4vw, 44px);
}

.entryContent h3 {
	font-size: 27px;
}

.entryContent h4 {
	font-size: 22px;
}

.entryContent h5,
.entryContent h6 {
	font-size: 18px;
}

.entryContent p,
.entryContent li {
	font-size: 17px;
	line-height: 1.75;
}

.entryContent a {
	color: var(--teal-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.entryContent a:hover,
.entryContent a:focus-visible {
	color: var(--ink);
}

.is-dark .entryContent a {
	color: var(--aqua);
}

.is-dark .entryContent a:hover {
	color: var(--teal);
}

.entryContent ul,
.entryContent ol {
	padding-left: 1.35em;
}

.entryContent li + li {
	margin-top: 0.4em;
}

.entryContent blockquote {
	margin: 2em 0;
	padding: 26px 30px;
	background: #fff;
	border-left: 3px solid var(--teal-dark);
	font: 400 21px/1.5 var(--font-serif);
	color: #243b37;
}

.entryContent blockquote p {
	font: inherit;
}

.entryContent blockquote cite {
	display: block;
	margin-top: 12px;
	font: 400 11px/1.5 var(--font-sans);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #76847f;
}

.is-dark .entryContent blockquote {
	background: var(--panel);
	color: #dbe7e4;
}

.entryContent img,
.entryContent .wp-block-image img {
	border: 1px solid #cdd3ce;
}

.entryContent figure {
	margin: 2em 0;
}

.entryContent figcaption,
.entryContent .wp-element-caption {
	margin-top: 10px;
	color: #76847f;
	font-size: 12px;
	line-height: 1.6;
}

.entryContent code,
.entryContent pre {
	font-family: Consolas, Monaco, monospace;
	font-size: 0.88em;
}

.entryContent code {
	padding: 2px 6px;
	background: rgba(16, 39, 36, 0.07);
}

.entryContent pre {
	padding: 20px;
	overflow: auto;
	background: var(--ink);
	color: #dbe7e4;
	border: 0;
}

.entryContent pre code {
	background: none;
	padding: 0;
}

.entryContent table {
	width: 100%;
	margin: 2em 0;
	font-size: 15px;
}

.entryContent th,
.entryContent td {
	padding: 12px 14px;
	border: 1px solid #cdd3ce;
	text-align: left;
	vertical-align: top;
}

.entryContent th {
	background: rgba(16, 39, 36, 0.04);
	font-weight: 700;
}

.entryContent hr {
	margin: 2.5em 0;
	border-top-color: #cdd3ce;
}

.is-dark .entryContent hr {
	border-top-color: var(--line);
}

.entryContent .wp-block-button__link {
	min-height: 54px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	padding: 0 23px;
	background: var(--teal);
	color: var(--ink);
	border: 1px solid transparent;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	transition: transform 0.2s ease, background 0.2s ease;
}

.entryContent .wp-block-button__link:hover {
	background: var(--aqua);
	transform: translateY(-2px);
}

.entryContent .is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--text);
	border-color: #aebbb7;
}

.entryContent .alignleft {
	float: left;
	margin: 0.4em 1.8em 1em 0;
}

.entryContent .alignright {
	float: right;
	margin: 0.4em 0 1em 1.8em;
}

.entryContent .aligncenter {
	margin-inline: auto;
}

.entryContent .alignwide,
.entryContent .alignfull {
	max-width: none;
}

.entryContent .wp-block-quote,
.entryContent .wp-block-pullquote {
	border-left: 3px solid var(--teal-dark);
	padding: 26px 30px;
	background: #fff;
}

.entryContent .wp-block-pullquote {
	border: 0;
	border-top: 3px solid var(--teal-dark);
	border-bottom: 3px solid var(--teal-dark);
	background: transparent;
}

.entryContent .wp-block-separator {
	border-top: 1px solid #cdd3ce;
}

.entryContent .wp-block-columns {
	gap: 40px;
}

.entryContent .wp-block-cover,
.entryContent .wp-block-cover-image {
	min-height: 420px;
}

.entryContent .wp-block-gallery figcaption,
.entryContent .blocks-gallery-caption {
	color: #76847f;
}

.entryContent iframe {
	width: 100%;
}

.pageLinks {
	margin-top: 42px;
	padding-top: 26px;
	border-top: 1px solid #cdd3ce;
	font-size: 14px;
}

.pageLinks a {
	color: var(--teal-dark);
	text-decoration: underline;
}

.postMeta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
	color: #74827e;
	font-size: 9px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.is-dark .postMeta {
	color: #8ea39e;
}

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

.postMeta a:hover {
	color: var(--teal-dark);
}

.is-dark .postMeta a:hover {
	color: var(--aqua);
}

.postMeta .metaSep {
	color: #a9bbb7;
}

.featuredImage {
	margin: 0 0 40px;
	border: 1px solid #cdd3ce;
	background: #fff;
}

.featuredImage img {
	width: 100%;
}

.is-dark .featuredImage {
	border-color: var(--line);
	background: var(--panel);
}

.postNav {
	margin-top: 56px;
	padding-top: 30px;
	border-top: 1px solid #cdd3ce;
}

.postNav .nav-links {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
}

.is-dark .postNav {
	border-top-color: var(--line);
}

.postNav a {
	display: block;
	padding: 22px 24px;
	background: #fff;
	border: 1px solid #cdd3ce;
	font: 400 18px/1.35 var(--font-serif);
	color: var(--text);
	text-decoration: none;
	transition: border-color 0.2s ease, transform 0.2s ease;
}

.is-dark .postNav a {
	background: var(--panel);
	border-color: var(--line);
	color: #fff;
}

.postNav a:hover {
	border-color: var(--teal);
	transform: translateY(-2px);
}

.postNav small {
	display: block;
	margin-bottom: 10px;
	color: var(--teal-dark);
	font: 700 8px/1 var(--font-sans);
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.is-dark .postNav small {
	color: var(--aqua);
}

.postNav .next {
	text-align: right;
}

/* 14.0 Blog listings, pagination and search ------------------------------- */

.blogSection {
	padding: 70px 0 100px;
	background: var(--cream);
	color: var(--text);
}

.postGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	border-top: 1px solid #c6cdc8;
	border-left: 1px solid #c6cdc8;
}

.postCard {
	display: flex;
	flex-direction: column;
	background: transparent;
	border-right: 1px solid #c6cdc8;
	border-bottom: 1px solid #c6cdc8;
	transition: background 0.25s ease, transform 0.25s ease;
}

.postCard:hover {
	background: var(--paper);
}

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

.postCard__thumb {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #e8f0eb;
	border-bottom: 1px solid #c6cdc8;
}

.postCard__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.postCard:hover .postCard__thumb img {
	transform: scale(1.04);
}

.postCard__thumb.isEmpty {
	display: grid;
	place-items: center;
}

.postCard__thumb.isEmpty .mark {
	width: 46px;
	height: 46px;
	border-color: rgba(15, 141, 131, 0.4);
	background: rgba(255, 255, 255, 0.7);
	color: var(--teal-dark);
}

.postCard__thumb.isEmpty .mark svg {
	width: 27px;
	height: 27px;
}

.postCard__body {
	padding: 26px 27px 30px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.postCard__terms {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
}

.postCard__terms a {
	display: inline-block;
	padding: 5px 10px;
	background: rgba(15, 141, 131, 0.1);
	color: var(--teal-dark);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.postCard__terms a:hover {
	background: var(--teal-dark);
	color: #fff;
}

.postCard h2,
.postCard h3 {
	margin: 0 0 12px;
	font: 400 24px/1.22 var(--font-serif);
	color: var(--text);
}

.postCard h2 a,
.postCard h3 a {
	text-decoration: none;
}

.postCard h2 a:hover,
.postCard h3 a:hover {
	color: var(--teal-dark);
}

.postCard__excerpt {
	margin: 0 0 20px;
	color: #6c7a76;
	font-size: 13px;
	line-height: 1.7;
}

.postCard__meta {
	margin: auto 0 0;
	padding-top: 20px;
	border-top: 1px solid #d7dcd8;
	color: #8a9793;
	font-size: 8px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.readMore {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	margin-top: 18px;
	color: var(--teal-dark);
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.readMore .arrow {
	transition: transform 0.2s ease;
}

.readMore:hover .arrow {
	transform: translateX(4px);
}

.homeBlogHeadLink {
	justify-self: end;
	margin-bottom: 31px;
}

.homeBlog {
	padding: 0 0 100px;
	background: var(--cream);
	color: var(--text);
}

.homeBlog .postGrid {
	margin-top: 58px;
}

.homeBlogFoot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 42px;
}

.homeBlogFoot .readMore {
	margin-top: 0;
}

.pagination {
	margin-top: 48px;
}

.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: 0 12px;
	border: 1px solid #c6cdc8;
	background: var(--paper);
	color: #53645f;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-decoration: none;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.pagination .page-numbers:hover,
.pagination .page-numbers:focus-visible {
	border-color: var(--teal-dark);
	color: var(--teal-dark);
}

.pagination .page-numbers.current {
	background: var(--teal-dark);
	border-color: var(--teal-dark);
	color: #fff;
}

.pagination .page-numbers.dots {
	border-color: transparent;
	background: transparent;
}

.searchForm {
	display: flex;
	gap: 10px;
	max-width: 560px;
}

.searchForm label {
	flex: 1;
	display: block;
}

.searchForm input[type="search"] {
	width: 100%;
	min-height: 54px;
	padding: 0 18px;
	border: 1px solid #c6cdc8;
	background: #fff;
	color: var(--text);
	border-radius: 0;
	appearance: none;
}

.is-dark .searchForm input[type="search"] {
	background: rgba(255, 255, 255, 0.04);
	border-color: var(--line);
	color: #fff;
}

.searchForm button {
	min-height: 54px;
	padding: 0 22px;
	border: 1px solid transparent;
	background: var(--teal-dark);
	color: #fff;
	cursor: pointer;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.searchForm button:hover {
	background: var(--ink);
}

.searchSummary {
	margin: 0 0 34px;
	color: #6c7a76;
	font-size: 14px;
}

.searchSummary strong {
	color: var(--text);
}

/* 15.0 Comments ----------------------------------------------------------- */

.commentsArea {
	margin-top: 64px;
	padding-top: 40px;
	border-top: 1px solid #cdd3ce;
}

.is-dark .commentsArea {
	border-top-color: var(--line);
}

.commentsArea h2,
.commentsTitle {
	margin: 0 0 24px;
	font: 400 26px/1.2 var(--font-serif);
	color: var(--text);
}

.is-dark .commentsArea h2,
.is-dark .commentsTitle {
	color: #fff;
}

.commentList {
	margin: 0 0 40px;
	padding: 0;
	list-style: none;
}

.commentList .children {
	margin: 26px 0 0;
	padding-left: 34px;
	list-style: none;
	border-left: 1px solid #cdd3ce;
}

.is-dark .commentList .children {
	border-left-color: var(--line);
}

.commentBody {
	padding: 24px 0;
	border-bottom: 1px solid #cdd3ce;
}

.is-dark .commentBody {
	border-bottom-color: var(--line);
}

.commentMeta {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 10px;
}

.commentMeta img {
	border-radius: 50%;
}

.commentMeta .fn {
	font: 400 17px var(--font-serif);
	color: var(--text);
	font-style: normal;
}

.is-dark .commentMeta .fn {
	color: #fff;
}

.commentMeta .commentDate {
	color: #8a9793;
	font-size: 9px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.commentContent p {
	font-size: 15px;
	line-height: 1.7;
}

.commentContent a {
	color: var(--teal-dark);
	text-decoration: underline;
}

.is-dark .commentContent a {
	color: var(--aqua);
}

.commentReply {
	margin-top: 12px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--teal-dark);
}

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

.bypostauthor > .commentBody .fn::after {
	content: " · Author";
	color: var(--teal-dark);
	font: 700 8px/1 var(--font-sans);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.commentForm {
	padding: 30px;
	background: #fff;
	border: 1px solid #cdd3ce;
}

.is-dark .commentForm {
	background: var(--panel);
	border-color: var(--line);
}

.commentForm p {
	margin-bottom: 18px;
}

.commentForm label {
	display: block;
	margin-bottom: 8px;
	color: #53645f;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.is-dark .commentForm label {
	color: #b6c7c3;
}

.commentForm input[type="text"],
.commentForm input[type="email"],
.commentForm input[type="url"],
.commentForm textarea {
	width: 100%;
	min-height: 48px;
	padding: 10px 14px;
	border: 1px solid #c6cdc8;
	background: #fff;
	color: var(--text);
	border-radius: 0;
}

.is-dark .commentForm input[type="text"],
.is-dark .commentForm input[type="email"],
.is-dark .commentForm input[type="url"],
.is-dark .commentForm textarea {
	background: rgba(255, 255, 255, 0.04);
	border-color: var(--line);
	color: #fff;
}

.commentForm textarea {
	min-height: 150px;
	line-height: 1.6;
}

.commentForm .submit {
	min-height: 52px;
	padding: 0 24px;
	border: 1px solid transparent;
	background: var(--teal-dark);
	color: #fff;
	cursor: pointer;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.commentForm .submit:hover {
	background: var(--ink);
}

.commentNotes,
.commentForm .logged-in-as {
	color: #8a9793;
	font-size: 11px;
	line-height: 1.6;
}

.commentNotes a,
.commentForm .logged-in-as a {
	color: var(--teal-dark);
}

/* 16.0 Error page (404) ---------------------------------------------------- */

.errorSection {
	min-height: 70vh;
	display: grid;
	place-items: center;
	padding: 110px 0;
	background: radial-gradient(circle at 50% 0%, #0c3732 0, var(--ink) 60%);
}

.errorCode {
	margin: 0;
	color: var(--teal);
	font: 400 clamp(92px, 16vw, 190px)/0.9 var(--font-serif);
	letter-spacing: -0.05em;
}

.errorCode em {
	color: #fff;
}

.errorSection h1 {
	max-width: 18ch;
	font-size: clamp(34px, 3.6vw, 50px);
	line-height: 1.08;
}

.errorSection p {
	max-width: 520px;
	margin: 0 0 30px;
	color: #a9bbb7;
	font-size: 16px;
	line-height: 1.7;
}

.errorActions {
	display: flex;
	flex-wrap: wrap;
	gap: 13px;
	margin-bottom: 38px;
}

.errorLinks {
	margin: 38px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	font-size: 11px;
}

.errorLinks a {
	color: var(--aqua);
}

.errorLinks a:hover {
	color: var(--teal);
}

/* 17.0 Animations and motion preferences ---------------------------------- */

@keyframes slowPulse {
	0%,
	100% {
		transform: scale(1);
		opacity: 0.5;
	}
	50% {
		transform: scale(1.035);
		opacity: 1;
	}
}

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

@media (prefers-contrast: more) {
	:root {
		--line: rgba(255, 255, 255, 0.35);
	}
	.heroLead,
	.pageHero .pageLead,
	.explorerIntro > p:last-child,
	.contactCopy > p,
	.errorSection p {
		color: #c2d2ce;
	}
}

/* 18.0 Responsive rules --------------------------------------------------- */

@media (max-width: 1180px) {
	.explorer {
		padding: 60px;
		gap: 55px;
	}
}

@media (max-width: 1050px) {
	.navLinks {
		gap: 19px;
	}
	.heroGrid {
		gap: 20px;
	}
	.proofDemo {
		transform: scale(0.92);
	}
	.explorer {
		padding: 55px 45px;
		gap: 45px;
	}
	.miniFlow {
		grid-template-columns: 1fr 12px 1fr;
		gap: 6px 0;
	}
	.miniFlow > i:nth-of-type(2) {
		display: none;
	}
	.miniFlow > div:nth-of-type(3) {
		grid-column: 1;
	}
	.miniFlow > i:nth-of-type(3) {
		grid-column: 2;
	}
	.miniFlow > div:nth-of-type(4) {
		grid-column: 3;
	}
	.postGrid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 860px) {
	html {
		scroll-padding-top: 72px;
	}
	:root {
		--gutter: 40px;
		--header-height: 72px;
	}
	.shell {
		width: min(100% - var(--gutter), 680px);
	}
	.siteHeader {
		position: relative;
	}
	.is-front-page .siteHeader {
		position: absolute;
	}
	.headerCta {
		display: none;
	}
	.menuButton {
		display: flex;
	}
	.navLinks {
		position: absolute;
		top: var(--header-height);
		left: 20px;
		right: 20px;
		padding: 22px;
		display: none;
		overflow: auto;
		scrollbar-width: none;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		background: #08211ff7;
		border: 1px solid var(--line);
		box-shadow: 0 25px 60px rgba(0, 0, 0, 0.35);
	}
	.navLinks.isOpen {
		display: flex;
	}
	.navLinks ul {
		display: block;
	}
	.navLinks a {
		padding: 14px 8px;
		border-bottom: 1px solid var(--line);
	}
	.navLinks > ul > li:last-child > a {
		border-bottom: 0;
	}
	.navLinks a::after {
		display: none;
	}
	.navLinks .sub-menu {
		position: static;
		min-width: 0;
		padding: 0 0 8px 16px;
		background: transparent;
		border: 0;
		box-shadow: none;
	}
	.navLinks .sub-menu .sub-menu {
		top: auto;
		left: auto;
	}
	.hero {
		padding-top: var(--header-height);
	}
	.heroGrid {
		grid-template-columns: 1fr;
		padding-top: 70px;
	}
	.heroCopy {
		padding: 0;
	}
	.proofDemo {
		height: 570px;
		transform: none;
	}
	.heroIndex {
		margin-top: 25px;
	}
	.sectionIntro,
	.caseHeader,
	.contactGrid {
		grid-template-columns: 1fr;
		gap: 10px;
	}
	.trustFlow {
		grid-template-columns: 1fr;
	}
	.trustFlow article {
		min-height: 215px;
	}
	.flowArrow {
		height: 45px;
		transform: rotate(90deg);
	}
	.outcomes {
		grid-template-columns: 1fr 1fr;
	}
	.explorer {
		grid-template-columns: 1fr;
	}
	.caseHeader > p {
		max-width: 520px;
	}
	.caseGrid {
		grid-template-columns: 1fr;
	}
	.caseGrid article {
		min-height: 340px;
	}
	.contactGrid {
		gap: 55px;
	}
	.footerGrid {
		grid-template-columns: 1fr;
	}
	.footerGrid > p {
		text-align: left;
	}
	.footerLinks {
		justify-content: flex-start;
	}
	.pageHero {
		padding: 54px 0 48px;
	}
	.postGrid {
		grid-template-columns: 1fr;
	}
	.entryContent {
		max-width: none;
	}
}

@media (max-width: 560px) {
	:root {
		--gutter: 30px;
	}
	.shell {
		width: calc(100% - var(--gutter));
	}
	.brand {
		font-size: 14px;
	}
	.brand .mark.compact {
		width: 31px;
		height: 31px;
	}
	h1 {
		font-size: clamp(50px, 15vw, 68px);
	}
	.heroGrid {
		padding-top: 55px;
	}
	.heroActions {
		flex-direction: column;
		align-items: stretch;
	}
	.heroSignals {
		display: grid;
		grid-template-columns: 1fr;
	}
	.proofDemo {
		height: 520px;
		margin-inline: -20px;
		transform: scale(0.9);
	}
	.orbitOne {
		width: 440px;
		height: 440px;
	}
	.orbitTwo {
		width: 345px;
		height: 345px;
	}
	.tokenCard {
		width: 375px;
		max-width: calc(100vw - 22px);
	}
	.proofTag {
		display: none;
	}
	.heroIndex span:last-child {
		display: none;
	}
	.platformSection {
		padding-top: 82px;
	}
	.sectionIntro h2,
	.caseHeader h2 {
		font-size: 44px;
	}
	.outcomes {
		grid-template-columns: 1fr;
	}
	.outcomes > div {
		min-height: auto;
		border-bottom: 1px solid #cdd3ce;
	}
	.explorer {
		margin: 82px -15px 0;
		padding: 54px 20px;
	}
	.useTabs {
		grid-template-columns: 1fr 1fr;
	}
	.useTabs button {
		border-bottom: 1px solid var(--line);
	}
	.miniFlow {
		grid-template-columns: 1fr;
	}
	.miniFlow > i {
		height: 24px;
		transform: rotate(90deg);
	}
	.miniFlow > div:nth-of-type(3),
	.miniFlow > i:nth-of-type(3),
	.miniFlow > div:nth-of-type(4) {
		grid-column: auto;
	}
	.miniFlow > i:nth-of-type(2) {
		display: grid;
	}
	.miniFlow > div {
		min-height: 80px;
	}
	.useOutcome {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}
	.caseStudies {
		padding: 88px 0;
	}
	.contactSection {
		padding: 82px 0;
	}
	.contactCard {
		padding: 24px 18px;
	}
	.fieldRow {
		grid-template-columns: 1fr;
		padding-top: 16px;
	}
	.fieldRow input,
	.fieldRow select {
		min-height: 43px;
	}
	.fieldError {
		grid-column: 1;
	}
	.messageField label {
		padding: 0;
	}
	.formHeading {
		flex-direction: column;
		gap: 7px;
	}
	.searchForm {
		flex-direction: column;
	}
	.postCard__body {
		padding: 22px 20px 26px;
	}
	.entryContent p,
	.entryContent li {
		font-size: 16px;
	}
	.entryContent blockquote,
	.entryContent .wp-block-quote,
	.entryContent .wp-block-pullquote {
		padding: 22px 20px;
	}
	.commentList .children {
		padding-left: 18px;
	}
	.commentForm {
		padding: 22px 18px;
	}
}

/* 19.0 Print -------------------------------------------------------------- */

@media print {
	.siteHeader,
	footer,
	.proofDemo,
	.menuButton,
	.pagination,
	.commentsArea,
	.contactCard {
		display: none !important;
	}
	body {
		background: #fff;
		color: #000;
	}
	a {
		text-decoration: underline;
	}
}