/*
Theme Name: fecheiservico
Theme URI: https://fecheiservico.com.br
Author: Original Empreendimentos
Description: Tema do marketplace fecheiservico.com.br, feito para o plugin Conecta Pro. Ao ativar, cria as páginas (Início, Como funciona, Para profissionais, Contato, Termos e Privacidade), define a página inicial e aplica o visual às telas do plugin. Compatível com Elementor e Elementor Pro.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: fecheiservico
*/

/* =========================================================
   fecheiservico.com.br: identidade visual global
   Tokens, base, componentes compartilhados e integração com o plugin Conecta Pro.
   As seções (HTML widgets) trazem o próprio CSS escopado e usam estes tokens.
   ========================================================= */
:root {
	--fs-navy: #021571;
	--fs-navy-2: #0a1f8f;
	--fs-ink: #0a1033;
	--fs-blue: #0172f4;
	--fs-blue-2: #0560d6;
	--fs-sky: #0590f9;
	--fs-ice: #eef5ff;
	--fs-mist: #f6f9fe;
	--fs-line: #dbe5f4;
	--fs-muted: #56607f;
	--fs-sun: #ffc83d;
	--fs-ok: #0e8a4f;
	--fs-white: #ffffff;
	--fs-font-display: "Bricolage Grotesque", "Figtree", system-ui, sans-serif;
	--fs-font-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
	--fs-radius: 18px;
	--fs-radius-sm: 12px;
	--fs-shadow: 0 1px 2px rgba(2, 21, 113, .06), 0 8px 24px -8px rgba(2, 21, 113, .14);
	--fs-shadow-lg: 0 2px 4px rgba(2, 21, 113, .05), 0 24px 60px -18px rgba(2, 21, 113, .28);
	--fs-wrap: 1200px;
	--fs-gutter: clamp(18px, 4vw, 32px);
}

body {
	font-family: var(--fs-font-body);
	color: var(--fs-ink);
	background: var(--fs-white);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
body h1, body h2, body h3, body h4 { font-family: var(--fs-font-display); color: var(--fs-ink); letter-spacing: -0.02em; }
body a { color: var(--fs-blue); }
::selection { background: var(--fs-blue); color: #fff; }

/* Cabeçalho fixo (Theme Builder) */
.elementor-location-header { position: sticky; top: 0; z-index: 990; }
.admin-bar .elementor-location-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .elementor-location-header { top: 0; } }

/* Containers das seções: o layout é controlado pelo HTML de cada bloco */
.e-con.fs-sec, .e-con.fs-header, .e-con.fs-footer {
	--padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
	--gap: 0px; --row-gap: 0px; --column-gap: 0px;
	--margin-top: 0px; --margin-bottom: 0px;
}
.fs-sec > .elementor-widget, .fs-sec > .e-con-inner > .elementor-widget { width: 100%; margin: 0 !important; }

/* Wrapper de largura */
.fs-wrap { width: 100%; max-width: calc(var(--fs-wrap) + var(--fs-gutter) * 2); margin: 0 auto; padding: 0 var(--fs-gutter); box-sizing: border-box; }

/* Tipografia de seção */
.fs-eyebrow {
	display: inline-flex; align-items: center; gap: .5em;
	font: 700 .78rem/1 var(--fs-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--fs-blue);
}
.fs-eyebrow::before { content: ""; width: 18px; height: 2px; background: currentColor; border-radius: 2px; }
.fs-title { font: 800 clamp(1.9rem, 1.2rem + 2.6vw, 3rem)/1.05 var(--fs-font-display); margin: .35em 0 .35em; letter-spacing: -0.03em; color: var(--fs-ink); text-wrap: balance; }
.fs-lead { font-size: clamp(1.02rem, .95rem + .3vw, 1.18rem); line-height: 1.6; color: var(--fs-muted); max-width: 60ch; margin: 0; text-wrap: pretty; }
.fs-mark { color: var(--fs-blue); }

/* Botões */
.fs-btn {
	--b-bg: var(--fs-white); --b-fg: var(--fs-ink); --b-bd: var(--fs-line);
	display: inline-flex; align-items: center; justify-content: center; gap: .55em;
	min-height: 48px; padding: .8em 1.4em; border-radius: 999px; border: 1.5px solid var(--b-bd);
	background: var(--b-bg); color: var(--b-fg) !important; text-decoration: none !important;
	font: 700 .98rem/1.1 var(--fs-font-body); letter-spacing: -.005em; cursor: pointer;
	transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
	white-space: nowrap;
}
.fs-btn:hover { transform: translateY(-1px); box-shadow: var(--fs-shadow); border-color: var(--fs-blue); }
.fs-btn:active { transform: translateY(0); }
.fs-btn:focus-visible { outline: 3px solid var(--fs-sun); outline-offset: 2px; }
.fs-btn--primary { --b-bg: var(--fs-blue); --b-fg: #fff; --b-bd: var(--fs-blue); box-shadow: 0 10px 24px -10px rgba(1, 114, 244, .7); }
.fs-btn--primary:hover { --b-bg: var(--fs-blue-2); border-color: var(--fs-blue-2); }
.fs-btn--navy { --b-bg: var(--fs-navy); --b-fg: #fff; --b-bd: var(--fs-navy); }
.fs-btn--ghost-light { --b-bg: transparent; --b-fg: #fff; --b-bd: rgba(255, 255, 255, .35); }
.fs-btn--ghost-light:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }
.fs-btn--sun { --b-bg: var(--fs-sun); --b-fg: var(--fs-navy); --b-bd: var(--fs-sun); }
.fs-btn--lg { min-height: 56px; padding: 1em 1.8em; font-size: 1.05rem; }
.fs-btn svg { width: 1.15em; height: 1.15em; flex: none; }

/* Revelação ao rolar (ativada por JS; sem JS tudo aparece) */
.fs-js .fs-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .7s cubic-bezier(.2, .7, .2, 1); }
.fs-js .fs-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.fs-js .fs-reveal { opacity: 1; transform: none; transition: none; }
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

/* Mostrar/ocultar conforme login (WordPress adiciona .logged-in ao body) */
body.logged-in .fs-guest-only { display: none !important; }
body:not(.logged-in) .fs-user-only { display: none !important; }
body:not(.fs-role-pro) .fs-pro-only { display: none !important; }
body:not(.logged-in) .fs-client-only, body.fs-role-pro .fs-client-only { display: none !important; }

/* =========================================================
   Integração com o plugin Conecta Pro
   ========================================================= */
body .cpro {
	--cpro-accent: var(--fs-blue);
	--cpro-accent-ink: #ffffff;
	--cpro-accent-soft: var(--fs-ice);
	--cpro-ink: var(--fs-ink);
	--cpro-muted: var(--fs-muted);
	--cpro-line: var(--fs-line);
	--cpro-bg: #ffffff;
	--cpro-bg-soft: var(--fs-mist);
	--cpro-radius: var(--fs-radius);
	font-family: var(--fs-font-body);
}
body .cpro h2, body .cpro h3, body .cpro h4 { font-family: var(--fs-font-display); letter-spacing: -0.02em; }
body .cpro h2 { font-weight: 800; }
body .cpro .cpro-btn { border-radius: 999px; font-family: var(--fs-font-body); min-height: 46px; padding-inline: 1.3em; }
body .cpro .cpro-btn--primary { box-shadow: 0 10px 22px -12px rgba(1, 114, 244, .8); }
body .cpro .cpro-btn--primary:hover { filter: none; background: var(--fs-blue-2); border-color: var(--fs-blue-2); }
body .cpro .cpro-btn--lg { min-height: 56px; }
body .cpro .cpro-card { box-shadow: var(--fs-shadow); border-color: transparent; }
body .cpro .cpro-card--accent { box-shadow: 0 0 0 2px var(--fs-blue), var(--fs-shadow); }
body .cpro input[type=text], body .cpro input[type=email], body .cpro input[type=tel], body .cpro input[type=number],
body .cpro input[type=date], body .cpro input[type=password], body .cpro input[type=search], body .cpro select, body .cpro textarea {
	border-radius: 12px; border-color: #c9d6ea; background: #fff; min-height: 50px;
}
body .cpro textarea { min-height: 0; }
body .cpro input:focus, body .cpro select:focus, body .cpro textarea:focus { outline: 3px solid rgba(1, 114, 244, .22); outline-offset: 0; border-color: var(--fs-blue); }
body .cpro .cpro-catgrid__item { border-color: var(--fs-line); box-shadow: 0 1px 0 rgba(2, 21, 113, .04); padding: 1.1em 1.2em 1.1em 3.1em; position: relative; }
body .cpro .cpro-catgrid__item::before {
	content: ""; position: absolute; left: 1.05em; top: 50%; width: 1.35em; height: 1.35em; transform: translateY(-50%);
	border-radius: 7px; background: var(--fs-ice) no-repeat center / 70% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230172f4' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
	transition: background-color .15s;
}
body .cpro .cpro-catgrid__item:hover { box-shadow: var(--fs-shadow); border-color: var(--fs-blue); }
body .cpro .cpro-catgrid__item:hover::before { background-color: #d7e8ff; }
body .cpro .cpro-search input { border-radius: 999px; padding-left: 1.3em; min-height: 56px; font-size: 1.05rem; box-shadow: var(--fs-shadow); border-color: transparent; }
body .cpro .cpro-balance { background: linear-gradient(135deg, var(--fs-navy), var(--fs-blue)); color: #fff !important; }
body .cpro .cpro-balance span { opacity: .85; }
body .cpro .cpro-tabs a.is-active { border-bottom-color: var(--fs-blue); }
body .cpro .cpro-package { box-shadow: var(--fs-shadow); border-color: transparent; background: #fff; }
body .cpro .cpro-lead__cost strong { font-family: var(--fs-font-display); }
body .cpro .cpro-package__credits { font-family: var(--fs-font-display); font-weight: 800; color: var(--fs-navy); }
body .cpro .cpro-intro h2 { font-size: clamp(1.7rem, 1.2rem + 1.8vw, 2.4rem); }
body .cpro .cpro-step { font-family: var(--fs-font-display); }
body .cpro .cpro-choice input:checked + span { background: var(--fs-blue); border-color: var(--fs-blue); }
body .cpro .cpro-stars { color: #f5a800; }
body .cpro .cpro-notice--info { background: var(--fs-ice); border-color: #bcd6fb; color: var(--fs-navy-2); }

/* Formulário de login do WordPress dentro do painel */
body .cpro #loginform p { margin: 0 0 1em; }
body .cpro #loginform label { display: block; font-weight: 600; margin-bottom: .35em; }
body .cpro #loginform input[type=text], body .cpro #loginform input[type=password] { width: 100%; border: 1px solid #c9d6ea; border-radius: 12px; min-height: 50px; padding: .7em .9em; font: inherit; }
body .cpro #loginform .login-remember label { display: flex; gap: .5em; align-items: center; font-weight: 400; }
body .cpro #loginform #wp-submit { width: 100%; min-height: 52px; border: 0; border-radius: 999px; background: var(--fs-blue); color: #fff; font: 700 1rem var(--fs-font-body); cursor: pointer; }
body .cpro #loginform #wp-submit:hover { background: var(--fs-blue-2); }

/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-size: 16px; line-height: 1.6; overflow-x: hidden; }
img, svg, video { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
h1, h2, h3, h4 { margin-top: 0; line-height: 1.15; }
.e-con { display: flex; flex-direction: column; min-width: 0; }
.fs-main { display: block; min-height: 40vh; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.skip-link:focus { clip: auto; width: auto; height: auto; left: 12px; top: 12px; z-index: 100000; background: #fff; padding: 10px 16px; border-radius: 10px; box-shadow: var(--fs-shadow); }

/* ===== Conteúdo comum (páginas sem template, posts) ===== */
.fs-phero--plain { padding-bottom: clamp(40px, 5vw, 64px); }
.fs-content { max-width: calc(820px + var(--fs-gutter) * 2); padding-top: clamp(40px, 5vw, 64px); padding-bottom: clamp(64px, 8vw, 104px); font-family: var(--fs-font-body); color: #2b3354; line-height: 1.75; font-size: 1.04rem; }
.fs-content h2 { font: 800 1.6rem/1.2 var(--fs-font-display); margin: 1.8em 0 .6em; color: var(--fs-ink); }
.fs-content h3 { font: 800 1.25rem/1.25 var(--fs-font-display); margin: 1.6em 0 .5em; color: var(--fs-ink); }
.fs-content img { border-radius: 14px; }
.fs-content blockquote { margin: 1.5em 0; padding: 1em 1.4em; border-left: 4px solid var(--fs-blue); background: var(--fs-mist); border-radius: 0 12px 12px 0; }
.fs-post-item { padding: 24px 0; border-bottom: 1px solid var(--fs-line); }
.fs-post-item h2 { margin: 0 0 4px; font-size: 1.4rem; }
.fs-post-item h2 a { color: var(--fs-ink); text-decoration: none; }
.fs-post-meta { color: var(--fs-muted); font-size: .9rem; margin: 0 0 8px; }

/* ===== Topo das páginas ===== */
/* ===== Topo das páginas internas ===== */
.fs-phero { position: relative; overflow: hidden; isolation: isolate; font-family: var(--fs-font-body); background: var(--fs-ice, #eef5ff); padding: clamp(56px, 7vw, 96px) 0 clamp(56px, 7vw, 90px); }
.fs-phero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(1,114,244,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(1,114,244,.09) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: radial-gradient(ellipse 70% 90% at 80% 30%, #000 20%, transparent 70%); mask-image: radial-gradient(ellipse 70% 90% at 80% 30%, #000 20%, transparent 70%); }
.fs-phero::after { content: ""; position: absolute; z-index: -1; width: 560px; height: 560px; right: -140px; top: -220px; border-radius: 50%; background: radial-gradient(circle, rgba(5,144,249,.28), transparent 65%); }
.fs-phero--dark { background: var(--fs-navy, #021571); color: #fff; }
.fs-phero--dark::before { background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); }
.fs-phero--dark::after { background: radial-gradient(circle, rgba(5,144,249,.5), transparent 65%); }
.fs-phero h1 { font: 800 clamp(2.2rem, 1.3rem + 3.4vw, 3.8rem)/1.02 var(--fs-font-display) !important; letter-spacing: -0.04em; margin: 16px 0 18px !important; max-width: 18ch; color: var(--fs-ink, #0a1033); text-wrap: balance; }
.fs-phero--dark h1 { color: #fff !important; }
.fs-phero--dark .fs-eyebrow { color: var(--fs-sun, #ffc83d); }
.fs-phero p.fs-lead { max-width: 58ch; }
.fs-phero--dark p.fs-lead { color: #c9d4f5; }
.fs-phero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.fs-phero--compact { padding: clamp(40px, 5vw, 64px) 0 clamp(80px, 9vw, 120px); }
.fs-phero--compact h1 { font-size: clamp(1.9rem, 1.2rem + 2.4vw, 2.9rem) !important; margin-bottom: 10px !important; }