/*
Theme Name: Celestial Wave
Theme URI: https://celestialwave.in/
Author: Celestial Wave
Author URI: https://celestialwave.in/
Description: A premium tarot and Vedic astrology platform. Ships the complete 78-card Celestial Wave deck with fifteen classical spreads, 36-point Ashtakoota kundali matching, a Vimshottari life road map, Chaldean numerology, name correction, Google sign-in with three free trials per service, membership and report billing through Razorpay, and WhatsApp booking for one-to-one sessions with the reader.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: celestial-wave
Tags: astrology, tarot, membership, one-column, custom-menu, custom-logo, featured-images, translation-ready

Celestial Wave is distributed under the GPL v2 or later.
The deck artwork bundled in assets/img/cards is the property of Celestial Wave.
*/

/* ==========================================================================
   Tokens
   Palette lifted from the deck itself: the card back's night medallion, the
   parchment of the title ribbons, the gilt of their edging, and the sea blue
   of the wave beneath the moon.
   ========================================================================== */

:root {
	--ink:            #10142b;
	--ink-deep:       #080b1b;
	--ink-soft:       #1b2142;
	--ink-line:       #2a3157;

	--parchment:      #f0e6d2;
	--parchment-warm: #e4d5b7;
	--parchment-dim:  #b9ad95;

	--gold:           #c8a44d;
	--gold-light:     #e8ce8a;
	--gold-deep:      #9c7c2e;

	--sea:            #2e5e7e;
	--sea-light:      #5b93b5;
	--rose:           #8c3b4a;
	--sage:           #6f8a6a;

	--display: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
	--body:    "Jost", "Avenir Next", "Segoe UI", system-ui, sans-serif;

	--step--1: clamp(0.78rem, 0.75rem + 0.15vw, 0.86rem);
	--step-0:  clamp(0.95rem, 0.92rem + 0.18vw, 1.05rem);
	--step-1:  clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
	--step-2:  clamp(1.5rem, 1.3rem + 1vw, 2.1rem);
	--step-3:  clamp(2rem, 1.6rem + 2vw, 3.2rem);
	--step-4:  clamp(2.6rem, 1.9rem + 3.4vw, 4.8rem);

	--gutter: clamp(1.15rem, 4vw, 3rem);
	--wrap:   1180px;
	--narrow: 780px;

	--radius:    4px;
	--radius-lg: 8px;

	--shadow-card: 0 18px 44px -18px rgba(4, 6, 18, 0.72);
	--shadow-lift: 0 26px 60px -24px rgba(4, 6, 18, 0.85);

	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ==========================================================================
   Reset
   ========================================================================== */

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

@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;
	}
}

body {
	margin: 0;
	background: var(--ink);
	color: var(--parchment);
	font-family: var(--body);
	font-size: var(--step-0);
	font-weight: 300;
	line-height: 1.65;
	letter-spacing: 0.005em;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4, h5 {
	font-family: var(--display);
	font-weight: 400;
	line-height: 1.08;
	letter-spacing: -0.012em;
	margin: 0 0 0.5em;
	color: var(--parchment);
}

h1 { font-size: var(--step-4); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--gold-light); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--parchment); }

:focus-visible {
	outline: 2px solid var(--gold-light);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Selection: a soft gold wash rather than a solid block, so selecting text
   never looks like a rendering fault. */
::selection {
	background: rgba(200, 164, 77, 0.3);
	color: inherit;
}

/* On the parchment and green panels a warmer, darker wash reads better. */
.cw-panel--parchment ::selection,
.cw-say--light ::selection,
.cw-say--green ::selection,
.cw-annual__table ::selection {
	background: rgba(156, 124, 46, 0.24);
	color: inherit;
}

hr {
	border: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ink-line) 20%, var(--gold-deep) 50%, var(--ink-line) 80%, transparent);
	margin: 3rem 0;
}

.cw-sr {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.cw-skip {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	background: var(--gold); color: var(--ink-deep);
	padding: 0.7rem 1.2rem; font-weight: 500;
}
.cw-skip:focus { left: 1rem; top: 1rem; }

/* ==========================================================================
   Layout
   ========================================================================== */

.cw-wrap {
	width: min(100% - (var(--gutter) * 2), var(--wrap));
	margin-inline: auto;
}

.cw-wrap--narrow { width: min(100% - (var(--gutter) * 2), var(--narrow)); }

.cw-section { padding-block: clamp(3.5rem, 8vw, 7rem); }
.cw-section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }

.cw-section--veil {
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(46, 94, 126, 0.22), transparent 62%),
		var(--ink-deep);
	border-block: 1px solid var(--ink-line);
}

.cw-grid { display: grid; gap: clamp(1.25rem, 3vw, 2.25rem); }
.cw-grid--2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.cw-grid--3 { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.cw-grid--4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* ==========================================================================
   The banner heading — echoes the ribbon on every card face
   ========================================================================== */

.cw-banner { margin-bottom: clamp(2rem, 4vw, 3.25rem); max-width: 62ch; }
.cw-banner--center { margin-inline: auto; text-align: center; }

.cw-banner__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	font-size: var(--step--1);
	font-weight: 400;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 1rem;
}

.cw-banner__eyebrow::before {
	content: "";
	width: 2.2rem; height: 1px;
	background: linear-gradient(90deg, transparent, var(--gold));
}

.cw-banner--center .cw-banner__eyebrow::after {
	content: "";
	width: 2.2rem; height: 1px;
	background: linear-gradient(90deg, var(--gold), transparent);
}

.cw-banner__title { margin-bottom: 0.45em; }
.cw-banner__title em { font-style: italic; color: var(--gold-light); }

.cw-banner__lede {
	font-size: var(--step-1);
	font-weight: 200;
	color: var(--parchment-dim);
	line-height: 1.55;
	max-width: 56ch;
}

.cw-banner--center .cw-banner__lede { margin-inline: auto; }

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

.cw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	padding: 0.85rem 1.7rem;
	font-family: var(--body);
	font-size: var(--step--1);
	font-weight: 500;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	text-decoration: none;
	border: 1px solid transparent;
	border-radius: var(--radius);
	cursor: pointer;
	transition: transform 0.25s var(--ease), background 0.25s var(--ease),
	            color 0.25s var(--ease), border-color 0.25s var(--ease), box-shadow 0.25s var(--ease);
	background: none;
}

.cw-btn:hover { transform: translateY(-2px); }
.cw-btn:active { transform: translateY(0); }
.cw-btn:disabled, .cw-btn[aria-disabled="true"] { opacity: 0.45; pointer-events: none; }

.cw-btn--sm { padding: 0.6rem 1.15rem; font-size: 0.72rem; }
.cw-btn--lg { padding: 1.05rem 2.3rem; }
.cw-btn--block { width: 100%; }

.cw-btn--gold {
	background: linear-gradient(160deg, var(--gold-light), var(--gold) 55%, var(--gold-deep));
	color: var(--ink-deep);
	box-shadow: 0 12px 30px -14px rgba(200, 164, 77, 0.85);
}
.cw-btn--gold:hover {
	color: var(--ink-deep);
	box-shadow: 0 18px 40px -14px rgba(200, 164, 77, 0.95);
}

.cw-btn--ghost {
	border-color: var(--ink-line);
	color: var(--parchment);
	background: rgba(240, 230, 210, 0.03);
}
.cw-btn--ghost:hover { border-color: var(--gold); color: var(--gold-light); }

.cw-btn--google {
	background: var(--parchment);
	color: #2c2c2c;
	border-color: var(--parchment-warm);
	text-transform: none;
	letter-spacing: 0.02em;
	font-size: var(--step-0);
	font-weight: 400;
}
.cw-btn--google:hover { background: #fff; color: #1a1a1a; }

.cw-btn--whatsapp {
	background: #1faa54;
	color: #fff;
	text-transform: none;
	letter-spacing: 0.02em;
	font-size: var(--step-0);
}
.cw-btn--whatsapp:hover { background: #178f45; color: #fff; }

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

.cw-header {
	position: sticky; top: 0; z-index: 60;
	background: rgba(8, 11, 27, 0.82);
	backdrop-filter: saturate(160%) blur(14px);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid rgba(42, 49, 87, 0.7);
}

.cw-header__inner {
	display: flex; align-items: center; gap: 1.5rem;
	min-height: 74px;
}

.cw-brand {
	display: inline-flex; align-items: center; gap: 0.7rem;
	text-decoration: none; color: var(--parchment); flex-shrink: 0;
}

.cw-brand__mark { width: 34px; height: 34px; flex-shrink: 0; }

.cw-brand__text {
	font-family: var(--display);
	font-size: 1.32rem;
	letter-spacing: 0.03em;
	line-height: 1;
}
.cw-brand__text small {
	display: block;
	font-family: var(--body);
	font-size: 0.56rem;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	color: var(--gold);
	margin-top: 0.32rem;
}

.cw-nav { margin-left: auto; }

.cw-nav ul {
	display: flex; align-items: center; gap: 0.35rem;
	list-style: none; margin: 0; padding: 0;
}

.cw-nav a {
	display: block;
	padding: 0.5rem 0.85rem;
	font-size: 0.82rem;
	font-weight: 400;
	letter-spacing: 0.04em;
	color: var(--parchment-dim);
	text-decoration: none;
	border-radius: var(--radius);
	transition: color 0.2s var(--ease), background 0.2s var(--ease);
}
.cw-nav a:hover,
.cw-nav .current-menu-item > a {
	color: var(--gold-light);
	background: rgba(200, 164, 77, 0.08);
}

.cw-header__actions { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }

.cw-avatar {
	width: 34px; height: 34px; border-radius: 50%;
	border: 1px solid var(--gold-deep); object-fit: cover;
}

.cw-burger {
	display: none;
	width: 42px; height: 42px;
	border: 1px solid var(--ink-line);
	background: none; border-radius: var(--radius);
	cursor: pointer; padding: 0;
	align-items: center; justify-content: center;
	color: var(--parchment);
}
.cw-burger span, .cw-burger span::before, .cw-burger span::after {
	content: ""; display: block;
	width: 17px; height: 1.4px;
	background: currentColor;
	transition: transform 0.3s var(--ease), opacity 0.2s var(--ease);
}
.cw-burger span::before { transform: translateY(-5.5px); }
.cw-burger span::after  { transform: translateY(4.1px); }
.cw-burger[aria-expanded="true"] span { background: transparent; }
.cw-burger[aria-expanded="true"] span::before { transform: rotate(45deg); }
.cw-burger[aria-expanded="true"] span::after  { transform: rotate(-45deg) translateY(0); }

@media (max-width: 1020px) {
	.cw-burger { display: inline-flex; margin-left: auto; }
	.cw-nav {
		position: fixed; inset: 74px 0 auto 0;
		background: var(--ink-deep);
		border-bottom: 1px solid var(--ink-line);
		padding: 1rem var(--gutter) 1.75rem;
		margin: 0;
		display: none;
		max-height: calc(100dvh - 74px);
		overflow-y: auto;
	}
	.cw-nav.is-open { display: block; }
	.cw-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
	.cw-nav a { padding: 0.9rem 0.5rem; border-bottom: 1px solid rgba(42, 49, 87, 0.5); border-radius: 0; }
	.cw-header__actions .cw-btn span { display: none; }
	.cw-header__actions .cw-btn--google { padding: 0.6rem 0.8rem; }
}

/* ==========================================================================
   Hero — the signature moment
   ========================================================================== */

.cw-hero {
	position: relative;
	padding-block: clamp(3.5rem, 9vw, 7rem) clamp(3.5rem, 8vw, 6rem);
	overflow: hidden;
	background:
		radial-gradient(80% 60% at 78% 18%, rgba(46, 94, 126, 0.34), transparent 60%),
		radial-gradient(70% 55% at 12% 82%, rgba(140, 59, 74, 0.16), transparent 62%),
		linear-gradient(178deg, var(--ink-deep), var(--ink) 55%, var(--ink-soft));
}

.cw-stars {
	position: absolute; inset: 0;
	pointer-events: none;
	opacity: 0.5;
}

.cw-stars i {
	position: absolute;
	width: 2px; height: 2px;
	border-radius: 50%;
	background: var(--parchment);
	animation: cw-twinkle 5s ease-in-out infinite;
}

@keyframes cw-twinkle {
	0%, 100% { opacity: 0.14; transform: scale(0.7); }
	50%      { opacity: 0.9;  transform: scale(1.15); }
}

/* The slow wave beneath the moon on the card back. */
.cw-hero::after {
	content: "";
	position: absolute; left: -10%; right: -10%; bottom: -2px;
	height: 180px;
	background:
		radial-gradient(60% 100% at 20% 100%, rgba(46, 94, 126, 0.35), transparent 70%),
		radial-gradient(60% 100% at 70% 100%, rgba(91, 147, 181, 0.22), transparent 70%);
	animation: cw-swell 14s ease-in-out infinite alternate;
	pointer-events: none;
}

@keyframes cw-swell {
	from { transform: translateX(-3%) scaleY(1); }
	to   { transform: translateX(3%) scaleY(1.22); }
}

.cw-hero__inner {
	position: relative; z-index: 2;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: center;
}

@media (max-width: 900px) {
	.cw-hero__inner { grid-template-columns: 1fr; }
	.cw-hero__art { order: -1; }
}

.cw-hero h1 { margin-bottom: 0.35em; }
.cw-hero h1 em { font-style: italic; color: var(--gold-light); display: block; }

.cw-hero__lede {
	font-size: var(--step-1);
	font-weight: 200;
	color: var(--parchment-dim);
	max-width: 46ch;
	margin-bottom: 2rem;
}

.cw-hero__cta { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-bottom: 2rem; }

.cw-hero__meta {
	display: flex; flex-wrap: wrap; gap: 1.4rem 2.2rem;
	padding-top: 1.75rem;
	border-top: 1px solid var(--ink-line);
}

.cw-hero__meta div strong {
	display: block;
	font-family: var(--display);
	font-size: 1.75rem;
	color: var(--gold-light);
	line-height: 1;
	margin-bottom: 0.3rem;
}
.cw-hero__meta div span {
	font-size: 0.72rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--parchment-dim);
}

/* ---- The fanned, flipping deck --------------------------------------- */

.cw-fan {
	position: relative;
	height: clamp(340px, 46vw, 470px);
	display: flex; align-items: center; justify-content: center;
	perspective: 1400px;
}

.cw-fan__card {
	position: absolute;
	width: clamp(150px, 20vw, 208px);
	aspect-ratio: 618 / 1069;
	transform-style: preserve-3d;
	transition: transform 0.85s var(--ease);
	cursor: pointer;
	border: 0; padding: 0; background: none;
	animation: cw-deal 1s var(--ease) backwards;
}

@keyframes cw-deal {
	from { opacity: 0; transform: translateY(38px) rotate(0deg) scale(0.9); }
}

.cw-fan__card:nth-child(1) { transform: rotate(-17deg) translate(-102%, 12px); animation-delay: 0.05s; }
.cw-fan__card:nth-child(2) { transform: rotate(-8deg)  translate(-51%, -6px);  animation-delay: 0.15s; }
.cw-fan__card:nth-child(3) { transform: rotate(0deg)   translate(0, -18px); z-index: 3; animation-delay: 0.25s; }
.cw-fan__card:nth-child(4) { transform: rotate(8deg)   translate(51%, -6px);  animation-delay: 0.35s; }
.cw-fan__card:nth-child(5) { transform: rotate(17deg)  translate(102%, 12px); animation-delay: 0.45s; }

.cw-fan__card:hover  { filter: brightness(1.08); }
.cw-fan__card:nth-child(1):hover { transform: rotate(-17deg) translate(-102%, -6px) scale(1.04); }
.cw-fan__card:nth-child(2):hover { transform: rotate(-8deg)  translate(-51%, -24px) scale(1.04); }
.cw-fan__card:nth-child(3):hover { transform: rotate(0deg)   translate(0, -36px)    scale(1.04); }
.cw-fan__card:nth-child(4):hover { transform: rotate(8deg)   translate(51%, -24px)  scale(1.04); }
.cw-fan__card:nth-child(5):hover { transform: rotate(17deg)  translate(102%, -6px)  scale(1.04); }

.cw-fan__face {
	position: absolute; inset: 0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow-card);
	border: 1px solid rgba(200, 164, 77, 0.35);
	transition: transform 0.85s var(--ease);
}
.cw-fan__face img { width: 100%; height: 100%; object-fit: cover; }

.cw-fan__face--back  { transform: rotateY(0deg); }
.cw-fan__face--front { transform: rotateY(180deg); }

.cw-fan__card.is-flipped .cw-fan__face--back  { transform: rotateY(-180deg); }
.cw-fan__card.is-flipped .cw-fan__face--front { transform: rotateY(0deg); }

.cw-fan__hint {
	position: absolute; bottom: -0.5rem; left: 50%;
	transform: translateX(-50%);
	font-size: 0.68rem; letter-spacing: 0.22em; text-transform: uppercase;
	color: var(--parchment-dim);
	white-space: nowrap;
}

/* ==========================================================================
   Panels and cards
   ========================================================================== */

.cw-panel {
	background: linear-gradient(168deg, rgba(27, 33, 66, 0.92), rgba(8, 11, 27, 0.94));
	border: 1px solid var(--ink-line);
	border-radius: var(--radius-lg);
	padding: clamp(1.4rem, 3vw, 2.4rem);
	position: relative;
}

.cw-panel--gilt { border-color: rgba(200, 164, 77, 0.34); }

.cw-panel--parchment {
	background: linear-gradient(170deg, #f6efe0, var(--parchment) 60%, var(--parchment-warm));
	border-color: var(--parchment-warm);
	color: #2a2317;
}
.cw-panel--parchment h1, .cw-panel--parchment h2,
.cw-panel--parchment h3, .cw-panel--parchment h4 { color: #1d1810; }
.cw-panel--parchment a { color: var(--gold-deep); }

.cw-service {
	display: block;
	text-decoration: none;
	color: inherit;
	background: linear-gradient(168deg, rgba(27, 33, 66, 0.9), rgba(8, 11, 27, 0.92));
	border: 1px solid var(--ink-line);
	border-radius: var(--radius-lg);
	padding: clamp(1.4rem, 2.6vw, 2rem);
	transition: border-color 0.3s var(--ease), transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
	position: relative;
	overflow: hidden;
}

.cw-service::before {
	content: "";
	position: absolute; inset: 0 0 auto 0; height: 1px;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
	opacity: 0; transition: opacity 0.3s var(--ease);
}

.cw-service:hover {
	border-color: rgba(200, 164, 77, 0.45);
	transform: translateY(-4px);
	box-shadow: var(--shadow-lift);
	color: inherit;
}
.cw-service:hover::before { opacity: 1; }

.cw-service .cw-icon {
	width: 30px; height: 30px;
	color: var(--gold);
	margin-bottom: 1.1rem;
}

.cw-service h3 { font-size: var(--step-1); margin-bottom: 0.5rem; }
.cw-service p { color: var(--parchment-dim); font-size: 0.93rem; margin-bottom: 1rem; }

.cw-service__more {
	font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--gold);
	display: inline-flex; align-items: center; gap: 0.45rem;
}
.cw-service__more::after { content: "→"; transition: transform 0.25s var(--ease); }
.cw-service:hover .cw-service__more::after { transform: translateX(4px); }

.cw-service__free {
	position: absolute; top: 1.1rem; right: 1.1rem;
	font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--gold-light);
	border: 1px solid rgba(200, 164, 77, 0.4);
	border-radius: 100px;
	padding: 0.22rem 0.6rem;
}

/* ==========================================================================
   Forms
   ========================================================================== */

.cw-form { display: grid; gap: 1.5rem; }

.cw-fieldset {
	border: 1px solid var(--ink-line);
	border-radius: var(--radius-lg);
	padding: 1.5rem;
	margin: 0;
	display: grid; gap: 1.1rem;
}

.cw-fieldset legend {
	font-family: var(--display);
	font-size: var(--step-1);
	color: var(--gold-light);
	padding-inline: 0.6rem;
}

.cw-field { display: grid; gap: 0.42rem; }
.cw-field-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.1rem; }

.cw-field label {
	font-size: 0.72rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--parchment-dim);
	font-weight: 400;
}

.cw-field small { font-size: 0.76rem; color: rgba(185, 173, 149, 0.75); line-height: 1.45; }

.cw-field input,
.cw-field select,
.cw-field textarea {
	width: 100%;
	padding: 0.8rem 0.95rem;
	background: rgba(8, 11, 27, 0.7);
	border: 1px solid var(--ink-line);
	border-radius: var(--radius);
	color: var(--parchment);
	font-family: var(--body);
	font-size: var(--step-0);
	font-weight: 300;
	transition: border-color 0.2s var(--ease), background 0.2s var(--ease);
}

.cw-field input::placeholder, .cw-field textarea::placeholder { color: rgba(185, 173, 149, 0.42); }

.cw-field input:focus,
.cw-field select:focus,
.cw-field textarea:focus {
	outline: none;
	border-color: var(--gold);
	background: rgba(8, 11, 27, 0.95);
}

.cw-field textarea { resize: vertical; min-height: 110px; }

.cw-field select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23c8a44d' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 10px;
	padding-right: 2.4rem;
}

/* Date and time controls sit dark by default in most browsers. */
.cw-field input[type="date"]::-webkit-calendar-picker-indicator,
.cw-field input[type="time"]::-webkit-calendar-picker-indicator {
	filter: invert(78%) sepia(28%) saturate(560%) hue-rotate(3deg) brightness(92%);
	cursor: pointer;
}

/* Birthplace lookup feedback */

.cw-place-status {
	margin: 0.35rem 0 0;
	font-size: 0.8rem;
	line-height: 1.45;
	display: flex;
	align-items: flex-start;
	gap: 0.45rem;
}

.cw-place-status::before {
	content: "";
	width: 7px; height: 7px;
	border-radius: 50%;
	flex-shrink: 0;
	margin-top: 0.45em;
}

.cw-place-status.is-busy  { color: var(--parchment-dim); }
.cw-place-status.is-busy::before  { background: var(--sea-light); animation: cw-pulse 1s ease-in-out infinite; }

.cw-place-status.is-ok    { color: var(--sage); }
.cw-place-status.is-ok::before    { background: var(--sage); }

.cw-place-status.is-error { color: #d99aa6; }
.cw-place-status.is-error::before { background: var(--rose); }

@keyframes cw-pulse {
	0%, 100% { opacity: 0.3; }
	50%      { opacity: 1; }
}

.cw-manual summary {
	cursor: pointer;
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	color: var(--gold);
	padding: 0.5rem 0;
	list-style: none;
}.cw-manual summary::-webkit-details-marker { display: none; }
.cw-manual summary::before { content: "+ "; }
.cw-manual[open] summary::before { content: "− "; }
.cw-manual[open] { padding-bottom: 0.5rem; }

/* Spread picker */

.cw-choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.75rem; }

.cw-choice { position: relative; }
.cw-choice input { position: absolute; opacity: 0; pointer-events: none; }

.cw-choice span {
	display: block;
	padding: 0.95rem 1.05rem;
	border: 1px solid var(--ink-line);
	border-radius: var(--radius);
	cursor: pointer;
	transition: border-color 0.2s var(--ease), background 0.2s var(--ease);
	height: 100%;
}

.cw-choice span strong {
	display: block;
	font-family: var(--display);
	font-size: 1.16rem;
	font-weight: 500;
	color: var(--parchment);
	margin-bottom: 0.2rem;
}

.cw-choice span small {
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--parchment-dim);
}

.cw-choice input:checked + span {
	border-color: var(--gold);
	background: rgba(200, 164, 77, 0.1);
}
.cw-choice input:focus-visible + span { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.cw-choice span:hover { border-color: rgba(200, 164, 77, 0.5); }

/* ==========================================================================
   The trial meter
   ========================================================================== */

.cw-meter {
	display: flex; align-items: center; flex-wrap: wrap; gap: 0.9rem;
	padding: 0.95rem 1.25rem;
	border: 1px solid var(--ink-line);
	border-left: 3px solid var(--gold);
	border-radius: var(--radius);
	background: rgba(8, 11, 27, 0.55);
	margin-bottom: 1.75rem;
	font-size: 0.88rem;
}

.cw-meter p { margin: 0; color: var(--parchment-dim); }
.cw-meter p strong { color: var(--gold-light); font-weight: 500; }
.cw-meter .cw-btn { margin-left: auto; }

.cw-meter--member { border-left-color: var(--sage); }
.cw-meter--spent  { border-left-color: var(--rose); }
.cw-meter--guest  { border-left-color: var(--sea-light); }

.cw-meter__pips { display: inline-flex; gap: 5px; }
.cw-meter__pips i {
	width: 9px; height: 9px; border-radius: 50%;
	border: 1px solid var(--gold-deep);
}
.cw-meter__pips i.is-left { background: var(--gold); }
.cw-meter__pips i.is-used { background: transparent; opacity: 0.4; }

.cw-meter__dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--sage);
	box-shadow: 0 0 0 4px rgba(111, 138, 106, 0.2);
	flex-shrink: 0;
}
.cw-meter--guest .cw-meter__dot { background: var(--sea-light); box-shadow: 0 0 0 4px rgba(91, 147, 181, 0.2); }

/* ==========================================================================
   Result cards
   ========================================================================== */

.cw-spread {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(clamp(140px, 17vw, 185px), 1fr));
	gap: clamp(1rem, 2.5vw, 2rem);
	margin-block: 2rem;
}

.cw-card { margin: 0; display: grid; gap: 0.7rem; }

.cw-card__position {
	font-size: 0.66rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--gold);
	min-height: 2.2em;
	line-height: 1.35;
}

.cw-card__frame {
	position: relative;
	border-radius: var(--radius-lg);
	overflow: hidden;
	border: 1px solid rgba(200, 164, 77, 0.32);
	box-shadow: var(--shadow-card);
	aspect-ratio: 618 / 1069;
	background: var(--ink-deep);
}

.cw-card__frame img { width: 100%; height: 100%; object-fit: cover; }

.cw-card.is-reversed .cw-card__frame img { transform: rotate(180deg); }

.cw-card.is-reversed .cw-card__frame::after {
	content: "Reversed";
	position: absolute; top: 0.55rem; left: 0.55rem;
	font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase;
	background: rgba(140, 59, 74, 0.92); color: #fff;
	padding: 0.2rem 0.5rem; border-radius: 2px;
}

.cw-card__name {
	font-family: var(--display);
	font-size: 1.06rem;
	color: var(--parchment);
	line-height: 1.25;
}
.cw-card__name em { display: block; font-size: 0.74rem; font-family: var(--body); color: var(--rose); font-style: normal; letter-spacing: 0.1em; text-transform: uppercase; }

/* Detailed reading rows */

.cw-read { display: grid; gap: 1.75rem; }

.cw-read__row {
	display: grid;
	grid-template-columns: clamp(110px, 15vw, 155px) 1fr;
	gap: clamp(1.1rem, 3vw, 2rem);
	padding-bottom: 1.75rem;
	border-bottom: 1px solid var(--ink-line);
}
.cw-read__row:last-child { border-bottom: 0; padding-bottom: 0; }

@media (max-width: 560px) {
	.cw-read__row { grid-template-columns: 1fr; }
	.cw-read__row .cw-card { max-width: 190px; }
}

.cw-read__body h4 { margin-bottom: 0.35rem; }

.cw-read__pos {
	font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--gold); display: block; margin-bottom: 0.5rem;
}

.cw-read__meaning { color: var(--parchment); margin-bottom: 0.9rem; }

.cw-attrs { display: flex; flex-wrap: wrap; gap: 0.45rem; list-style: none; margin: 0; padding: 0; }

.cw-attrs li {
	font-size: 0.7rem;
	letter-spacing: 0.06em;
	padding: 0.28rem 0.7rem;
	border: 1px solid var(--ink-line);
	border-radius: 100px;
	color: var(--parchment-dim);
}
.cw-attrs li b { color: var(--gold); font-weight: 400; }

/* ==========================================================================
   Data tables and score displays
   ========================================================================== */

.cw-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }

.cw-table th, .cw-table td {
	text-align: left;
	padding: 0.85rem 0.9rem;
	border-bottom: 1px solid var(--ink-line);
	vertical-align: top;
}

.cw-table th {
	font-size: 0.68rem; letter-spacing: 0.15em; text-transform: uppercase;
	color: var(--gold); font-weight: 500;
}

.cw-table tbody tr:hover { background: rgba(200, 164, 77, 0.04); }
.cw-table td small { display: block; color: var(--parchment-dim); font-size: 0.79rem; margin-top: 0.25rem; line-height: 1.5; }

.cw-table__num { font-family: var(--display); font-size: 1.25rem; color: var(--gold-light); white-space: nowrap; }

.cw-bar { height: 4px; background: var(--ink-line); border-radius: 2px; overflow: hidden; margin-top: 0.5rem; max-width: 130px; }
.cw-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--gold-deep), var(--gold-light)); }

.cw-score {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: center;
}

@media (max-width: 620px) { .cw-score { grid-template-columns: 1fr; text-align: center; } }

.cw-dial {
	position: relative;
	width: clamp(150px, 22vw, 200px);
	aspect-ratio: 1;
	display: grid; place-items: center;
	margin-inline: auto;
}
.cw-dial svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.cw-dial__track { fill: none; stroke: var(--ink-line); stroke-width: 6; }
.cw-dial__fill {
	fill: none; stroke: url(#cw-dial-grad); stroke-width: 6; stroke-linecap: round;
	transition: stroke-dashoffset 1.4s var(--ease);
}
.cw-dial__value { position: relative; text-align: center; }
.cw-dial__value b {
	display: block;
	font-family: var(--display);
	font-size: clamp(2.4rem, 6vw, 3.4rem);
	color: var(--gold-light);
	line-height: 1;
}
.cw-dial__suffix {
	font-size: 0.38em;
	font-style: normal;
	color: var(--parchment-dim);
	letter-spacing: 0.02em;
}
.cw-dial__value span {
	font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--parchment-dim);
}

.cw-verdict { display: inline-block; padding: 0.32rem 0.9rem; border-radius: 100px; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 0.9rem; }
.cw-verdict.is-excellent { background: rgba(111, 138, 106, 0.18); color: #a8c4a2; border: 1px solid rgba(111, 138, 106, 0.5); }
.cw-verdict.is-good      { background: rgba(200, 164, 77, 0.14); color: var(--gold-light); border: 1px solid rgba(200, 164, 77, 0.45); }
.cw-verdict.is-caution   { background: rgba(140, 59, 74, 0.18); color: #d99aa6; border: 1px solid rgba(140, 59, 74, 0.55); }

/* Chart summary tiles */

.cw-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; background: var(--ink-line); border: 1px solid var(--ink-line); border-radius: var(--radius-lg); overflow: hidden; }

.cw-tile { background: var(--ink-deep); padding: 1.15rem 1.25rem; }
.cw-tile span { display: block; font-size: 0.63rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--parchment-dim); margin-bottom: 0.45rem; }
.cw-tile strong { font-family: var(--display); font-size: 1.35rem; font-weight: 500; color: var(--gold-light); line-height: 1.15; display: block; }
.cw-tile small { display: block; font-size: 0.76rem; color: var(--parchment-dim); margin-top: 0.25rem; }

/* Lo Shu grid */

.cw-loshu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; max-width: 300px; }

.cw-loshu div {
	aspect-ratio: 1;
	display: grid; place-items: center;
	border: 1px solid var(--ink-line);
	border-radius: var(--radius);
	font-family: var(--display);
	font-size: 1.3rem;
	color: var(--parchment-dim);
	background: rgba(8, 11, 27, 0.6);
}
.cw-loshu div.is-present { border-color: var(--gold); color: var(--gold-light); background: rgba(200, 164, 77, 0.09); }
.cw-loshu div.is-missing { opacity: 0.35; }

/* Timeline */

.cw-timeline { display: grid; gap: 0; border-left: 1px solid var(--ink-line); margin-left: 0.5rem; padding-left: 0; }

.cw-timeline__item { position: relative; padding: 0 0 2rem 1.85rem; }
.cw-timeline__item::before {
	content: ""; position: absolute; left: -5px; top: 0.5rem;
	width: 9px; height: 9px; border-radius: 50%;
	background: var(--ink); border: 1px solid var(--gold-deep);
}
.cw-timeline__item.is-current::before { background: var(--gold); box-shadow: 0 0 0 4px rgba(200, 164, 77, 0.22); }
.cw-timeline__item.is-past { opacity: 0.5; }

.cw-timeline__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem 1rem; margin-bottom: 0.5rem; }
.cw-timeline__head h4 { margin: 0; font-size: var(--step-1); }
.cw-timeline__head span { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--parchment-dim); }
.cw-timeline__now { background: var(--gold); color: var(--ink-deep); padding: 0.15rem 0.55rem; border-radius: 100px; font-size: 0.6rem; letter-spacing: 0.14em; text-transform: uppercase; }

.cw-timeline__item p { color: var(--parchment-dim); font-size: 0.92rem; }

/* Year strip */

.cw-years { display: grid; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 1rem; }

.cw-year { border: 1px solid var(--ink-line); border-radius: var(--radius-lg); padding: 1.1rem; display: grid; gap: 0.55rem; }
.cw-year.is-now { border-color: var(--gold); background: rgba(200, 164, 77, 0.07); }
.cw-year b { font-family: var(--display); font-size: 1.5rem; color: var(--gold-light); line-height: 1; }
.cw-year span { font-size: 0.65rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--parchment-dim); }
.cw-year p { font-size: 0.83rem; color: var(--parchment-dim); margin: 0; }
.cw-year img { width: 46px; border-radius: 3px; border: 1px solid rgba(200, 164, 77, 0.3); }

/* ==========================================================================
   Testimonials — messages as they arrived
   ========================================================================== */

.cw-says {
	columns: 3;
	column-gap: clamp(0.9rem, 2vw, 1.4rem);
}

@media (max-width: 1000px) { .cw-says { columns: 2; } }
@media (max-width: 620px)  { .cw-says { columns: 1; } }

.cw-say {
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	display: block;
	margin: 0 0 clamp(0.9rem, 2vw, 1.4rem);
	padding: 0.95rem 1.1rem 0.7rem;
	border-radius: 14px;
	position: relative;
	border: 1px solid transparent;
	transition: transform 0.3s var(--ease);
}

.cw-say:hover { transform: translateY(-3px); }

/* Three bubble tones, echoing a WhatsApp thread without leaving the palette. */
.cw-say--dark {
	background: linear-gradient(168deg, #141a38, #0c1027);
	border-color: rgba(42, 49, 87, 0.9);
	color: var(--parchment);
}

.cw-say--light {
	background: linear-gradient(168deg, #f7f2e6, #ece3d0);
	border-color: #ddd2ba;
	color: #241f16;
}

.cw-say--green {
	background: linear-gradient(168deg, #dcf0d2, #cbe8bd);
	border-color: #b6d7a6;
	color: #1e2a17;
}

.cw-say__who {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 0.6rem;
}

.cw-say__avatar {
	width: 30px; height: 30px;
	flex-shrink: 0;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-family: var(--body);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.cw-say--dark .cw-say__avatar {
	background: rgba(200, 164, 77, 0.16);
	border: 1px solid rgba(200, 164, 77, 0.45);
	color: var(--gold-light);
}
.cw-say--light .cw-say__avatar,
.cw-say--green .cw-say__avatar {
	background: rgba(28, 24, 16, 0.08);
	border: 1px solid rgba(28, 24, 16, 0.18);
	color: #4a4031;
}

.cw-say__who strong {
	display: block;
	font-family: var(--body);
	font-size: 0.83rem;
	font-weight: 600;
	line-height: 1.2;
}
.cw-say--dark .cw-say__who strong { color: var(--gold-light); }

.cw-say__who small {
	display: block;
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	opacity: 0.62;
	margin-top: 0.1rem;
}

.cw-say blockquote {
	margin: 0;
	font-size: 0.86rem;
	line-height: 1.55;
	font-weight: 300;
}
.cw-say--light blockquote,
.cw-say--green blockquote { font-weight: 400; }

.cw-say__time {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.3rem;
	margin-top: 0.45rem;
	font-size: 0.63rem;
	letter-spacing: 0.04em;
	opacity: 0.5;
}

/* The double tick, the way a delivered message reads. */
.cw-say__time svg { color: #4a9de0; opacity: 0.85; }
.cw-say--dark .cw-say__time svg { color: var(--sea-light); }

.cw-says__foot { margin-top: clamp(1.5rem, 3vw, 2.25rem); text-align: center; }

/* ==========================================================================
   Annual plan — the headline offer
   ========================================================================== */

.cw-annual {
	position: relative;
	margin-bottom: clamp(3rem, 6vw, 4.5rem);
	border: 1px solid var(--gold);
	border-radius: var(--radius-lg);
	background:
		radial-gradient(90% 120% at 88% 0%, rgba(200, 164, 77, 0.16), transparent 62%),
		radial-gradient(80% 110% at 8% 100%, rgba(46, 94, 126, 0.24), transparent 60%),
		linear-gradient(165deg, var(--ink-soft), var(--ink-deep) 70%);
	box-shadow: 0 0 0 1px rgba(200, 164, 77, 0.18), var(--shadow-lift);
	overflow: hidden;
}

/* A slow gilt sweep across the top edge, so the eye lands here first. */
.cw-annual::before {
	content: "";
	position: absolute; inset: 0 0 auto 0; height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold-light) 50%, transparent);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	animation: cw-sweep 6s ease-in-out infinite;
}

@keyframes cw-sweep {
	0%   { background-position: -60% 0; }
	60%  { background-position: 160% 0; }
	100% { background-position: 160% 0; }
}

/* The condensed variant used outside the pricing page. */
.cw-annual--compact { margin-bottom: 0; }
.cw-annual--compact .cw-annual__buy-wrap { position: static; }
.cw-annual--compact .cw-annual__list { margin-bottom: 0.25rem; }

/* Embedded inside an existing section, above the per-session rates. */
.cw-annual--inline { margin-bottom: clamp(2.25rem, 5vw, 3.25rem); }

.cw-sessions__heading {
	display: flex;
	align-items: center;
	gap: 1rem;
	font-family: var(--body);
	font-size: 0.7rem;
	font-weight: 400;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--parchment-dim);
	margin-bottom: 1.5rem;
}

.cw-sessions__heading::after {
	content: "";
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, var(--ink-line), transparent);
}

.cw-annual__flag {
	display: inline-block;
	margin: 0 0 0 clamp(1.4rem, 3vw, 2.6rem);
	padding: 0.4rem 1.1rem;
	background: linear-gradient(160deg, var(--gold-light), var(--gold) 60%, var(--gold-deep));
	color: var(--ink-deep);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	border-radius: 0 0 4px 4px;
}

.cw-annual__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
	gap: clamp(1.75rem, 4vw, 3.5rem);
	padding: clamp(1.4rem, 3vw, 2.4rem) clamp(1.4rem, 3vw, 2.6rem) clamp(1.75rem, 3.5vw, 2.8rem);
	align-items: start;
}

/* The price column follows the page rather than floating in dead space. */
.cw-annual__buy-wrap { position: sticky; top: 96px; }

@media (max-width: 860px) {
	.cw-annual__buy-wrap { position: static; }
}

@media (max-width: 860px) {
	.cw-annual__inner { grid-template-columns: 1fr; }
}

.cw-annual__lead h2 {
	font-size: clamp(1.85rem, 3.6vw, 2.8rem);
	margin-bottom: 0.5em;
}
.cw-annual__lead h2 em { font-style: italic; color: var(--gold-light); }

.cw-annual__lead > p {
	color: var(--parchment-dim);
	max-width: 52ch;
	margin-bottom: 1.5rem;
}

.cw-annual__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 0.65rem 1.5rem;
}

.cw-annual__list li {
	position: relative;
	padding-left: 1.6rem;
	font-size: 0.9rem;
	color: var(--parchment);
	line-height: 1.5;
}

.cw-annual__list li::before {
	content: "";
	position: absolute;
	left: 0; top: 0.5em;
	width: 8px; height: 8px;
	border: 1px solid var(--gold);
	background: rgba(200, 164, 77, 0.35);
	transform: rotate(45deg);
}

.cw-annual__buy {
	border: 1px solid rgba(200, 164, 77, 0.32);
	border-radius: var(--radius-lg);
	background: rgba(8, 11, 27, 0.55);
	padding: clamp(1.4rem, 3vw, 2rem);
	text-align: center;
}

/* Service breakdown inside the annual panel */

.cw-annual__subhead {
	display: block;
	font-size: 0.66rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 1.1rem;
	padding-top: 1.6rem;
	border-top: 1px solid var(--ink-line);
}

.cw-annual__services { margin-top: 1.9rem; }

.cw-annual__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
	gap: 1.1rem 1.75rem;
}

.cw-annual__service { display: flex; gap: 0.85rem; align-items: flex-start; }

.cw-annual__service .cw-icon {
	width: 22px; height: 22px;
	color: var(--gold);
	flex-shrink: 0;
	margin-top: 0.15rem;
}

.cw-annual__service strong {
	font-family: var(--display);
	font-size: 1.08rem;
	font-weight: 500;
	color: var(--parchment);
	margin-right: 0.45rem;
}

.cw-annual__service p {
	margin: 0.25rem 0 0;
	font-size: 0.83rem;
	line-height: 1.5;
	color: var(--parchment-dim);
}

.cw-annual__tag {
	display: inline-block;
	padding: 0.12rem 0.5rem;
	border: 1px solid rgba(200, 164, 77, 0.45);
	border-radius: 100px;
	font-size: 0.58rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gold-light);
	vertical-align: 0.15em;
}

/* The arithmetic table */

.cw-annual__maths { margin-top: 1.9rem; }

.cw-annual__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.87rem;
}

.cw-annual__table td {
	padding: 0.72rem 0.5rem;
	border-bottom: 1px solid var(--ink-line);
	color: var(--parchment-dim);
	vertical-align: middle;
}

.cw-annual__table td:first-child { padding-left: 0; }

.cw-annual__table td:nth-child(2) {
	text-align: right;
	white-space: nowrap;
	font-size: 0.8rem;
	opacity: 0.75;
}

.cw-annual__table td:last-child {
	text-align: right;
	padding-right: 0;
	white-space: nowrap;
	font-family: var(--display);
	font-size: 1.2rem;
	color: var(--parchment);
}

.cw-annual__table-total td {
	border-bottom: 0;
	border-top: 1px solid rgba(200, 164, 77, 0.4);
	color: var(--parchment);
	font-weight: 500;
}

.cw-annual__table-total td:last-child {
	color: var(--gold-light);
	font-size: 1.5rem;
}

.cw-annual__footnote {
	margin: 0.9rem 0 0;
	font-size: 0.78rem;
	line-height: 1.55;
	color: rgba(185, 173, 149, 0.75);
}

@media (max-width: 520px) {
	.cw-annual__table td:nth-child(2) { display: none; }
}

.cw-annual__save {
	display: inline-block;
	margin-bottom: 0.85rem;
	padding: 0.32rem 0.85rem;
	background: var(--rose);
	color: #fff;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	border-radius: 100px;
}

.cw-annual__was {
	margin: 0 0 0.3rem;
	font-size: 0.95rem;
	color: var(--parchment-dim);
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 0.45rem;
}

.cw-annual__was s {
	font-family: var(--display);
	font-size: 1.55rem;
	text-decoration: none;
	position: relative;
	opacity: 0.75;
}

/* A drawn rule rather than a text-decoration line, so it sits mid-glyph
   on the display face instead of clipping the numerals. */
.cw-annual__was s::after {
	content: "";
	position: absolute;
	left: -4%; right: -4%; top: 52%;
	height: 1.5px;
	background: var(--rose);
	transform: rotate(-6deg);
}

.cw-annual__was span {
	font-size: 0.66rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.cw-annual__saving {
	margin: -0.35rem 0 1rem;
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: var(--sage);
}

.cw-annual__price {
	font-family: var(--display);
	font-size: clamp(2.8rem, 6.5vw, 4rem);
	line-height: 1;
	color: var(--gold-light);
	margin-bottom: 1rem;
}
.cw-annual__price sup { font-size: 0.4em; vertical-align: super; margin-right: 0.06em; }
.cw-annual__price small {
	display: block;
	margin-top: 0.7rem;
	font-family: var(--body);
	font-size: 0.68rem;
	font-weight: 400;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--parchment-dim);
}

.cw-annual__compare {
	font-size: 0.84rem;
	color: var(--parchment-dim);
	line-height: 1.5;
	margin-bottom: 1.25rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--ink-line);
}

.cw-annual__buy .cw-btn + .cw-btn { margin-top: 0.7rem; }

.cw-annual__note {
	font-size: 0.76rem;
	color: rgba(185, 173, 149, 0.75);
	line-height: 1.5;
	margin: 0.9rem 0 0;
}

.cw-plans__heading {
	font-size: var(--step-2);
	margin-bottom: 1.5rem;
	padding-top: 0.5rem;
}


/* Annual plan pointer, used on the readings page */

.cw-annual-strip {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.25rem 2rem;
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
	padding: clamp(1.25rem, 3vw, 1.9rem);
	border: 1px solid var(--gold);
	border-radius: var(--radius-lg);
	background:
		radial-gradient(80% 140% at 90% 0%, rgba(200, 164, 77, 0.14), transparent 62%),
		linear-gradient(165deg, var(--ink-soft), var(--ink-deep));
}

.cw-annual-strip > div { flex: 1 1 320px; }

.cw-annual-strip__flag {
	display: inline-block;
	margin-bottom: 0.6rem;
	padding: 0.24rem 0.7rem;
	background: var(--gold);
	color: var(--ink-deep);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	border-radius: 100px;
}

.cw-annual-strip h3 { font-size: var(--step-1); margin-bottom: 0.4rem; }
.cw-annual-strip p { color: var(--parchment-dim); font-size: 0.9rem; margin: 0; max-width: 60ch; }

/* ==========================================================================
   Pricing
   ========================================================================== */

.cw-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(265px, 1fr)); gap: 1.5rem; align-items: start; }

.cw-plan {
	border: 1px solid var(--ink-line);
	border-radius: var(--radius-lg);
	padding: clamp(1.5rem, 3vw, 2.2rem);
	display: grid; gap: 1.1rem;
	background: linear-gradient(168deg, rgba(27, 33, 66, 0.85), rgba(8, 11, 27, 0.92));
	position: relative;
}

.cw-plan--featured {
	border-color: var(--gold);
	box-shadow: 0 0 0 1px rgba(200, 164, 77, 0.25), var(--shadow-lift);
}

.cw-plan__flag {
	position: absolute; top: -1px; right: 1.5rem;
	background: var(--gold); color: var(--ink-deep);
	font-size: 0.6rem; letter-spacing: 0.16em; text-transform: uppercase;
	padding: 0.28rem 0.7rem; border-radius: 0 0 3px 3px;
}

.cw-plan h3 { margin: 0; font-size: var(--step-1); }

.cw-plan__price { font-family: var(--display); font-size: clamp(2.4rem, 5vw, 3.2rem); color: var(--gold-light); line-height: 1; }
.cw-plan__price sup { font-size: 0.42em; vertical-align: super; margin-right: 0.1em; }
.cw-plan__price small { font-family: var(--body); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--parchment-dim); display: block; margin-top: 0.5rem; }

.cw-plan ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cw-plan li { font-size: 0.88rem; color: var(--parchment-dim); padding-left: 1.4rem; position: relative; }
.cw-plan li::before { content: "◆"; position: absolute; left: 0; color: var(--gold); font-size: 0.6rem; top: 0.35em; }

/* Session cards */

.cw-sessions { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.25rem; }

.cw-session { border: 1px solid var(--ink-line); border-radius: var(--radius-lg); padding: 1.6rem; display: grid; gap: 0.85rem; text-align: center; transition: border-color 0.3s var(--ease), transform 0.3s var(--ease); }
.cw-session:hover { border-color: var(--gold); transform: translateY(-3px); }
.cw-session b { font-family: var(--display); font-size: 2.4rem; color: var(--gold-light); line-height: 1; }
.cw-session b sup { font-size: 0.4em; vertical-align: super; }
.cw-session span { font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); }
.cw-session p { font-size: 0.86rem; color: var(--parchment-dim); margin: 0; }

/* ==========================================================================
   Notices, loaders, modal
   ========================================================================== */

.cw-note {
	display: block;
	padding: 0.9rem 1.15rem;
	border-radius: var(--radius);
	border-left: 3px solid var(--sea-light);
	background: rgba(46, 94, 126, 0.14);
	font-size: 0.88rem;
	color: var(--parchment);
	margin-block: 1rem;
}
.cw-note--warn  { border-left-color: var(--gold); background: rgba(200, 164, 77, 0.12); }
.cw-note--error { border-left-color: var(--rose); background: rgba(140, 59, 74, 0.16); }
.cw-note--ok    { border-left-color: var(--sage); background: rgba(111, 138, 106, 0.14); }

.cw-loading { display: grid; place-items: center; gap: 1.2rem; padding: 3.5rem 1rem; text-align: center; }

.cw-loading__orbit { position: relative; width: 58px; height: 58px; }
.cw-loading__orbit::before,
.cw-loading__orbit::after {
	content: ""; position: absolute; inset: 0;
	border: 1px solid transparent;
	border-top-color: var(--gold);
	border-radius: 50%;
	animation: cw-spin 1.4s linear infinite;
}
.cw-loading__orbit::after { inset: 11px; border-top-color: var(--sea-light); animation-duration: 0.95s; animation-direction: reverse; }

@keyframes cw-spin { to { transform: rotate(360deg); } }

.cw-loading p { font-size: 0.78rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--parchment-dim); margin: 0; }

[hidden] { display: none !important; }

.cw-result { animation: cw-rise 0.7s var(--ease) both; }
@keyframes cw-rise { from { opacity: 0; transform: translateY(22px); } }

/* Modal */

.cw-modal {
	position: fixed; inset: 0; z-index: 200;
	display: grid; place-items: center;
	padding: var(--gutter);
	background: rgba(4, 6, 18, 0.86);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	animation: cw-fade 0.3s var(--ease);
}

@keyframes cw-fade { from { opacity: 0; } }

.cw-modal__box {
	width: min(100%, 500px);
	max-height: 88dvh; overflow-y: auto;
	background: linear-gradient(168deg, var(--ink-soft), var(--ink-deep));
	border: 1px solid rgba(200, 164, 77, 0.35);
	border-radius: var(--radius-lg);
	padding: clamp(1.6rem, 4vw, 2.6rem);
	position: relative;
	animation: cw-rise 0.4s var(--ease) both;
}

.cw-modal__close {
	position: absolute; top: 0.9rem; right: 0.9rem;
	width: 34px; height: 34px;
	border: 1px solid var(--ink-line); background: none;
	color: var(--parchment-dim); border-radius: var(--radius);
	cursor: pointer; font-size: 1.1rem; line-height: 1;
}
.cw-modal__close:hover { color: var(--gold); border-color: var(--gold); }

/* ==========================================================================
   WhatsApp button
   ========================================================================== */

.cw-whatsapp {
	position: fixed; right: 1.15rem; bottom: 1.15rem; z-index: 90;
	display: inline-flex; align-items: center; gap: 0.6rem;
	padding: 0.85rem 1.15rem;
	background: #1faa54; color: #fff;
	border-radius: 100px;
	text-decoration: none;
	font-size: 0.84rem; font-weight: 400; letter-spacing: 0.02em;
	box-shadow: 0 14px 34px -12px rgba(31, 170, 84, 0.8);
	transition: transform 0.3s var(--ease), background 0.3s var(--ease);
}
.cw-whatsapp:hover { background: #178f45; color: #fff; transform: translateY(-3px); }
.cw-whatsapp svg { flex-shrink: 0; }

@media (max-width: 640px) {
	.cw-whatsapp span { display: none; }
	.cw-whatsapp { padding: 0.95rem; }
}

/* ==========================================================================
   Footer
   ========================================================================== */

.cw-footer {
	background: var(--ink-deep);
	border-top: 1px solid var(--ink-line);
	padding-block: clamp(3rem, 6vw, 4.5rem) 2rem;
	margin-top: clamp(3rem, 7vw, 6rem);
}

.cw-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) repeat(auto-fit, minmax(150px, 1fr));
	gap: clamp(1.75rem, 4vw, 3.5rem);
	padding-bottom: 2.5rem;
	border-bottom: 1px solid var(--ink-line);
}

.cw-footer h4 {
	font-family: var(--body);
	font-size: 0.68rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 1.1rem;
}

.cw-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cw-footer a { color: var(--parchment-dim); text-decoration: none; font-size: 0.88rem; }
.cw-footer a:hover { color: var(--gold-light); }
.cw-footer p { color: var(--parchment-dim); font-size: 0.88rem; }

.cw-footer__bottom {
	display: flex; flex-wrap: wrap; gap: 1rem;
	justify-content: space-between; align-items: center;
	padding-top: 1.75rem;
	font-size: 0.78rem;
	color: rgba(185, 173, 149, 0.65);
}

.cw-disclaimer {
	font-size: 0.76rem;
	line-height: 1.6;
	color: rgba(185, 173, 149, 0.6);
	max-width: 72ch;
	margin-top: 1.25rem;
}

/* ==========================================================================
   Editorial content (posts and pages)
   ========================================================================== */

.cw-prose { max-width: 68ch; }
.cw-prose h2 { margin-top: 2.2em; }
.cw-prose h3 { margin-top: 1.8em; }
.cw-prose ul, .cw-prose ol { padding-left: 1.3rem; margin-bottom: 1.2em; }
.cw-prose li { margin-bottom: 0.45em; }
.cw-prose blockquote {
	margin: 2rem 0; padding: 0.4rem 0 0.4rem 1.5rem;
	border-left: 2px solid var(--gold);
	font-family: var(--display); font-size: var(--step-1); font-style: italic;
	color: var(--parchment);
}
.cw-prose img { border-radius: var(--radius-lg); margin-block: 1.75rem; }
.cw-prose code { font-size: 0.88em; background: rgba(8, 11, 27, 0.8); padding: 0.15em 0.4em; border-radius: 3px; }

.cw-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 2rem; }
.cw-post__thumb { border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 1rem; aspect-ratio: 16/10; }
.cw-post__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s var(--ease); }
.cw-post:hover .cw-post__thumb img { transform: scale(1.05); }
.cw-post h3 { font-size: var(--step-1); margin-bottom: 0.4rem; }
.cw-post h3 a { color: inherit; text-decoration: none; }
.cw-post time { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.cw-post p { color: var(--parchment-dim); font-size: 0.9rem; }

.cw-pagination { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 3rem; }
.cw-pagination .page-numbers {
	padding: 0.55rem 0.95rem; border: 1px solid var(--ink-line);
	border-radius: var(--radius); text-decoration: none; color: var(--parchment-dim); font-size: 0.85rem;
}
.cw-pagination .page-numbers.current,
.cw-pagination .page-numbers:hover { border-color: var(--gold); color: var(--gold-light); }

/* ==========================================================================
   Library
   ========================================================================== */

.cw-library { display: grid; grid-template-columns: repeat(auto-fill, minmax(clamp(120px, 15vw, 165px), 1fr)); gap: clamp(0.9rem, 2vw, 1.6rem); }

.cw-library figure { margin: 0; cursor: pointer; }
.cw-library .cw-card__frame { transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease); }
.cw-library figure:hover .cw-card__frame { transform: translateY(-6px); box-shadow: var(--shadow-lift); }

.cw-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 2rem; }
.cw-filters button {
	padding: 0.5rem 1.05rem;
	border: 1px solid var(--ink-line); background: none;
	color: var(--parchment-dim); border-radius: 100px;
	font-family: var(--body); font-size: 0.75rem; letter-spacing: 0.1em;
	cursor: pointer; transition: border-color 0.2s var(--ease), color 0.2s var(--ease);
}
.cw-filters button:hover { border-color: var(--gold); color: var(--gold-light); }
.cw-filters button[aria-pressed="true"] { border-color: var(--gold); background: rgba(200, 164, 77, 0.12); color: var(--gold-light); }

/* ==========================================================================
   Dashboard
   ========================================================================== */

.cw-dash__head {
	display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem;
	padding-bottom: 2rem; margin-bottom: 2.5rem;
	border-bottom: 1px solid var(--ink-line);
}
.cw-dash__head img { width: 64px; height: 64px; border-radius: 50%; border: 1px solid var(--gold-deep); }
.cw-dash__head h1 { font-size: var(--step-2); margin: 0 0 0.2rem; }
.cw-dash__head p { margin: 0; color: var(--parchment-dim); font-size: 0.9rem; }
.cw-dash__head .cw-btn { margin-left: auto; }

.cw-history { display: grid; gap: 0.75rem; }
.cw-history__row {
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--ink-line); border-radius: var(--radius);
}
.cw-history__row:hover { border-color: rgba(200, 164, 77, 0.4); }
.cw-history__row strong { font-family: var(--display); font-size: 1.1rem; font-weight: 500; }
.cw-history__row time { font-size: 0.74rem; letter-spacing: 0.1em; color: var(--parchment-dim); }
.cw-history__row .cw-btn { margin-left: auto; }

.cw-tag {
	font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase;
	padding: 0.2rem 0.6rem; border-radius: 100px;
	border: 1px solid var(--ink-line); color: var(--gold);
}

/* ==========================================================================
   Print — the downloadable report
   ========================================================================== */

@media print {
	:root { --parchment: #1a1a1a; }
	body { background: #fff; color: #1a1a1a; }
	.cw-header, .cw-footer, .cw-whatsapp, .cw-btn, .cw-meter, .cw-skip, form { display: none !important; }
	.cw-panel, .cw-fieldset, .cw-table th, .cw-table td { border-color: #ccc; }
	h1, h2, h3, h4 { color: #111; }
	a { color: #111; text-decoration: none; }
	.cw-card__frame { break-inside: avoid; }
	.cw-read__row { break-inside: avoid; page-break-inside: avoid; }
	@page { margin: 16mm; }
}