/*
Theme Name: Cloud2Value
Theme URI: https://cloud2value.eu
Author: Cloud2Value
Description: Block theme for Cloud2Value, built on brand book v2.0 "Signal power. Anchor warmth." Ink Navy base, Warm Off-White pages, Warm Gold accents, a Violet-to-Cyan signature gradient used sparingly, and Space Grotesk throughout (self-hosted from Google Fonts, SIL OFL 1.1).
Version: 1.1.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cloud2value
Tags: block-theme, full-site-editing, one-column, custom-logo, editor-style
*/

/* ------------------------------------------------------------------
   Brand tokens (mirror of theme.json, for hand-written CSS)
   60% ink navy · 30% off-white · 7% warm gold · 3% gradient
------------------------------------------------------------------- */
:root {
	--c2v-navy: #0B1030;
	--c2v-navy-raised: #141A45;
	--c2v-navy-line: #2A3163;
	--c2v-offwhite: #F6F1E7;
	--c2v-gold: #D9A441;
	--c2v-gold-hover: #E6B95F;
	--c2v-gold-text: #8F6416; /* Warm Gold darkened for small text on off-white (WCAG AA) */
	--c2v-violet: #7A5CFF;
	--c2v-cyan: #28D1E6;
	--c2v-slate: #B7BBD3;
	--c2v-warm-grey: #4F4B40;
	--c2v-warm-line: #E4DDC9;
	--c2v-gradient: linear-gradient(135deg, #7A5CFF 0%, #28D1E6 100%);
	--c2v-gradient-90: linear-gradient(90deg, #7A5CFF 0%, #28D1E6 100%);
}

body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: var(--c2v-gold); color: var(--c2v-navy); }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.wp-site-blocks > main { margin-block: 0; }

/* ---------------- Header ---------------- */
.c2v-header {
	position: sticky; top: 0; z-index: 50;
	border-bottom: 1px solid rgba(217, 164, 65, 0.55);
	backdrop-filter: saturate(140%) blur(6px);
}
.admin-bar .c2v-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .c2v-header { top: 0; position: relative; } }
.c2v-header .wp-block-site-logo img { width: auto; max-height: 52px; height: auto; }
.c2v-header .wp-block-navigation__container { gap: 2rem; }
.c2v-header .wp-block-navigation-item__content { padding-block: .4rem; border-bottom: 1px solid transparent; }
.c2v-header .current-menu-item > .wp-block-navigation-item__content,
.c2v-header .wp-block-navigation-item__content[aria-current="page"] { border-bottom-color: var(--c2v-gold); }
.c2v-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--c2v-navy) !important; color: #fff !important;
	padding: 2rem clamp(20px, 5vw, 48px);
}
.c2v-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1.25rem; font-size: 1.5rem; }

/* ---------------- Section styles: alternating dark / warm ---------------- */
.is-style-section-dark,
.is-style-section-glow {
	background-color: var(--c2v-navy);
	color: #FFFFFF;
}
.is-style-section-dark :where(p, li, figcaption, .wp-block-post-excerpt),
.is-style-section-glow :where(p, li, figcaption, .wp-block-post-excerpt) { color: var(--c2v-slate); }
.is-style-section-dark :where(h1, h2, h3, h4, h5, .wp-block-heading, .is-style-lead),
.is-style-section-glow :where(h1, h2, h3, h4, h5, .wp-block-heading, .is-style-lead) { color: #FFFFFF; }
.is-style-section-dark a:where(:not(.wp-element-button)),
.is-style-section-glow a:where(:not(.wp-element-button)) { color: #FFFFFF; text-decoration-color: rgba(217,164,65,.7); }
.is-style-section-dark a:where(:not(.wp-element-button)):hover,
.is-style-section-glow a:where(:not(.wp-element-button)):hover { color: var(--c2v-gold); }

.is-style-section-glow {
	position: relative; isolation: isolate; overflow: hidden;
	background-image:
		radial-gradient(ellipse 50% 70% at 72% 40%, rgba(122, 92, 255, 0.32) 0%, rgba(40, 209, 230, 0.07) 45%, rgba(11, 16, 48, 0) 72%),
		radial-gradient(ellipse 120% 90% at 50% 120%, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0) 60%);
}

.is-style-section-warm { background-color: var(--c2v-offwhite); color: var(--c2v-navy); }
/* Warm sections: topographic 'anchor' texture with scroll parallax (assets/js/parallax.js).
   Seamless 1600x1000 tile, transparent, so the off-white base stays the brand colour. */
.is-style-section-warm {
	background-image: url(assets/images/warm-topo.svg);
	background-repeat: repeat;
	background-size: 1600px auto;
	background-position: 50% calc(var(--c2v-parallax, 0px));
}
@media (max-width: 640px) { .is-style-section-warm { background-size: 1100px auto; } }
@media print { .is-style-section-warm { background-image: none; } }
.is-style-section-warm :where(p, li) { color: var(--c2v-warm-grey); }
.is-style-section-warm :where(h1, h2, h3, h4, .wp-block-heading, .is-style-lead) { color: var(--c2v-navy); }

/* Gold hairline frame top/bottom (brand book cover device) */
.is-style-section-dark.has-gold-frame,
.c2v-gold-frame { border-top: 1px solid rgba(217,164,65,.55); border-bottom: 1px solid rgba(217,164,65,.55); }

/* ---------------- Cards ---------------- */
.is-style-card-dark {
	background: var(--c2v-navy-raised);
	border: 1px solid var(--c2v-navy-line);
	border-radius: 14px;
	color: #FFFFFF;
	transition: border-color .2s ease, transform .2s ease;
}
.is-style-card-dark :where(p, li) { color: var(--c2v-slate); }
.is-style-card-dark :where(h2, h3, h4) { color: #FFFFFF; }
.is-style-card-dark:hover { border-color: rgba(217,164,65,.6); }

.is-style-card-warm {
	background: #FFFFFF;
	border: 1px solid var(--c2v-warm-line);
	border-radius: 14px;
	color: var(--c2v-navy);
	box-shadow: 0 1px 0 rgba(11,16,48,.03), 0 12px 32px -18px rgba(11,16,48,.18);
}
.is-style-card-warm :where(p, li) { color: var(--c2v-warm-grey); }

/* Signature gradient: ONE hero element per page */
.is-style-signal-panel {
	background: var(--c2v-gradient);
	border-radius: 24px;
	color: #FFFFFF;
}
.is-style-signal-panel :where(p, h1, h2, h3, h4, li) { color: #FFFFFF; }

/* ---------------- Typography styles ---------------- */
.is-style-eyebrow {
	font-size: 0.875rem !important;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	line-height: 1.5;
	color: var(--c2v-gold) !important;
}
.is-style-eyebrow a { color: inherit; text-decoration: none; }
/* small gold text on light backgrounds: AA-safe shade of Warm Gold */
.is-style-section-warm .is-style-eyebrow,
.is-style-card-warm .is-style-eyebrow,
body:not(.c2v-dark) main > .wp-block-post-content > .is-style-eyebrow,
.c2v-on-light .is-style-eyebrow { color: var(--c2v-gold-text) !important; }
.is-style-lead { font-size: clamp(1.25rem, 1rem + 0.9vw, 1.625rem); line-height: 1.45; font-weight: 400; letter-spacing: -0.01em; }
.is-style-fine-print { font-size: 0.875rem; letter-spacing: 0.02em; }
.is-style-caption-label {
	font-size: 0.875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3em;
}
/* "Cloud2Value" wordmark text with the gold 2 */
.c2v-two { color: var(--c2v-gold); }

/* Headings with the short signal underline */
.is-style-signal-underline::after {
	content: ""; display: block; width: 72px; height: 4px; margin-top: .45em;
	border-radius: 2px; background: var(--c2v-gradient-90);
}
.has-text-align-center.is-style-signal-underline::after { margin-inline: auto; }

/* Big figures (metrics) */
.is-style-metric {
	font-size: clamp(2.75rem, 2rem + 3vw, 4.5rem) !important;
	font-weight: 700; letter-spacing: -0.04em; line-height: 1;
}
.is-style-metric .c2v-unit, .is-style-metric em { font-style: normal; color: var(--c2v-gold); }

/* ---------------- Separators ---------------- */
.wp-block-separator { border: 0 !important; height: 1px; background-color: var(--c2v-gold); opacity: 1; }
.wp-block-separator.is-style-short { width: 64px !important; max-width: 64px; margin-left: 0; height: 2px; }
.has-text-align-center + .wp-block-separator.is-style-short,
.wp-block-separator.is-style-short.aligncenter { margin-inline: auto; }
.wp-block-separator.is-style-signal { height: 3px; background: var(--c2v-gradient-90); }

/* ---------------- Lists ---------------- */
.is-style-gold-ticks { list-style: none; padding-left: 0; }
.is-style-gold-ticks li { position: relative; padding-left: 1.75em; margin-block: .55em; }
.is-style-gold-ticks li::before {
	content: ""; position: absolute; left: 0; top: .5em; width: .65em; height: .65em;
	border-radius: 50%; border: 2px solid var(--c2v-gold);
}

/* ---------------- Buttons ---------------- */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: currentColor; border: 1px solid var(--c2v-gold);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--c2v-gold); color: var(--c2v-navy); }
.wp-block-button.is-style-navy > .wp-block-button__link { background: var(--c2v-navy); color: var(--c2v-gold); border-color: var(--c2v-navy); }
.wp-block-button.is-style-navy > .wp-block-button__link:hover { background: var(--c2v-navy-raised); color: var(--c2v-gold-hover); }

/* Pills (CLARITY · OWNERSHIP · MOMENTUM) */
.c2v-pills { display: flex; flex-wrap: wrap; gap: .75rem; }
.is-style-pill {
	display: inline-block; margin: 0 !important;
	padding: .7em 1.4em; border-radius: 6px;
	background: var(--c2v-navy); color: var(--c2v-gold) !important;
	font-size: .8125rem !important; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; line-height: 1;
}
.is-style-section-dark .is-style-pill,
.is-style-section-glow .is-style-pill { background: transparent; border: 1px solid rgba(217,164,65,.6); }

/* ---------------- Images / imagery ---------------- */
.wp-block-image img, .wp-block-post-featured-image img { border-radius: inherit; }
.wp-block-image.is-style-plain img { border-radius: 0; }

/* ---------------- Page title band ---------------- */
.c2v-title-band { border-bottom: 1px solid rgba(217,164,65,.55); }
.c2v-title-band .wp-block-post-title { color: #FFFFFF; max-width: 18ch; }

/* ---------------- Footer ---------------- */
.c2v-footer { border-top: 1px solid rgba(217,164,65,.55); }
.c2v-footer .wp-block-site-logo img { width: auto; max-height: 64px; height: auto; }
.c2v-footer h2.is-style-eyebrow, .c2v-footer .is-style-eyebrow { margin-bottom: .6rem; }
.c2v-footer p { color: var(--c2v-slate); font-size: 1rem; line-height: 1.7; margin: 0; }
.c2v-footer a { color: var(--c2v-slate); text-decoration: none; }
.c2v-footer a:hover { color: var(--c2v-gold); }
.c2v-footer .c2v-legal p { font-size: .8125rem; letter-spacing: .04em; }

/* ---------------- Forms (contact plugins, search) ---------------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="url"], textarea, select {
	font: inherit; font-size: 1rem; color: var(--c2v-navy);
	background: #FFFFFF; border: 1px solid var(--c2v-warm-line); border-radius: 6px; padding: .8em 1em;
}
input:focus, textarea:focus, select:focus { outline: 2px solid var(--c2v-gold); outline-offset: 1px; border-color: var(--c2v-gold); }

/* ---------------- Accessibility ---------------- */
:focus-visible { outline: 2px solid var(--c2v-gold); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* ---------------- Example bar chart (hero) ---------------- */
.c2v-bars {
	display: grid; grid-template-columns: repeat(6, 1fr); align-items: end; gap: 10px;
	height: 150px; margin-block: 1.25rem .5rem; padding-bottom: 1.6rem; position: relative;
	background-image: linear-gradient(to top, rgba(183,187,211,.14) 1px, transparent 1px);
	background-size: 100% 25%;
}
.c2v-bars span {
	position: relative; display: block; height: var(--h, 50%);
	border-radius: 6px 6px 2px 2px;
	background: linear-gradient(0deg, #7A5CFF 0%, #28D1E6 100%);
}
.c2v-bars span:last-child::before {
	content: ""; position: absolute; left: 50%; top: -14px; transform: translateX(-50%);
	border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 9px solid var(--c2v-gold);
}
.c2v-bars i {
	position: absolute; left: 0; right: 0; bottom: -1.6rem; text-align: center;
	font-style: normal; font-size: .75rem; letter-spacing: .08em; color: var(--c2v-slate);
}

/* Hero spacing */
.is-style-section-glow h1.wp-block-heading { max-width: 13ch; }
.is-style-section-dark .is-style-signal-underline, .is-style-section-warm .is-style-signal-underline { margin-bottom: 1.25rem; }
.wp-block-quote { margin: 0; }
.wp-block-quote p { color: var(--c2v-navy) !important; }

/* ---------------- Responsive refinements ---------------- */
.c2v-header-cta .wp-block-button__link { white-space: nowrap; }
@media (max-width: 640px) {
	.c2v-header .wp-block-buttons.c2v-header-cta { display: none; }
	.c2v-header .wp-block-site-logo img { max-height: 44px; }
	.is-style-section-glow h1.wp-block-heading { font-size: clamp(2.5rem, 11vw, 3.25rem) !important; }
}
.is-style-fine-print { opacity: 1; }
.is-style-section-dark .is-style-fine-print,
.is-style-section-glow .is-style-fine-print,
.is-style-card-dark .is-style-fine-print { color: var(--c2v-slate) !important; }
.c2v-bars i { font-size: .8125rem; color: #CDD0E3; }