/* FiscalPulse: component styles on top of theme.json tokens. Mobile first. */

:root {
	--fp-radius: 14px;
	--fp-ink: var(--wp--preset--color--ink);
	--fp-line: var(--wp--preset--color--line);
	--fp-pulse: var(--wp--preset--color--pulse);
	--fp-pulse-dark: var(--wp--preset--color--pulse-dark);
	--fp-pulse-bright: var(--wp--preset--color--pulse-bright);
	--fp-muted: var(--wp--preset--color--text-muted);
	--fp-gap: var(--wp--preset--spacing--40);
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

:where(a, button, summary, input, textarea, select):focus-visible {
	outline: 3px solid var(--wp--preset--color--signal);
	outline-offset: 3px;
	border-radius: 4px;
}

.fp-main { margin-block-start: 0; }
.fp-main > .wp-block-post-content { margin-block-start: 0; }
.fp-main > .wp-block-post-content > :first-child { margin-block-start: 0; }
.wp-site-blocks > footer { margin-block-start: 0; }

/* ---------- Header ---------- */
.fp-header {
	position: sticky;
	top: 0;
	z-index: 50;
	/* solid background on purpose: backdrop-filter would trap the fixed mobile menu overlay inside the header */
	background: #fff;
	border-bottom: 1px solid var(--fp-line);
}
.admin-bar .fp-header { top: var(--wp-admin--admin-bar--height, 0); }
.fp-header__inner { padding-block: .7rem; gap: 1rem; }

.fp-logo {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	text-decoration: none;
	color: var(--fp-ink);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.45rem;
	font-weight: 700;
	letter-spacing: -.01em;
	line-height: 1;
}
.fp-logo:hover { color: var(--fp-ink); }
.fp-logo__mark { flex: none; }
.fp-logo__text span { color: var(--fp-pulse); }

.fp-nav a { text-decoration: none; color: var(--fp-ink); }
.fp-nav a:hover { color: var(--fp-pulse-dark); text-decoration: underline; text-underline-offset: 4px; }
.fp-nav .wp-block-navigation__container { gap: 1.6rem; align-items: center; }
.fp-nav .fp-nav__cta > a {
	background: var(--fp-pulse);
	color: #fff !important;
	padding: .55rem 1rem;
	border-radius: 9px;
	font-weight: 600;
}
.fp-nav .fp-nav__cta > a:hover { background: var(--fp-pulse-dark); text-decoration: none; }
.fp-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.5rem;
	background: #fff;
}
.fp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.fp-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	gap: 1.25rem;
	font-size: 1.25rem;
	padding-top: 1rem;
}

/* ---------- Sections ---------- */
.fp-section {
	padding-block: var(--wp--preset--spacing--60);
}
.fp-section--tight { padding-block: var(--wp--preset--spacing--50); }
:where(.wp-block-post-content) > .fp-section { margin-block: 0; }

.fp-eyebrow {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--fp-pulse-dark);
	margin-block-end: .5rem;
}
.fp-eyebrow + h2, .fp-eyebrow + h1 { margin-block-start: 0; }
.fp-lead {
	font-size: var(--wp--preset--font-size--large);
	color: var(--fp-muted);
	max-width: 40em;
	line-height: 1.55;
}
.fp-narrow > * { max-width: 46rem; }
.fp-section-head { margin-block-end: var(--wp--preset--spacing--40); }
.fp-section-head > * { margin-block: 0 .75rem; }

/* ---------- Hero ---------- */
.fp-hero {
	position: relative;
	overflow: hidden;
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70);
	background:
		radial-gradient(60rem 30rem at 85% -10%, rgba(61, 214, 181, .16), transparent 60%),
		linear-gradient(180deg, #0B1F33 0%, #0E2742 100%);
	color: #fff;
}
.fp-hero::after {
	/* thin pulse line along the bottom edge */
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, var(--fp-pulse-bright) 30%, var(--wp--preset--color--signal) 70%, transparent);
	opacity: .8;
}
.fp-hero h1, .fp-hero h2 { color: #fff; }
.fp-hero .fp-eyebrow { color: var(--fp-pulse-bright); }
.fp-hero .fp-lead { color: #D3DEE9; }
.fp-hero .fp-hero__note { color: #B9C6D4; font-size: var(--wp--preset--font-size--small); }
.fp-hero .wp-block-columns { gap: var(--wp--preset--spacing--50); align-items: center; }
.fp-hero figure { margin: 0; }
.fp-hero figure img { width: 100%; height: auto; }
.fp-hero figcaption { color: #B9C6D4; font-size: .8125rem; text-align: center; margin-top: .5rem; }
.fp-hero--page { padding-block: var(--wp--preset--spacing--60); }
.fp-hero--page h1 { font-size: var(--wp--preset--font-size--xx-large); }

.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--fp-pulse-dark);
	border: 2px solid currentColor;
	padding: calc(.85rem - 2px) calc(1.4rem - 2px);
}
.fp-hero .is-style-outline .wp-block-button__link { color: #fff; }
.fp-hero .is-style-outline .wp-block-button__link:hover { background: rgba(255, 255, 255, .1); }
.fp-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--fp-pulse-bright); color: var(--fp-ink); }
.fp-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: #fff; color: var(--fp-ink); }

/* ---------- Levers ---------- */
.fp-lever + .fp-lever { border-top: 1px solid var(--fp-line); }
.fp-lever .fp-eyebrow::before {
	content: "";
	display: inline-block;
	width: .55rem;
	height: .55rem;
	border-radius: 50%;
	background: var(--fp-pulse);
	margin-inline-end: .55rem;
	vertical-align: .08em;
}
.fp-lever--5 .fp-eyebrow::before, .fp-lever--4 .fp-eyebrow::before { background: var(--wp--preset--color--signal); }

/* ---------- Cards ---------- */
/* grid gap stays at the theme blockGap: WordPress' columnCount formula assumes it */
.fp-card {
	background: #fff;
	border: 1px solid var(--fp-line);
	border-radius: var(--fp-radius);
	padding: var(--wp--preset--spacing--40);
	box-shadow: var(--wp--preset--shadow--card);
	height: 100%;
}
.fp-card > * { margin-block: 0; }
.fp-card > * + * { margin-block-start: .6rem; }
.fp-card h3 { font-size: 1.125rem; }
.fp-card p { color: var(--fp-muted); font-size: var(--wp--preset--font-size--medium); }
.has-paper-background-color .fp-card { background: #fff; }

/* ---------- Steps ---------- */
.fp-steps { counter-reset: fp-step; }
.fp-step { position: relative; padding-top: calc(var(--wp--preset--spacing--40) + 2.6rem); }
.fp-step::before {
	counter-increment: fp-step;
	content: counter(fp-step);
	position: absolute;
	top: var(--wp--preset--spacing--40);
	inset-inline-start: var(--wp--preset--spacing--40);
	width: 2.2rem;
	height: 2.2rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--fp-ink);
	color: var(--fp-pulse-bright);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 1.15rem;
}

/* ---------- Split (text + illustration) ---------- */
.fp-split { gap: var(--wp--preset--spacing--50); align-items: center; }
.fp-split figure { margin: 0; }
.fp-split img { width: 100%; height: auto; border-radius: var(--fp-radius); }
.fp-split figcaption { font-size: .8125rem; color: var(--fp-muted); text-align: center; }

/* ---------- Check lists ---------- */
.fp-check { list-style: none; padding-inline-start: 0; }
.fp-check li {
	position: relative;
	padding-inline-start: 2rem;
	margin-block: .7rem;
}
.fp-check li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: .2em;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	background: var(--fp-pulse-tint, #E2F3EF) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%230A5C51' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat;
	background-color: var(--wp--preset--color--pulse-tint);
}

/* ---------- Pricing ---------- */
.fp-price {
	background: #fff;
	border: 1px solid var(--fp-line);
	border-radius: var(--fp-radius);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	box-shadow: var(--wp--preset--shadow--card);
	height: 100%;
}
.fp-price > * { margin-block: 0; }
.fp-price > * + * { margin-block-start: .8rem; }
.fp-price--featured { border: 2px solid var(--fp-pulse); position: relative; }
.fp-price__badge {
	display: inline-block;
	background: var(--wp--preset--color--signal);
	color: var(--fp-ink);
	font-size: .8125rem;
	font-weight: 700;
	padding: .2rem .65rem;
	border-radius: 99px;
}
.fp-price__amount {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(2.75rem, 6vw, 3.5rem);
	font-weight: 700;
	line-height: 1;
	color: var(--fp-ink);
}
.fp-price__amount small { font-family: var(--wp--preset--font-family--body); font-size: 1rem; font-weight: 500; color: var(--fp-muted); }
.fp-price__note { color: var(--fp-muted); }

.fp-price-teaser {
	border: 1px solid var(--fp-line);
	border-radius: var(--fp-radius);
	background: #fff;
	padding: var(--wp--preset--spacing--50);
	box-shadow: var(--wp--preset--shadow--card);
}

/* ---------- FAQ ---------- */
.fp-faq .wp-block-details { margin-block: 0; }
.fp-faq .wp-block-details:first-of-type { border-top: 1px solid var(--fp-line); }
.fp-faq summary {
	cursor: pointer;
	font-weight: 650;
	font-size: 1.0625rem;
	list-style: none;
	position: relative;
	padding-inline-end: 2rem;
}
.fp-faq summary::-webkit-details-marker { display: none; }
.fp-faq summary::after {
	content: "+";
	position: absolute;
	inset-inline-end: .25rem;
	top: -.1rem;
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--fp-pulse);
	transition: transform .2s ease;
}
.fp-faq details[open] summary::after { transform: rotate(45deg); }
.fp-faq details > p { color: var(--fp-muted); margin-block-start: .6rem; }

/* ---------- CTA band ---------- */
.fp-cta {
	background:
		radial-gradient(40rem 20rem at 10% 120%, rgba(61, 214, 181, .18), transparent 60%),
		var(--wp--preset--color--ink-2);
	color: #fff;
}
.fp-cta { text-align: center; }
.fp-cta .wp-block-buttons { justify-content: center; }
.fp-cta h2 { color: #fff; }
.fp-cta p { color: #D3DEE9; }
.fp-cta .wp-block-button__link { background: var(--fp-pulse-bright); color: var(--fp-ink); }
.fp-cta .wp-block-button__link:hover { background: #fff; color: var(--fp-ink); }

/* ---------- Placeholder (to be replaced) ---------- */
.fp-placeholder {
	border: 2px dashed var(--wp--preset--color--signal);
	background: var(--wp--preset--color--signal-tint);
	border-radius: var(--fp-radius);
	padding: var(--wp--preset--spacing--40);
}
.fp-placeholder > * { margin-block: 0; }
.fp-placeholder > * + * { margin-block-start: .5rem; }

/* ---------- Footer ---------- */
.fp-footer { padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--small); }
.fp-footer a { color: #fff; text-decoration: none; }
.fp-footer a:hover { color: var(--fp-pulse-bright); text-decoration: underline; }
.fp-footer__brand { font-family: var(--wp--preset--font-family--heading); font-size: 1.5rem; font-weight: 700; margin: 0; }
.fp-footer__text { color: #B9C6D4; max-width: 28rem; }
.fp-footer__title { font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .8125rem; color: var(--fp-pulse-bright); margin-bottom: .5rem; }
.fp-footer__links { list-style: none; padding: 0; margin: 0; }
.fp-footer__links li { margin-block: .4rem; }
.fp-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .14);
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--30);
	color: #B9C6D4;
	gap: .5rem 2rem;
}
.fp-footer__bottom p { margin: 0; }

/* ---------- Scroll reveal (only when the observer runs; off with reduced motion) ---------- */
@media (prefers-reduced-motion: no-preference) {
	/* .fp-io is set by reveal.js only once the observer is running: no script, no hiding */
	.fp-io .fp-reveal {
		opacity: 0;
		transform: translateY(18px);
		transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1);
	}
	.fp-io .fp-reveal.is-visible { opacity: 1; transform: none; }
	.fp-io .fp-cards > .fp-reveal:nth-child(2) { transition-delay: .08s; }
	.fp-io .fp-cards > .fp-reveal:nth-child(3) { transition-delay: .16s; }
	.fp-io .fp-cards > .fp-reveal:nth-child(4) { transition-delay: .24s; }
	.fp-io .fp-cards > .fp-reveal:nth-child(5) { transition-delay: .32s; }
}

/* ---------- Small screens ---------- */
@media (max-width: 781px) {
	.fp-hero { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
	.fp-hero .wp-block-buttons { flex-direction: column; align-items: stretch; }
	.fp-hero .wp-block-button { width: 100%; }
	.fp-hero .wp-block-button__link { width: 100%; text-align: center; }
	.fp-logo { font-size: 1.3rem; }
}

/* ---------- Contact form wrapper (Fluent Forms keeps its own field styles) ---------- */
.fp-form {
	background: #fff;
	border: 1px solid var(--fp-line);
	border-radius: var(--fp-radius);
	padding: var(--wp--preset--spacing--40);
	box-shadow: var(--wp--preset--shadow--card);
}
.fp-form .ff-btn-submit { background: var(--fp-pulse) !important; color: #fff !important; border-radius: 10px !important; font-weight: 600; }
.fp-form .ff-btn-submit:hover { background: var(--fp-pulse-dark) !important; }

/* ---------- Language switcher (only rendered when the page exists in 2+ languages) ---------- */
.fp-header__inner .fp-nav { margin-inline-start: auto; }
.fp-lang { flex: none; }
.fp-lang ul { display: flex; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.fp-lang a {
	display: inline-block;
	padding: .3rem .45rem;
	border-radius: 6px;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--fp-muted);
	text-decoration: none;
}
.fp-lang a:hover { color: var(--fp-ink); background: var(--wp--preset--color--paper); }
.fp-lang a.is-current { color: var(--fp-ink); box-shadow: inset 0 -2px 0 var(--fp-pulse); border-radius: 0; }

/* 3+ languages: compact menu (details/summary, no JS) */
.fp-lang--menu { position: relative; }
.fp-lang--menu > summary {
	list-style: none;
	cursor: pointer;
	padding: .3rem .5rem;
	border: 1px solid var(--fp-line);
	border-radius: 7px;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--fp-ink);
}
.fp-lang--menu > summary::-webkit-details-marker { display: none; }
.fp-lang--menu > summary::after { content: "▾"; margin-inline-start: .3rem; font-size: .7rem; color: var(--fp-muted); }
.fp-lang--menu ul {
	position: absolute;
	inset-inline-end: 0;
	top: calc(100% + .4rem);
	z-index: 60;
	flex-direction: column;
	gap: 0;
	min-width: 10rem;
	padding: .35rem;
	background: #fff;
	border: 1px solid var(--fp-line);
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(11, 31, 51, .12);
}
.fp-lang--menu a { display: block; font-size: .9375rem; font-weight: 500; letter-spacing: 0; color: var(--fp-ink); }
.fp-lang--menu a.is-current { box-shadow: none; border-radius: 6px; background: var(--wp--preset--color--pulse-tint); }

/* RTL pages whose header/footer still fall back to English: each line takes the direction of its own text. */
[dir="rtl"] :is(.fp-header, .fp-footer, .cmplz-cookiebanner) :is(p, li, a, span, div.cmplz-message) { unicode-bidi: plaintext; }

/* ---------- Non-Latin scripts: the self-hosted fonts are Latin-only. The brand fonts stay first (Latin words,
   numbers and the logo keep the brand look) and the browser takes every Arabic/CJK/Cyrillic glyph from the
   system fonts listed after them. ---------- */
:lang(ar) {
	--wp--preset--font-family--body: "Public Sans", "Segoe UI", Tahoma, "Geeza Pro", "Noto Sans Arabic", "Noto Naskh Arabic", "Arabic UI Text", Arial, sans-serif;
	--wp--preset--font-family--heading: Newsreader, "Segoe UI", Tahoma, "Geeza Pro", "Noto Naskh Arabic", "Noto Sans Arabic", Arial, sans-serif;
}
:lang(zh) {
	--wp--preset--font-family--body: "Public Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
	--wp--preset--font-family--heading: Newsreader, "PingFang SC", "Microsoft YaHei", "Noto Serif SC", "Noto Sans CJK SC", "Source Han Serif SC", serif;
}
:lang(ja) {
	--wp--preset--font-family--body: "Public Sans", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, "Noto Sans JP", "Noto Sans CJK JP", sans-serif;
	--wp--preset--font-family--heading: Newsreader, "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "Noto Serif JP", "Noto Serif CJK JP", "Hiragino Sans", serif;
}
:lang(ru) {
	--wp--preset--font-family--body: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
	--wp--preset--font-family--heading: Newsreader, Georgia, "Noto Serif", "Times New Roman", serif;
}
/* Letter-spacing and italics hurt Arabic and CJK; uppercase does nothing there. */
:is(:lang(ar), :lang(zh), :lang(ja)) :is(h1, h2, h3, .fp-eyebrow, .fp-logo) { letter-spacing: 0; }
:is(:lang(zh), :lang(ja)) body { line-break: strict; word-break: normal; }
:lang(ar) body { line-height: 1.75; }
/* The logo is a brand mark: always left-to-right, even on RTL pages. */
.fp-logo { direction: ltr; }
