/* ==========================================================================
   Wild Nova — design system
   Tokens map onto Elementor Global Colors / Fonts so Site Settings can
   restyle the whole site. Fallbacks keep it intact without Elementor.
   ========================================================================== */

:root {
	--wn-ink: var(--e-global-color-primary, #1C1A17);
	--wn-slate: var(--e-global-color-secondary, #2F3A4A);
	--wn-text: var(--e-global-color-text, #4A4640);
	--wn-accent: var(--e-global-color-accent, #E2621B);
	--wn-accent-ink: #B94C0F;
	--wn-accent-soft: #FCEFE6;
	--wn-sand: var(--e-global-color-wnsand, #F7F3EC);
	--wn-sand-2: #EFE8DC;
	--wn-line: var(--e-global-color-wnline, #E9E3D9);
	--wn-muted: #7A746B;
	--wn-green: var(--e-global-color-wngreen, #4E6B3C);
	--wn-whatsapp: #1E9E57;
	--wn-white: #FFFFFF;
	--wn-night: #161513;

	--wn-font-display: var(--e-global-typography-primary-font-family, "Fraunces"), Georgia, "Times New Roman", serif;
	--wn-font-body: var(--e-global-typography-text-font-family, "Manrope"), system-ui, -apple-system, "Segoe UI", sans-serif;

	--wn-container: 1240px;
	--wn-gutter: clamp(16px, 4vw, 32px);
	--wn-radius-sm: 8px;
	--wn-radius: 14px;
	--wn-radius-lg: 22px;
	--wn-shadow-sm: 0 1px 2px rgba(28, 26, 23, .06);
	--wn-shadow: 0 10px 30px -12px rgba(28, 26, 23, .18);
	--wn-shadow-lg: 0 24px 60px -24px rgba(28, 26, 23, .28);
	--wn-ease: cubic-bezier(.22, .61, .36, 1);
	--wn-header-h: 76px;
	--wn-section-y: clamp(64px, 9vw, 120px);
}

/* Base ------------------------------------------------------------------- */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body.wn-site {
	margin: 0;
	background: var(--wn-white);
	color: var(--wn-text);
	font-family: var(--wn-font-body);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

.wn-site h1, .wn-site h2, .wn-site h3, .wn-site h4,
.wn-site .elementor-heading-title {
	font-family: var(--wn-font-display);
	color: var(--wn-ink);
	font-weight: 500;
	letter-spacing: -0.015em;
	line-height: 1.12;
	margin: 0 0 .5em;
	font-variation-settings: "opsz" 96;
}
.wn-site h1 { font-size: clamp(2.4rem, 5.2vw, 4.25rem); }
.wn-site h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); }
.wn-site h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
.wn-site h4 { font-size: 1.125rem; }

:where(.wn-site) p { margin: 0 0 1em; }
:where(.wn-site) a { color: var(--wn-ink); text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color .2s var(--wn-ease); }
:where(.wn-site) a:hover { color: var(--wn-accent); }
:where(.wn-site) img { max-width: 100%; height: auto; }
.wn-site ::selection { background: var(--wn-accent); color: #fff; }

.wn-site :focus-visible {
	outline: 2px solid var(--wn-accent);
	outline-offset: 3px;
	border-radius: 4px;
}

.wn-container {
	width: 100%;
	max-width: var(--wn-container);
	margin-inline: auto;
	padding-inline: var(--wn-gutter);
	box-sizing: border-box;
}

.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px; height: 1px;
	overflow: hidden;
	word-wrap: normal !important;
}
.skip-link:focus {
	clip: auto; width: auto; height: auto;
	z-index: 1000; top: 8px; left: 8px;
	padding: 10px 16px; background: #fff; color: var(--wn-ink);
	border-radius: var(--wn-radius-sm); box-shadow: var(--wn-shadow);
}

/* Buttons ---------------------------------------------------------------- */

.wn-btn,
.wn-site .elementor-button.wn-btn {
	--btn-bg: var(--wn-ink);
	--btn-fg: #fff;
	--btn-bd: var(--btn-bg);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55em;
	padding: .85em 1.45em;
	border: 1.5px solid var(--btn-bd);
	border-radius: 999px;
	background: var(--btn-bg);
	color: var(--btn-fg);
	font-family: var(--wn-font-body);
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .005em;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .2s var(--wn-ease), color .2s var(--wn-ease), border-color .2s var(--wn-ease), transform .2s var(--wn-ease);
}
.wn-btn:hover { color: var(--btn-fg); transform: translateY(-1px); }
.wn-btn:active { transform: translateY(0) scale(.98); }
.wn-btn .wn-icon { flex: none; }

.wn-btn--primary { --btn-bg: var(--wn-accent); }
.wn-btn--primary:hover { --btn-bg: var(--wn-accent-ink); }
.wn-btn--dark:hover { --btn-bg: #000; }
.wn-btn--outline { --btn-bg: transparent; --btn-fg: var(--wn-ink); --btn-bd: var(--wn-line); }
.wn-btn--outline:hover { --btn-bd: var(--wn-ink); --btn-fg: var(--wn-ink); }
.wn-btn--light { --btn-bg: #fff; --btn-fg: var(--wn-ink); }
.wn-btn--light:hover { --btn-bg: var(--wn-sand); }
.wn-btn--ghost-light { --btn-bg: rgba(255,255,255,.12); --btn-fg: #fff; --btn-bd: rgba(255,255,255,.55); backdrop-filter: blur(6px); }
.wn-btn--ghost-light:hover { --btn-bg: rgba(255,255,255,.22); --btn-bd: #fff; }
.wn-btn--whatsapp { --btn-bg: transparent; --btn-fg: var(--wn-ink); --btn-bd: var(--wn-line); }
.wn-btn--whatsapp .wn-icon { color: var(--wn-whatsapp); }
.wn-btn--whatsapp:hover { --btn-bd: var(--wn-whatsapp); }
.wn-btn--sm { padding: .6em 1.1em; font-size: .875rem; }
.wn-btn--lg { padding: 1em 1.75em; font-size: 1rem; }
.wn-btn--block { width: 100%; }

.wn-link-arrow {
	display: inline-flex; align-items: center; gap: .4em;
	font-weight: 600; text-decoration: none; color: var(--wn-ink);
}
.wn-link-arrow .wn-icon { transition: transform .2s var(--wn-ease); }
.wn-link-arrow:hover .wn-icon { transform: translateX(3px); }

.wn-icon { display: inline-block; vertical-align: middle; flex: none; }

/* Header ----------------------------------------------------------------- */

.wn-header {
	position: sticky;
	top: 0;
	z-index: 900;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: saturate(160%) blur(10px);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	transition: box-shadow .25s var(--wn-ease);
}
.admin-bar .wn-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .wn-header { top: 0; } }
.wn-header.is-scrolled { box-shadow: 0 1px 0 var(--wn-line), 0 8px 24px -18px rgba(28,26,23,.35); }

.wn-topbar {
	border-bottom: 1px solid var(--wn-line);
	font-size: .8125rem;
	color: var(--wn-muted);
	transition: margin .25s var(--wn-ease), opacity .2s;
}
.wn-header.is-scrolled .wn-topbar { margin-top: -37px; opacity: 0; pointer-events: none; }
.wn-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 36px; }
.wn-topbar__contacts { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.wn-topbar__contacts li { display: inline-flex; align-items: center; gap: 7px; }
.wn-topbar__contacts a { display: inline-flex; align-items: center; gap: 7px; color: inherit; text-decoration: none; }
.wn-topbar__contacts a:hover { color: var(--wn-ink); }
.wn-topbar .wn-icon { color: var(--wn-accent); }

.wn-header__inner {
	display: flex;
	align-items: center;
	gap: 28px;
	min-height: var(--wn-header-h);
}
.wn-header__brand { flex: none; }
.wn-logo { display: inline-flex; align-items: center; }
.wn-site .wn-logo .wn-logo__img { display: block; width: auto; height: 46px; max-width: none; }

.wn-nav { margin-inline: auto; }
.wn-nav__list { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.wn-nav__list > li { position: relative; }
.wn-nav__list a {
	display: block;
	padding: 10px 14px;
	border-radius: 999px;
	color: var(--wn-ink);
	font-size: .9375rem;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
}
.wn-nav__list a:hover { color: var(--wn-accent); }
.wn-nav__list .current-menu-item > a,
.wn-nav__list .current-menu-ancestor > a,
.wn-nav__list .current_page_item > a { color: var(--wn-accent); }

.wn-nav__list .sub-menu {
	position: absolute; left: 0; top: 100%;
	min-width: 230px; margin: 0; padding: 8px; list-style: none;
	background: #fff; border: 1px solid var(--wn-line); border-radius: var(--wn-radius);
	box-shadow: var(--wn-shadow);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity .18s var(--wn-ease), transform .18s var(--wn-ease), visibility .18s;
}
.wn-nav__list li:hover > .sub-menu,
.wn-nav__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.wn-nav__list .sub-menu a { border-radius: var(--wn-radius-sm); padding: 9px 12px; }
.wn-nav__list .sub-menu a:hover { background: var(--wn-sand); color: var(--wn-ink); }

.wn-header__actions { display: flex; align-items: center; gap: 10px; flex: none; }
.wn-icon-btn {
	display: inline-grid; place-items: center;
	width: 44px; height: 44px; border-radius: 50%;
	border: 1.5px solid var(--wn-line); color: var(--wn-whatsapp);
	transition: border-color .2s var(--wn-ease);
}
.wn-icon-btn:hover { border-color: var(--wn-whatsapp); color: var(--wn-whatsapp); }

.wn-burger {
	display: none;
	width: 44px; height: 44px; padding: 0;
	border: 0; border-radius: 50%; background: var(--wn-sand); color: var(--wn-ink);
	cursor: pointer;
}
.wn-burger__close { display: none; }
.wn-burger[aria-expanded="true"] .wn-burger__open { display: none; }
.wn-burger[aria-expanded="true"] .wn-burger__close { display: inline; }
.wn-nav__mobile-cta { display: none; }

@media (max-width: 1100px) {
	.wn-header__inner { gap: 16px; }
	.wn-nav__list a { padding: 10px 10px; }
	.wn-hide-md { display: none !important; }
}

@media (max-width: 960px) {
	:root { --wn-header-h: 66px; }
	.wn-site .wn-logo .wn-logo__img { height: 40px; }
	.wn-burger { display: inline-grid; place-items: center; }
	.wn-nav {
		position: fixed;
		inset: var(--wn-nav-top, 66px) 0 0 0;
		margin: 0;
		padding: 20px var(--wn-gutter) 32px;
		background: #fff;
		overflow-y: auto;
		opacity: 0; visibility: hidden; transform: translateY(-8px);
		transition: opacity .2s var(--wn-ease), transform .2s var(--wn-ease), visibility .2s;
	}
	.wn-nav.is-open { opacity: 1; visibility: visible; transform: none; }
	.wn-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.wn-nav__list > li { border-bottom: 1px solid var(--wn-line); }
	.wn-nav__list a { padding: 16px 4px; border-radius: 0; font-size: 1.125rem; font-family: var(--wn-font-display); }
	.wn-nav__list .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 10px 12px; }
	.wn-nav__list .sub-menu a { font-family: var(--wn-font-body); font-size: 1rem; padding: 10px 4px; }
	.wn-nav__mobile-cta { display: grid; gap: 10px; margin-top: 24px; }
	body.wn-nav-open { overflow: hidden; }
}

@media (max-width: 640px) {
	.wn-hide-sm { display: none !important; }
	.wn-topbar__contacts { gap: 14px; }
}

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

.wn-footer {
	background: var(--wn-night);
	color: rgba(255, 255, 255, .68);
	padding: clamp(56px, 7vw, 88px) 0 28px;
	font-size: .9375rem;
}
.wn-footer a { color: rgba(255, 255, 255, .82); text-decoration: none; }
.wn-footer a:hover { color: #fff; }
.wn-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.3fr;
	gap: clamp(28px, 4vw, 56px);
}
.wn-site .wn-footer__brand .wn-logo .wn-logo__img { height: 50px; margin-bottom: 20px; }
.wn-footer__brand p { max-width: 34ch; }
.wn-site .wn-footer__title {
	font-family: var(--wn-font-body);
	color: #fff;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin: 6px 0 18px;
}
.wn-footer__links { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.wn-footer__contact ul { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 14px; }
.wn-footer__contact li { display: flex; gap: 12px; align-items: flex-start; }
.wn-footer__contact .wn-icon { color: var(--wn-accent); margin-top: 4px; }
.wn-footer__contact small { color: rgba(255,255,255,.5); }
.wn-footer .wn-btn--whatsapp { --btn-fg: #fff; --btn-bd: rgba(255,255,255,.25); }
.wn-footer .wn-btn--whatsapp:hover { --btn-bd: var(--wn-whatsapp); }
.wn-social { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; margin: 18px 0 0; padding: 0; font-size: .875rem; }
.wn-footer__bottom {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;
	margin-top: clamp(40px, 5vw, 64px);
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .1);
	font-size: .8125rem;
}
.wn-footer__bottom p { margin: 0; }

@media (max-width: 960px) {
	.wn-footer__grid { grid-template-columns: 1fr 1fr; }
	.wn-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
	.wn-footer__grid { grid-template-columns: 1fr; }
}

/* Default (non-Elementor) content ---------------------------------------- */

.site-main,
.wn-page {
	max-width: var(--wn-container);
	margin-inline: auto;
	padding: clamp(40px, 6vw, 80px) var(--wn-gutter);
	box-sizing: border-box;
}
.site-main .page-header .entry-title { font-size: clamp(2rem, 4vw, 3rem); }
.site-main .page-content,
.site-main .entry-content { max-width: 74ch; }

/* Elementor full-width pages manage their own spacing */
.elementor-page .site-main,
body.elementor-template-full-width .site-main { padding: 0; max-width: none; }

.e-con { --container-max-width: var(--wn-container); }

/* Utilities -------------------------------------------------------------- */

.wn-eyebrow {
	display: inline-flex; align-items: center; gap: 10px;
	margin-bottom: 14px;
	color: var(--wn-accent);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}
.wn-eyebrow::before { content: ""; width: 22px; height: 1.5px; background: currentColor; }

.wn-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--wn-ease), transform .7s var(--wn-ease); }
.wn-reveal.is-visible { opacity: 1; transform: none; }
.elementor-editor-active .wn-reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.wn-reveal { opacity: 1; transform: none; transition: none; }
}
