/*
Theme Name:   Hello Elementor Child — Fenix RD
Theme URI:    https://fenixrd.com
Description:  Child theme for Fenix RD (Fenix Remote Desktop AI).
Author:       Fenix RD
Template:     hello-elementor
Version:      1.1.0
Text Domain:  hello-elementor-child
*/

:root {
	--fx-ink:        #0B0E13;
	--fx-ink-soft:   #141922;
	--fx-line:       #232B38;
	--fx-text:       #E8ECF2;
	--fx-text-dim:   #98A3B3;
	--fx-ember:      #FF7A2F;
	--fx-ember-soft: #FFB067;
	--fx-measure:    62ch;
}

/* El tema padre pinta cabecera y pie propios: en la portada sobran. */
.fx-shell ~ * { margin: 0; }
body.home .site-header,
body.home .site-footer { display: none; }

body.home {
	margin: 0;
	background: var(--fx-ink);
	color: var(--fx-text);
	font-family: Manrope, "Segoe UI", system-ui, -apple-system, sans-serif;
	-webkit-font-smoothing: antialiased;
}

.fx-shell {
	position: relative;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
	padding: clamp(2.5rem, 7vw, 6rem) clamp(1.25rem, 5vw, 3rem);
	box-sizing: border-box;
}

/* Brasa de fondo: el guino al fenix, contenido y sin estridencias. */
.fx-glow {
	position: absolute;
	inset: auto auto 0 50%;
	width: min(1100px, 130vw);
	height: min(1100px, 130vw);
	transform: translate(-50%, 38%);
	background: radial-gradient(circle, rgba(255, 122, 47, .17) 0%, rgba(255, 122, 47, .06) 38%, transparent 68%);
	pointer-events: none;
}

.fx-inner {
	position: relative;
	width: 100%;
	max-width: 1080px;
	/* auto en el eje de bloque: centra si cabe y no corta el inicio si no cabe. */
	margin: auto;
}

/* --- Marca --- */
.fx-brand {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin-bottom: clamp(2rem, 6vw, 3.5rem);
}

.fx-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 11px;
	background: linear-gradient(150deg, var(--fx-ember), #E04E1B);
	color: #fff;
	box-shadow: 0 6px 22px -8px rgba(255, 122, 47, .75);
}

.fx-wordmark {
	font-size: 1.22rem;
	font-weight: 700;
	letter-spacing: -.02em;
}

.fx-wordmark span {
	color: var(--fx-ember);
	margin-left: .22em;
}

/* --- Estado --- */
.fx-badge {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin: 0 0 1.4rem;
	padding: .34rem .8rem .34rem .62rem;
	border: 1px solid var(--fx-line);
	border-radius: 999px;
	background: var(--fx-ink-soft);
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--fx-text-dim);
}

.fx-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--fx-ember);
	box-shadow: 0 0 0 0 rgba(255, 122, 47, .55);
	animation: fx-pulse 2.6s ease-out infinite;
}

@keyframes fx-pulse {
	70%  { box-shadow: 0 0 0 9px rgba(255, 122, 47, 0); }
	100% { box-shadow: 0 0 0 0 rgba(255, 122, 47, 0); }
}

/* --- Texto --- */
.fx-title {
	margin: 0 0 1.1rem;
	max-width: 18ch;
	font-size: clamp(2.5rem, 7vw, 4.6rem);
	line-height: 1.02;
	font-weight: 800;
	letter-spacing: -.035em;
	text-wrap: balance;
	background: linear-gradient(178deg, #fff 32%, var(--fx-ember-soft) 140%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.fx-lede {
	max-width: var(--fx-measure);
	color: var(--fx-text-dim);
	font-size: clamp(1.02rem, 2vw, 1.18rem);
	line-height: 1.62;
}

.fx-lede h2 {
	margin: 0 0 .7rem;
	color: var(--fx-text);
	font-size: 1.16rem;
	font-weight: 700;
	letter-spacing: -.01em;
}

.fx-lede p { margin: 0 0 .95rem; }
.fx-lede strong { color: var(--fx-text); font-weight: 700; }

/* --- Tres claves --- */
.fx-points {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: clamp(1rem, 2.4vw, 1.6rem);
	margin: clamp(2.4rem, 6vw, 3.6rem) 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--fx-line);
	padding-top: clamp(1.8rem, 4vw, 2.6rem);
}

.fx-points h2 {
	margin: 0 0 .45rem;
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--fx-ember);
}

.fx-points p {
	margin: 0;
	color: var(--fx-text-dim);
	font-size: .95rem;
	line-height: 1.6;
}

/* --- Pie --- */
.fx-foot {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	justify-content: center;
	margin-top: clamp(3rem, 8vw, 5rem);
	color: #64707F;
	font-size: .82rem;
}

.fx-foot-sep { opacity: .5; }

@media (prefers-reduced-motion: reduce) {
	.fx-dot { animation: none; }
}