/* ==========================================================================
   CLOUDWRAITH - SPECTRAL

   The Apparition's language, carried through the rest of the site.

   Type     Cormorant Garamond for display (literary, haunting), Newsreader
            for reading, JetBrains Mono for every machine voice.
   Ghosts   Any <em> inside a heading glows and flickers like the hero's
            "ghost": the one word the light catches.
   Scenes   Post, archive and band headers reuse the .cw-app layers: the image
            waits in the dark and the visitor's light reveals it.
   Cards    Dim at rest, lit where the pointer falls, viewfinder corners on
            hover.
   Field    On inner pages a faint grid exists only inside the cursor's light.
   ========================================================================== */

/* --- Type system ---------------------------------------------------------- */

body {
	font-optical-sizing: auto;
	font-kerning: normal;
}

h1, h2, h3, h4,
.entry-title,
.elementor-heading-title {
	font-weight: 600;
	line-height: 1.04;
	letter-spacing: var(--cw-tracking-tight);
}

/* Ghost words. */
:is(h1, h2, h3, h4, .elementor-heading-title, .cw-app__title) em,
.cw-ghost {
	font-style: italic;
	font-weight: 500;
	color: var(--cw-accent-bright);
	text-shadow:
		0 0 14px rgba(75, 255, 139, 0.55),
		0 0 48px rgba(47, 230, 200, 0.35);
	padding-right: 0.04em;
}

@media (prefers-reduced-motion: no-preference) {
	:is(h1, h2, h3, h4, .elementor-heading-title, .cw-app__title) em,
	.cw-ghost {
		animation: cw-haunt 8s ease-in-out infinite;
	}
}

@keyframes cw-haunt {
	0%, 44%, 100% { opacity: 1; filter: none; }
	46%           { opacity: 0.45; filter: blur(0.8px); }
	47.5%         { opacity: 1; filter: none; }
	49%           { opacity: 0.7; }
	50.5%         { opacity: 1; }
}

/* --- The Apparition, re-set in the new type ------------------------------- */

.cw-app__title {
	font-family: var(--cw-font-display);
	font-weight: 500;
	font-size: clamp(3.5rem, 1.1rem + 7.6vw, 9.5rem);
	line-height: 0.86;
	letter-spacing: -0.028em;
}

.cw-app__title .cw-app__ghost {
	-webkit-text-stroke: 0;
	font-style: italic;
	font-weight: 500;
	color: var(--cw-accent-bright);
	text-shadow:
		0 0 16px rgba(75, 255, 139, 0.6),
		0 0 64px rgba(47, 230, 200, 0.4);
}
.cw-app:hover .cw-app__ghost { color: var(--cw-accent-bright); }

@media (prefers-reduced-motion: no-preference) {
	.cw-app__title .cw-app__ghost { animation: cw-haunt 8s ease-in-out infinite; }
}

.cw-app__lede { font-family: var(--cw-font-body); }

/* Any scene image can choose its own focal point. */
.cw-app .cw-app__img { object-position: var(--fpos, 50% 30%); }

/* --- Scenes: post, archive and band headers ------------------------------- */

.cw-scene-host,
.cw-scene-host > .e-con-inner {
	padding: 0 !important;
	gap: 0 !important;
	min-height: 0 !important;
}
.cw-scene-host {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
.cw-scene-host > .e-con-inner { max-width: none !important; }
.cw-scene-host .elementor-widget-shortcode,
.cw-scene-host .elementor-shortcode { width: 100%; }

body { overflow-x: clip; }

.cw-app.cw-app--post    { min-height: clamp(540px, 84svh, 900px); }
.cw-app.cw-app--archive { min-height: clamp(440px, 62svh, 680px); border-bottom: 1px solid var(--cw-hairline); }
.cw-app.cw-app--band    { min-height: clamp(460px, 68svh, 740px); border-block: 1px solid var(--cw-hairline); }

.cw-app--post .cw-app__title {
	font-size: clamp(2.6rem, 1.15rem + 4.6vw, 6.25rem);
	font-weight: 600;
	line-height: 0.96;
	letter-spacing: -0.02em;
	max-width: 15ch;
}

.cw-app--archive .cw-app__title,
.cw-app--band .cw-app__title {
	font-size: clamp(2.75rem, 1.2rem + 5vw, 7rem);
	max-width: 14ch;
}

.cw-app__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 0.9rem;
	margin: var(--cw-space-m) 0 0;
	font-family: var(--cw-font-mono);
	font-size: 0.75rem;
	letter-spacing: var(--cw-tracking-mono);
	text-transform: uppercase;
	color: var(--cw-text-muted);
}
.cw-app__meta a { color: var(--cw-accent); text-decoration: none; }
.cw-app__meta a:hover { color: var(--cw-accent-bright); }
.cw-app__meta span + span::before {
	content: '/';
	margin-right: 0.9rem;
	color: var(--cw-hairline-strong);
}

/* Post HUD replaces the meta line once there is room for it. */
@media (min-width: 768px) {
	.cw-app--post .cw-app__meta { display: none; }
}

@media (max-width: 767px) {
	.cw-app.cw-app--post    { min-height: 560px; }
	.cw-app.cw-app--archive { min-height: 440px; }
	.cw-app.cw-app--band    { min-height: 500px; }
	.cw-app--post .cw-app__body { padding-bottom: 2.5rem; }
}

/* --- Portrait scenes (About, 404) ---------------------------------------- */

.cw-portrait-scene {
	--mx: 50%;
	--my: 30%;
	--ms: 1;
	--cw-app-r: clamp(120px, 16vw, 210px);
	--cw-app-pad: 0.9rem;
	position: relative;
	isolation: isolate;
	overflow: hidden;
	margin: 0;
	width: 100%;
	max-width: 460px;
	aspect-ratio: 3 / 4;
	border: 1px solid var(--cw-hairline);
	border-radius: var(--cw-radius-l);
	background: var(--cw-void);
	box-shadow: var(--cw-glow-soft);
}
.cw-portrait-scene img.cw-app__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	object-position: 50% 20%;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
.cw-portrait-scene .cw-app__corner { width: 16px; height: 16px; }
.cw-portrait-scene figcaption {
	position: absolute;
	left: 2rem;
	right: 2rem;
	bottom: 1.6rem;
	margin: 0;
	text-align: left;
	font-family: var(--cw-font-mono);
	font-size: 0.6875rem;
	letter-spacing: var(--cw-tracking-mono);
	text-transform: uppercase;
	color: var(--cw-text-muted);
}
.cw-portrait-scene figcaption b { color: var(--cw-accent); font-weight: 500; }
.cw-portrait-scene::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(0deg, rgba(4, 7, 10, 0.9) 0%, transparent 34%);
}

/* --- Section headings: a numbered, italic display line -------------------- */

body { counter-reset: cw-sec; }

body .cw-section .elementor-widget-heading.cw-eyebrow .elementor-heading-title,
body .cw-section .cw-section__title .elementor-heading-title {
	font-family: var(--cw-font-display);
	font-style: italic;
	font-weight: 500;
	font-size: var(--cw-step-3);
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--cw-text-strong);
	margin: 0;
}

body .cw-section .elementor-widget-heading.cw-eyebrow .elementor-heading-title::before,
body .cw-section .cw-section__title .elementor-heading-title::before {
	counter-increment: cw-sec;
	content: counter(cw-sec, decimal-leading-zero) ' /';
	display: inline-block;
	margin-right: 1rem;
	transform: translateY(-0.55em);
	font-family: var(--cw-font-mono);
	font-style: normal;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	color: var(--cw-accent);
	text-shadow: none;
}

body .cw-section .elementor-widget-heading.cw-eyebrow { margin-bottom: var(--cw-space-l); }

/* Plain eyebrows elsewhere stay small and mechanical. */
body .elementor-widget-heading.cw-eyebrow:not(.cw-section .cw-eyebrow) .elementor-heading-title {
	font-family: var(--cw-font-mono);
	font-size: 0.75rem;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cw-accent);
}

/* --- Cards: dim until the light finds them ------------------------------- */

.cw-card,
.cw-archive-grid .elementor-post__card,
.cw-archive-grid .elementor-posts--skin-classic .elementor-post {
	--sx: 50%;
	--sy: -40%;
	position: relative;
	background:
		radial-gradient(440px circle at var(--sx) var(--sy), rgba(47, 230, 200, 0.08), transparent 62%),
		var(--cw-panel);
}

.cw-card:hover,
.cw-archive-grid .elementor-post:hover .elementor-post__card,
.cw-archive-grid .elementor-posts--skin-classic .elementor-post:hover {
	background:
		radial-gradient(440px circle at var(--sx) var(--sy), rgba(47, 230, 200, 0.15), transparent 62%),
		var(--cw-panel-raised);
}

/* Viewfinder corners. */
.cw-card::before,
.cw-archive-grid .elementor-post__card::before {
	--c: var(--cw-accent);
	content: '';
	position: absolute;
	inset: 12px;
	z-index: 3;
	pointer-events: none;
	opacity: 0;
	background:
		linear-gradient(var(--c), var(--c)) 0 0 / 14px 1px,
		linear-gradient(var(--c), var(--c)) 0 0 / 1px 14px,
		linear-gradient(var(--c), var(--c)) 100% 0 / 14px 1px,
		linear-gradient(var(--c), var(--c)) 100% 0 / 1px 14px,
		linear-gradient(var(--c), var(--c)) 0 100% / 14px 1px,
		linear-gradient(var(--c), var(--c)) 0 100% / 1px 14px,
		linear-gradient(var(--c), var(--c)) 100% 100% / 14px 1px,
		linear-gradient(var(--c), var(--c)) 100% 100% / 1px 14px;
	background-repeat: no-repeat;
	transition: opacity var(--cw-dur) var(--cw-ease), inset var(--cw-dur) var(--cw-ease);
}
.cw-card:hover::before,
.cw-card:focus-within::before,
.cw-archive-grid .elementor-post:hover .elementor-post__card::before {
	opacity: 1;
	inset: 7px;
}

/* Imagery: veiled at rest, revealed under the pointer. */
.cw-card__media img,
.cw-archive-grid .elementor-post__thumbnail img {
	filter: saturate(0.55) brightness(0.72) contrast(1.08);
	transition: filter 700ms var(--cw-ease), transform var(--cw-dur-slow) var(--cw-ease);
}
.cw-card:hover .cw-card__media img,
.cw-card:focus-within .cw-card__media img,
.cw-archive-grid .elementor-post:hover .elementor-post__thumbnail img {
	filter: saturate(0.9) brightness(0.92) contrast(1.04);
}

.cw-card__media::after,
.cw-archive-grid .elementor-post__thumbnail::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0;
	-webkit-backdrop-filter: brightness(1.7) saturate(2.2);
	backdrop-filter: brightness(1.7) saturate(2.2);
	-webkit-mask-image: radial-gradient(circle 190px at var(--sx) var(--sy), #000 0%, rgba(0, 0, 0, 0.55) 50%, transparent 100%);
	mask-image: radial-gradient(circle 190px at var(--sx) var(--sy), #000 0%, rgba(0, 0, 0, 0.55) 50%, transparent 100%);
	transition: opacity var(--cw-dur) var(--cw-ease);
}
.cw-card:hover .cw-card__media::after,
.cw-archive-grid .elementor-post:hover .elementor-post__thumbnail::after { opacity: 1; }

/* No pointer to carry a light: show the art at a calm, readable level. */
@media (hover: none) {
	.cw-card__media img,
	.cw-archive-grid .elementor-post__thumbnail img {
		filter: saturate(0.85) brightness(0.85);
	}
}

/* Scanlines over card art. */
.cw-card__media::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	opacity: 0.4;
	background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.35) 0 1px, transparent 1px 3px);
}

.cw-card__title,
.cw-archive-grid .elementor-post__title,
.cw-archive-grid .elementor-post__title a,
.cw-archive-grid .elementor-post__card .elementor-post__title a {
	font-family: var(--cw-font-display);
	font-weight: 600;
	font-size: clamp(1.45rem, 1.3rem + 0.45vw, 1.75rem);
	line-height: 1.08;
	letter-spacing: -0.008em;
}

.cw-card--featured .cw-card__title {
	font-size: clamp(2rem, 1.35rem + 1.7vw, 3.1rem);
	line-height: 1.02;
}

.cw-card__excerpt,
.cw-archive-grid .elementor-post__excerpt p {
	font-family: var(--cw-font-body);
	font-size: 1rem;
	line-height: 1.6;
}

/* --- Single post: reading room ------------------------------------------- */

.cw-single__body .elementor-widget-theme-post-content {
	width: 100%;
	max-width: var(--cw-measure);
	margin-inline: auto;
	counter-reset: cw-h2;
}

.cw-single__body .elementor-widget-theme-post-content .elementor-widget-container > * {
	max-width: none;
	margin-inline: 0;
}

.cw-single__body .elementor-widget-theme-post-content {
	font-family: var(--cw-font-body);
	font-size: 1.25rem;
	line-height: 1.78;
	color: var(--cw-text);
}

/* Drop cap: the first letter of the first paragraph, lit. */
.cw-single__body .elementor-widget-theme-post-content .elementor-widget-container > p:first-of-type::first-letter {
	float: left;
	margin: 0.06em 0.12em 0 0;
	font-family: var(--cw-font-display);
	font-style: italic;
	font-weight: 600;
	font-size: 4.6em;
	line-height: 0.74;
	color: var(--cw-accent-bright);
	text-shadow: 0 0 18px rgba(75, 255, 139, 0.55), 0 0 60px rgba(47, 230, 200, 0.35);
}

.cw-single__body .elementor-widget-theme-post-content h2 {
	font-size: var(--cw-step-3);
	margin: 2.4em 0 0.55em;
	color: var(--cw-text-strong);
}
.cw-single__body .elementor-widget-theme-post-content h2::before {
	counter-increment: cw-h2;
	content: '\00A7  ' counter(cw-h2, decimal-leading-zero);
	display: block;
	margin-bottom: 0.9rem;
	font-family: var(--cw-font-mono);
	font-size: 0.75rem;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.2em;
	color: var(--cw-accent);
}
.cw-single__body .elementor-widget-theme-post-content h2:first-child { margin-top: 0.4em; }

.cw-single__body .elementor-widget-theme-post-content h3 {
	font-size: var(--cw-step-2);
	font-style: italic;
	font-weight: 500;
	margin: 1.8em 0 0.5em;
}

.cw-single__body .elementor-widget-theme-post-content a {
	color: var(--cw-accent);
	text-decoration-color: rgba(75, 255, 139, 0.45);
}
.cw-single__body .elementor-widget-theme-post-content a:hover {
	color: var(--cw-accent-bright);
	text-shadow: 0 0 12px rgba(75, 255, 139, 0.5);
}

/* Blockquotes read as intercepted transmissions. */
.cw-single__body blockquote,
.cw-prose blockquote {
	position: relative;
	margin: 2.4em 0;
	padding: 0.2em 0 0.2em 1.6rem;
	border-left: 1px solid var(--cw-accent);
	box-shadow: -10px 0 26px -16px rgba(75, 255, 139, 0.75);
	font-family: var(--cw-font-display);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(1.55rem, 1.35rem + 0.7vw, 1.95rem);
	line-height: 1.3;
	color: var(--cw-text-strong);
}
.cw-single__body blockquote::before,
.cw-prose blockquote::before {
	content: '// Intercepted';
	display: block;
	margin-bottom: 0.8rem;
	font-family: var(--cw-font-mono);
	font-style: normal;
	font-size: 0.6875rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cw-accent);
}

/* The end mark. */
.cw-single__body .elementor-widget-theme-post-content .elementor-widget-container::after {
	content: '\25C9   End of transmission';
	display: block;
	margin-top: 3.5rem;
	padding-top: 1.4rem;
	border-top: 1px solid var(--cw-hairline);
	font-family: var(--cw-font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cw-text-muted);
}

.cw-single__nav .post-navigation__prev--title,
.cw-single__nav .post-navigation__next--title {
	font-family: var(--cw-font-display);
	font-weight: 600;
	font-size: 1.4rem;
	line-height: 1.12;
}

.cw-single__nav .elementor-post-navigation__link a {
	--sx: 50%;
	--sy: -40%;
	background:
		radial-gradient(380px circle at var(--sx) var(--sy), rgba(47, 230, 200, 0.1), transparent 62%),
		var(--cw-panel);
}

/* --- About / 404 prose ---------------------------------------------------- */

.cw-prose,
.cw-404__text {
	font-family: var(--cw-font-body);
	font-size: 1.1875rem;
	line-height: 1.75;
}

.cw-404__title .elementor-heading-title { font-size: var(--cw-step-5); }

/* --- Footer --------------------------------------------------------------- */

body .cw-footer__wordmark .elementor-heading-title {
	font-family: var(--cw-font-display);
	font-style: italic;
	font-weight: 500;
	font-size: 2.4rem;
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--cw-accent-bright);
	text-shadow: 0 0 14px rgba(75, 255, 139, 0.5), 0 0 48px rgba(47, 230, 200, 0.3);
}

body .cw-footer__heading .elementor-heading-title {
	font-family: var(--cw-font-mono);
	font-size: 0.75rem;
	font-weight: 500;
	font-style: normal;
	line-height: 1.4;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cw-text-muted);
}

.cw-footer__blurb { font-family: var(--cw-font-body); }

/* --- Light field: the grid exists only where you look -------------------- */

html.cw-lightfield body::before,
html.cw-lightfield body::after {
	content: '';
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
}

html.cw-lightfield body::before {
	background-image:
		linear-gradient(rgba(75, 255, 139, 0.2) 1px, transparent 1px),
		linear-gradient(90deg, rgba(75, 255, 139, 0.2) 1px, transparent 1px);
	background-size: 56px 56px;
	background-position: -1px -1px;
	-webkit-mask-image: radial-gradient(circle 340px at var(--gx, -999px) var(--gy, -999px), rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2) 50%, transparent 78%);
	mask-image: radial-gradient(circle 340px at var(--gx, -999px) var(--gy, -999px), rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2) 50%, transparent 78%);
}

html.cw-lightfield body::after {
	background: radial-gradient(circle 560px at var(--gx, -999px) var(--gy, -999px), rgba(47, 230, 200, 0.055), transparent 70%);
}

/* Header nav stays mono: Elementor's nav widget inherits the kit display
   face, which now is the serif. The menu is a machine voice. */
body .cw-header__nav .elementor-nav-menu .elementor-item,
body .cw-header__nav .elementor-nav-menu .elementor-sub-item,
body .cw-header__nav .elementor-nav-menu--dropdown a {
	font-family: var(--cw-font-mono);
	font-weight: 500;
	font-style: normal;
}

/* Page headings take the white and a tight leading; the accent is reserved
   for ghost words. Beats Elementor's per-widget colour and line-height. */
body .elementor-widget-heading:not(.cw-eyebrow):not(.cw-footer__heading):not(.cw-footer__wordmark) :is(h1, h2).elementor-heading-title {
	color: var(--cw-text-strong);
	line-height: 1.02;
}

/* Elementor button widgets carry .cw-btn on the widget wrapper, which used
   to paint the wrapper (green slab, invisible green label; doubled borders).
   The wrapper goes bare; the real <a> gets the Apparition pill. */
.elementor-widget-button.cw-btn,
.elementor-widget-button.cw-btn--solid {
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	min-height: 0 !important;
}

.elementor-widget-button.cw-btn .elementor-button {
	display: inline-flex;
	align-items: center;
	gap: 0.75em;
	min-height: 48px;
	padding: 0 1.4em;
	border: 1px solid var(--cw-hairline-strong);
	border-radius: 999px;
	background: rgba(4, 7, 10, 0.55);
	color: var(--cw-text-strong);
	font-family: var(--cw-font-mono);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: var(--cw-tracking-mono);
	text-transform: uppercase;
	transition: background var(--cw-dur) var(--cw-ease), color var(--cw-dur) var(--cw-ease), border-color var(--cw-dur) var(--cw-ease), box-shadow var(--cw-dur) var(--cw-ease);
}
.elementor-widget-button.cw-btn .elementor-button .elementor-button-text { color: inherit; }
/* Outline pill hover: stays dark glass and lights up, never fills lime. */
.elementor-widget-button.cw-btn:not(.cw-btn--solid) .elementor-button:hover,
.elementor-widget-button.cw-btn:not(.cw-btn--solid) .elementor-button:focus-visible {
	background: rgba(75, 255, 139, 0.10);
	color: var(--cw-accent-bright);
	border-color: var(--cw-accent);
	box-shadow: var(--cw-glow), inset 0 0 18px rgba(75, 255, 139, 0.08);
	text-shadow: 0 0 10px rgba(75, 255, 139, 0.45);
}
.elementor-widget-button.cw-btn--solid .elementor-button {
	background: var(--cw-accent);
	border-color: var(--cw-accent);
	color: var(--cw-void);
}
.elementor-widget-button.cw-btn--solid .elementor-button:hover,
.elementor-widget-button.cw-btn--solid .elementor-button:focus-visible {
	background: var(--cw-accent-bright);
	border-color: var(--cw-accent-bright);
	color: var(--cw-void);
}

/* Status lines are machine voices. */
body .cw-404__code .elementor-heading-title {
	font-family: var(--cw-font-mono);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cw-accent);
}

/* --- Brand mark ------------------------------------------------------------
   The wordmark is cut tight and transparent (inc/brand.php), so it can be
   shown at a height where the letters actually read. Three places only:
   header, footer signature, and the sign-off at the end of every post. */

:root { --cw-header-h: 84px; }

.cw-header__logo .elementor-widget-container,
.cw-header__logo a { display: inline-block; line-height: 0; }

body .cw-header__logo img {
	width: auto !important;
	height: 60px !important;
	max-height: none !important;
	max-width: none !important;
	filter: drop-shadow(0 0 0 rgba(75, 255, 139, 0));
	transition: height var(--cw-dur) var(--cw-ease), filter var(--cw-dur-slow) var(--cw-ease);
}
body .cw-header__logo a:hover img,
body .cw-header__logo a:focus-visible img {
	filter: drop-shadow(0 0 14px rgba(75, 255, 139, 0.45));
}
body .cw-header.is-scrolled .cw-header__logo img { height: 46px !important; }

@media (max-width: 767px) {
	:root { --cw-header-h: 64px; }
	body .cw-header__logo img { height: 42px !important; }
	body .cw-header.is-scrolled .cw-header__logo img { height: 38px !important; }
}

/* Footer signature. */
.cw-logo { display: inline-block; line-height: 0; }
.cw-footer__mark { margin: -0.75rem 0 0.5rem -0.75rem; }
.cw-footer__mark .cw-logo__img {
	width: min(100%, 360px);
	height: auto;
	transition: filter var(--cw-dur-slow) var(--cw-ease);
}
.cw-footer__mark a:hover .cw-logo__img,
.cw-footer__mark a:focus-visible .cw-logo__img {
	filter: drop-shadow(0 0 18px rgba(75, 255, 139, 0.4));
}

/* Post sign-off: the mark above the end line. */
.cw-single__body .elementor-widget-theme-post-content .elementor-widget-container::after {
	content: 'End of transmission';
	text-align: center;
	padding-top: calc(1.6rem + 58px);
	background: var(--cw-logo-mark, none) center 1.5rem / auto 50px no-repeat;
}
/* One header row at every width: logo left, menu and search right. */
body .cw-header__inner > .e-con-inner,
body .cw-header__inner.e-con-full { flex-wrap: nowrap !important; align-items: center !important; }
body .cw-header__right {
	width: auto !important;
	flex: 0 0 auto !important;
	margin-left: auto;
}

/* --- Labels over imagery --------------------------------------------------
   Elementor's card badge shipped white on mint. Anything that sits on top of
   art is dark glass with accent type, so it reads over any pixel. */

body .cw-archive-grid .elementor-post__card .elementor-post__badge,
body .elementor-post__badge {
	z-index: 4;
	margin: 14px !important;
	padding: 0.35em 0.85em !important;
	background: rgba(4, 7, 10, 0.72) !important;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 1px solid var(--cw-hairline-strong);
	border-radius: 999px !important;
	color: var(--cw-accent-bright) !important;
	font-family: var(--cw-font-mono) !important;
	font-size: 0.6875rem !important;
	font-weight: 500 !important;
	letter-spacing: var(--cw-tracking-mono) !important;
	text-transform: uppercase;
	line-height: 1.4 !important;
	text-shadow: 0 0 10px rgba(75, 255, 139, 0.35);
	box-shadow: 0 2px 14px rgba(0, 0, 0, 0.5);
}

.cw-card__media .cw-chip {
	background: rgba(4, 7, 10, 0.72);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-color: var(--cw-hairline-strong);
	color: var(--cw-accent-bright);
}

/* --- Scroll to top --------------------------------------------------------
   Astra's lime square becomes a small dark-glass beacon. */

body #ast-scroll-top {
	width: 46px;
	height: 46px;
	padding: 0;
	display: none;
	align-items: center;
	justify-content: center;
	right: clamp(16px, 2.5vw, 32px) !important;
	bottom: clamp(16px, 2.5vw, 32px) !important;
	background: rgba(4, 7, 10, 0.72) !important;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid var(--cw-hairline-strong) !important;
	border-radius: 50% !important;
	color: var(--cw-accent) !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.55);
	transition: color var(--cw-dur) var(--cw-ease), border-color var(--cw-dur) var(--cw-ease), box-shadow var(--cw-dur) var(--cw-ease), background var(--cw-dur) var(--cw-ease);
}
body #ast-scroll-top[style*="block"] { display: flex !important; }
body #ast-scroll-top .ast-icon,
body #ast-scroll-top svg {
	width: 14px;
	height: 14px;
	fill: currentColor !important;
	color: inherit !important;
}
body #ast-scroll-top:hover,
body #ast-scroll-top:focus-visible {
	background: rgba(75, 255, 139, 0.12) !important;
	border-color: var(--cw-accent) !important;
	color: var(--cw-accent-bright) !important;
	box-shadow: var(--cw-glow), 0 6px 24px rgba(0, 0, 0, 0.55);
}
/* --- Portrait pages (About, 404) -------------------------------------------
   Elementor collapses the portrait's widget box in the stacked mobile layout
   (about 3px tall), so the copy slid up over the art. The box now always
   takes the figure's height. On phones the portrait becomes a full-bleed
   poster: caption at the top, heading set on the faded foot of the image,
   body copy below on solid black. */

.cw-portrait,
.cw-404__portrait,
.e-con:has(> .elementor-widget-shortcode .cw-portrait-scene),
.e-con:has(> .e-con-inner > .elementor-widget-shortcode .cw-portrait-scene) {
	height: auto !important;
	min-height: 0 !important;
}
.elementor-widget-shortcode:has(.cw-portrait-scene) {
	height: auto !important;
	flex: 0 0 auto !important;
	width: 100%;
}

@media (max-width: 767px) {
	.cw-portrait,
	.cw-404__portrait {
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		padding: 0 !important;
		flex: 0 0 auto !important;
	}
	.cw-portrait > .e-con-inner,
	.cw-404__portrait > .e-con-inner { padding: 0 !important; max-width: none !important; }

	.cw-portrait-scene {
		max-width: none;
		width: 100%;
		aspect-ratio: 4 / 5;
		max-height: 76svh;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		--cw-app-r: clamp(130px, 40vw, 210px);
		--cw-app-pad: 1.1rem;
	}
	.cw-portrait-scene img.cw-app__img { object-position: 50% 18%; }

	/* Caption moves to the top, under the corner brackets. */
	.cw-portrait-scene figcaption {
		top: 1.9rem;
		bottom: auto;
		left: 2.4rem;
		right: 2.4rem;
		line-height: 1.7;
	}
	.cw-portrait-scene .cw-app__corner--bl,
	.cw-portrait-scene .cw-app__corner--br { display: none; }

	/* The foot of the image fades into the page. */
	.cw-portrait-scene::after {
		z-index: 1;
		background: linear-gradient(0deg,
			var(--cw-void) 0%,
			rgba(4, 7, 10, 0.88) 16%,
			rgba(4, 7, 10, 0.35) 38%,
			transparent 56%);
	}

	/* The copy column rises onto that fade: eyebrow and heading overlap the
	   darkened foot, the body text lands below the image. */
	.cw-portrait + .e-con,
	.cw-404__portrait + .e-con {
		position: relative;
		z-index: 2;
		margin-top: -7.5rem !important;
	}
	.cw-portrait + .e-con .elementor-heading-title,
	.cw-404__portrait + .e-con .elementor-heading-title {
		text-shadow: 0 2px 24px rgba(4, 7, 10, 0.95);
	}
}
/* --- Header dropdowns ------------------------------------------------------
   chrome.css gives .elementor-nav-menu--dropdown a full-screen min-height for
   the mobile drawer, but Elementor puts that same class on every desktop
   sub-menu, so Archive dropped to the bottom of the screen. Sub-menus size
   to their items; the drawer itself keeps its full height. */

body .cw-header__nav .sub-menu {
	min-height: 0 !important;
	height: auto !important;
}

body .cw-header__nav .elementor-nav-menu--main .sub-menu {
	min-width: 220px !important;
	padding: 0.4rem 0 !important;
	background: rgba(6, 11, 12, 0.92) !important;
	-webkit-backdrop-filter: blur(14px) saturate(140%);
	backdrop-filter: blur(14px) saturate(140%);
	border: 1px solid var(--cw-hairline-strong);
	border-radius: var(--cw-radius-m);
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.65), var(--cw-glow-soft);
}
body .cw-header__nav .elementor-nav-menu--main .sub-menu a.elementor-sub-item {
	padding: 0.65rem 1.1rem !important;
	color: var(--cw-text-muted);
	background: transparent !important;
	border-left: 2px solid transparent;
}
body .cw-header__nav .elementor-nav-menu--main .sub-menu a.elementor-sub-item:hover,
body .cw-header__nav .elementor-nav-menu--main .sub-menu a.elementor-sub-item:focus-visible,
body .cw-header__nav .elementor-nav-menu--main .sub-menu a.elementor-sub-item.elementor-item-active {
	color: var(--cw-accent-bright) !important;
	background: rgba(75, 255, 139, 0.07) !important;
	border-left-color: var(--cw-accent);
}
/* --- Contact ---------------------------------------------------------------
   The form as a terminal: mono labels, dark glass fields that light up when
   focused, a solid "Transmit" pill. */

.cw-contact-body {
	width: 100%;
	max-width: 720px !important;
	margin-inline: auto !important;
	padding: var(--cw-space-2xl) var(--cw-space-m) var(--cw-space-xl) !important;
}

.cw-contact-form .elementor-form-fields-wrapper { row-gap: 1.25rem; }

.cw-contact-form .elementor-field-group > label,
.cw-contact-form .elementor-field-label {
	font-family: var(--cw-font-mono);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cw-accent);
	margin-bottom: 0.5rem;
}

.cw-contact-form .elementor-field-group .elementor-field:not(.elementor-select-wrapper),
.cw-contact-form .elementor-field-textual {
	background: rgba(4, 7, 10, 0.6) !important;
	border: 1px solid var(--cw-hairline-strong) !important;
	border-radius: var(--cw-radius-m) !important;
	color: var(--cw-text-strong) !important;
	font-family: var(--cw-font-body) !important;
	font-size: 1.0625rem !important;
	padding: 0.85rem 1rem !important;
	min-height: 52px;
	transition: border-color var(--cw-dur) var(--cw-ease), box-shadow var(--cw-dur) var(--cw-ease), background var(--cw-dur) var(--cw-ease);
}
.cw-contact-form textarea.elementor-field { min-height: 190px; line-height: 1.6; }
.cw-contact-form .elementor-field::placeholder {
	color: var(--cw-text-muted);
	opacity: 0.75;
	font-family: var(--cw-font-mono);
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
}
.cw-contact-form .elementor-field:focus {
	outline: none;
	background: rgba(75, 255, 139, 0.04) !important;
	border-color: var(--cw-accent) !important;
	box-shadow: var(--cw-glow), inset 0 0 18px rgba(75, 255, 139, 0.05);
}

.cw-contact-form .elementor-field-type-submit { margin-top: 0.5rem; }
.cw-contact-form .elementor-button[type="submit"] {
	min-height: 52px;
	padding: 0 2.2em !important;
	border: 1px solid var(--cw-accent) !important;
	border-radius: 999px !important;
	background: var(--cw-accent) !important;
	color: var(--cw-void) !important;
	font-family: var(--cw-font-mono) !important;
	font-size: 0.8125rem !important;
	font-weight: 500 !important;
	letter-spacing: var(--cw-tracking-mono) !important;
	text-transform: uppercase;
	transition: background var(--cw-dur) var(--cw-ease), box-shadow var(--cw-dur) var(--cw-ease);
}
.cw-contact-form .elementor-button[type="submit"]:hover,
.cw-contact-form .elementor-button[type="submit"]:focus-visible {
	background: var(--cw-accent-bright) !important;
	border-color: var(--cw-accent-bright) !important;
	box-shadow: var(--cw-glow);
}
.cw-contact-form .elementor-button[type="submit"] .elementor-button-text { color: inherit; }

/* Feedback lines read like a terminal response. */
.cw-contact-form .elementor-message {
	margin-top: 1.25rem;
	font-family: var(--cw-font-mono);
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
}
.cw-contact-form .elementor-message::before { content: '> '; }
.cw-contact-form .elementor-message.elementor-message-success { color: var(--cw-accent-bright); }
.cw-contact-form .elementor-message.elementor-message-danger,
.cw-contact-form .elementor-error .elementor-message,
.cw-contact-form .elementor-field-group .elementor-message { color: #FF8F8F; }
.cw-contact-form .elementor-error .elementor-field { border-color: rgba(255, 143, 143, 0.7) !important; }

.cw-contact-body .cw-contact-links { margin-top: var(--cw-space-l); }