/*
Theme Name: Alimente Sua Fé (Kadence Child)
Template: kadence
Description: Child theme do Kadence para o app devocional Alimente Sua Fé.
Version: 0.2.0
Text Domain: kadence-child
*/

/* =========================================================================
   TOKENS — extraídos do design original (Base44)
   ========================================================================= */
:root {
	--asf-blue-start: #2f5bd7;
	--asf-blue-end: #16266b;
	--asf-navy: #101d4a;
	--asf-navy-2: #14204d;
	--asf-gold: #f5a623;
	--asf-gold-dark: #dd930f;
	--asf-bg-soft: #f4f6fb;
	--asf-white: #ffffff;
	--asf-text-muted: #6b7280;
	--asf-text-on-blue: #c9d3f5;
	--asf-badge-bg: #eef1fc;
	--asf-badge-text: #33417a;
	--asf-border: #e6e9f2;
	--asf-shadow: 0 4px 20px rgba(16, 29, 74, 0.08);
	--asf-shadow-lg: 0 12px 40px rgba(16, 29, 74, 0.16);
	--asf-font-heading: 'Poppins', 'Segoe UI', sans-serif;
	--asf-font-body: 'Inter', 'Segoe UI', sans-serif;

	/* --- ESCALA DE TIPOGRAFIA ---------------------------------------------
	   Valores medidos um a um no app original (getComputedStyle), em px
	   absolutos de propósito: em/rem herdam do root de 17px do Kadence e
	   faziam cada card crescer sozinho (os cards diários estavam com 750px
	   de altura contra 413px do original). Use SEMPRE estas variáveis nos
	   cards — nada de tamanho solto card a card. */
	--asf-fs-hero: 44px;   /* h1 do hero */
	--asf-fs-xxl: 30px;    /* número grande (sequência diária) */
	--asf-fs-xl: 20px;     /* citação do card do hero */
	--asf-fs-lg: 18px;     /* descrição do hero */
	--asf-fs-md: 16px;     /* corpo, referência do hero, título de seção */
	--asf-fs-sm: 14px;     /* título de card, rótulos, botão principal */
	--asf-fs-xs: 12px;     /* excerpt, badge, botões secundários, lista da sidebar */
	--asf-fs-2xs: 10px;    /* referência dentro do card, badge na mídia, botão "Ler" */

	--asf-fw-normal: 400;
	--asf-fw-medium: 500;
	--asf-fw-semibold: 600;
	--asf-fw-bold: 700;

	/* --- ESCALA DE ESPAÇAMENTO --- */
	--asf-space-2xs: 4px;
	--asf-space-xs: 6px;
	--asf-space-sm: 8px;
	--asf-space-md: 12px;
	--asf-space-lg: 16px;
	--asf-space-xl: 20px;
	--asf-space-2xl: 28px;

	/* --- RAIOS --- */
	--asf-radius-sm: 10px;
	--asf-radius-md: 12px;
	--asf-radius-lg: 16px;
	--asf-radius-pill: 9999px;

	/* --- CARDS (mesmas medidas pra hero, diários, explore e sidebar) --- */
	--asf-card-pad: 16px;        /* corpo dos cards diários e quicknav */
	--asf-card-pad-lg: 20px;     /* cards da sidebar */
	--asf-card-pad-hero: 28px;   /* card do versículo no hero */
	--asf-card-media-h: 96px;    /* faixa de imagem no topo do card diário */
	--asf-grid-gap: 16px;        /* espaço entre cards em qualquer grid */
}

body {
	font-family: var(--asf-font-body);
	color: var(--asf-navy-2);
	background: var(--asf-bg-soft);
}

h1, h2, h3, h4, .asf-heading {
	font-family: var(--asf-font-heading);
	color: var(--asf-navy-2);
	font-weight: 700;
}

a { color: var(--asf-blue-start); }

.asf-container {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 var(--asf-space-xl);
}

/* --- Utilitários de texto: use estes em vez de font-size inline solto ----
   Antes cada template tinha "style=font-size:0.85em" etc, o que fazia o
   mesmo tipo de texto ter tamanhos diferentes em cada página. */
.asf-link-sm { font-size: var(--asf-fs-xs); font-weight: var(--asf-fw-semibold); text-decoration: none; }
.asf-text-sm { font-size: var(--asf-fs-sm); }
.asf-text-xs { font-size: var(--asf-fs-xs); }
.asf-note {
	font-size: var(--asf-fs-xs);
	color: var(--asf-text-muted);
	line-height: 1.5;
}
.asf-single-title { font-size: var(--asf-fs-lg); margin: 0 0 var(--asf-space-sm); }
.asf-auth-logo {
	width: 64px; height: 64px; border-radius: 50%;
	background: var(--asf-navy); color: var(--asf-gold);
	display: flex; align-items: center; justify-content: center;
	font-size: var(--asf-fs-xl); margin: 0 auto var(--asf-space-xl);
}

/* =========================================================================
   HEADER
   ========================================================================= */
.asf-header {
	background: linear-gradient(120deg, var(--asf-blue-start) 0%, var(--asf-navy) 100%);
	position: sticky;
	top: 0;
	z-index: 100;
}
.asf-header__inner {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0.9em 1.25em;
	display: flex;
	align-items: center;
	gap: 1.5em;
}
.asf-logo {
	display: flex;
	align-items: center;
	gap: 0.6em;
	text-decoration: none;
	font-family: var(--asf-font-heading);
	font-weight: 800;
	font-size: 1.15em;
	color: var(--asf-white);
	white-space: nowrap;
}
.asf-logo__mark {
	width: 36px;
	height: 36px;
	border-radius: 10px;
	overflow: hidden;
	background: #0c1633;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1em;
}
.asf-logo__accent { color: var(--asf-gold); }
/* Cor fixa: sem isso o "Alimente" herdava a cor de hover dos links do Kadence
   (o "Sua Fé" não mudava porque tem cor própria). */
.asf-logo:hover,
.asf-logo:focus,
.asf-logo:active,
.asf-logo:visited { color: var(--asf-white); }

/* Logo enviado em Identidade do site: o arquivo é um quadrado com a chama
   pequena no centro, então a imagem é ampliada pra chama preencher o selo. */
.asf-logo__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.4);
}

.asf-nav {
	flex-grow: 1;
	display: flex;
	justify-content: flex-end;
	gap: 0.2em;
}
.asf-nav ul {
	display: flex;
	align-items: center;
	gap: 0.15em;
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
}
.asf-nav a {
	display: inline-block;
	color: var(--asf-text-on-blue);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.92em;
	padding: 0.55em 0.9em;
	border-radius: var(--asf-radius-pill);
	white-space: nowrap;
}
.asf-nav a:hover { color: var(--asf-white); }
.asf-nav li.current-menu-item a,
.asf-nav li.current-menu-parent a {
	background: var(--asf-gold);
	color: var(--asf-navy);
}
.asf-nav .asf-soon-tag {
	font-size: 0.65em;
	vertical-align: super;
	opacity: 0.8;
}

.asf-header__actions {
	display: flex;
	align-items: center;
	gap: 0.7em;
	flex-shrink: 0;
	position: relative;
}
.asf-icon-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--asf-white);
	background: transparent;
	border: none;
	cursor: pointer;
	text-decoration: none;
	font-size: 1.05em;
}
/* O SVG do ícone de busca estava sendo espremido (viramos 2px de largura) por
   alguma regra do Kadence que a gente não conseguiu isolar exatamente na
   cascata — flex-shrink:0 + tamanho explícito aqui resolve na raiz, com
   prioridade garantida por especificidade de classe (carrega depois do
   parente de qualquer forma). */
.asf-icon-btn svg {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}
.asf-icon-btn:hover { background: rgba(255,255,255,0.12); }
.asf-avatar {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--asf-gold);
	color: var(--asf-navy);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 0.85em;
	text-decoration: none;
}
/* Menu da conta: o avatar abre um dropdown com "Meu Perfil" e "Sair". A setinha
   ao lado sinaliza que é clicável (antes era um link sem nenhuma indicação). */
.asf-account { position: relative; }
.asf-account__toggle {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 999px;
	color: var(--asf-white);
	cursor: pointer;
}
.asf-account__toggle:hover .asf-avatar,
.asf-account__toggle:focus-visible .asf-avatar,
.asf-account__toggle[aria-expanded="true"] .asf-avatar { box-shadow: 0 0 0 3px rgba(255,255,255,0.28); }
.asf-account__chevron {
	width: 16px;
	height: 16px;
	opacity: 0.85;
	transition: transform 0.15s ease;
}
.asf-account__toggle[aria-expanded="true"] .asf-account__chevron { transform: rotate(180deg); }
.asf-account__menu {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 120;
	min-width: 190px;
	padding: 6px;
	background: var(--asf-white);
	border-radius: var(--asf-radius-md);
	box-shadow: var(--asf-shadow-lg);
}
.asf-account__menu[hidden] { display: none; }
.asf-account__hello {
	max-width: 240px;
	margin: 0 0 4px;
	padding: 8px 10px;
	border-bottom: 1px solid #eef0f6;
	color: #6b7280;
	font-size: var(--asf-fs-xs);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.asf-account__item,
.asf-account__item:visited {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 10px;
	border-radius: var(--asf-radius-sm);
	color: var(--asf-navy);
	font-size: var(--asf-fs-sm);
	font-weight: 600;
	text-decoration: none;
}
.asf-account__item:hover,
.asf-account__item:focus-visible { background: #f1f4fb; color: var(--asf-navy); }
.asf-account__item .asf-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	color: #6b7280;
}

/* Sair no header: só o ícone (seta saindo do quadrado), sem fundo nem círculo.
   No hover apenas clareia — sem o fundo dos outros ícones e sem a cor de link do Kadence. */
.asf-icon-btn--plain,
.asf-icon-btn--plain:visited {
	width: auto;
	padding: 6px;
	border-radius: 0;
	color: var(--asf-text-on-blue);
}
.asf-icon-btn--plain:hover,
.asf-icon-btn--plain:focus-visible {
	background: transparent;
	color: var(--asf-white);
}

.asf-btn-entrar {
	background: var(--asf-gold);
	color: var(--asf-navy);
	font-weight: 700;
	padding: 0.55em 1.3em;
	border-radius: var(--asf-radius-pill);
	text-decoration: none;
	font-size: 0.92em;
	white-space: nowrap;
}

.asf-header-search {
	position: absolute;
	top: 48px;
	right: 0;
	background: var(--asf-white);
	border-radius: var(--asf-radius-md);
	box-shadow: var(--asf-shadow-lg);
	padding: 0.6em;
	width: 280px;
}
.asf-header-search input {
	width: 100%;
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-pill);
	padding: 0.6em 1em;
	font-family: var(--asf-font-body);
}

.asf-menu-toggle {
	display: none;
	background: none;
	border: none;
	color: var(--asf-white);
	font-size: 1.4em;
	cursor: pointer;
}
.asf-mobile-nav {
	background: var(--asf-navy);
	padding: 0.5em 1.25em 1em;
}
.asf-mobile-nav ul { list-style: none; margin: 0; padding: 0; }
.asf-mobile-nav a {
	display: block;
	color: var(--asf-text-on-blue);
	text-decoration: none;
	padding: 0.7em 0.2em;
	border-bottom: 1px solid rgba(255,255,255,0.08);
	font-weight: 600;
}
.asf-mobile-nav li.current-menu-item a { color: var(--asf-gold); }
.asf-mobile-nav__conta {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid rgba(255,255,255,0.12);
}
/* Itens do menu ☰ que só aparecem no celular (busca e favoritos saem do header). */
.asf-mobile-nav .asf-so-celular { display: none; }
.asf-mobile-nav__busca { padding: 0.6em 0 0.4em; }
/* Seletor reforçado: o global.min.css do Kadence carrega depois deste arquivo
   e estiliza input[type="search"] com a mesma especificidade. */
.asf-mobile-nav .asf-mobile-nav__busca input[type="search"] {
	width: 100%;
	box-sizing: border-box;
	padding: 0.65em 0.9em;
	border: 1px solid rgba(255,255,255,0.18);
	border-radius: var(--asf-radius-md);
	background: rgba(255,255,255,0.08);
	color: var(--asf-white);
	font-size: 16px; /* 16px evita o zoom automático do iOS ao focar o campo */
}
.asf-mobile-nav .asf-mobile-nav__busca input[type="search"]::placeholder {
	color: var(--asf-text-on-blue);
	opacity: 0.85;
}

@media (max-width: 960px) {
	.asf-nav { display: none; }
	.asf-menu-toggle { display: block; }
}

/* Celular: o header não cabia (logo + ícones passavam da largura da tela e a
   página inteira ganhava rolagem lateral). O nome da marca fica, com letra
   menor; busca, favoritos e o ícone de sair vão pro menu ☰ (o Sair também
   continua no menu do avatar). */
@media (max-width: 560px) {
	.asf-header__inner { padding: 0.75em 0.9em; gap: 0.75em; }
	.asf-logo { font-size: 0.95em; gap: 0.45em; }
	.asf-logo__mark { width: 32px; height: 32px; border-radius: 9px; }
	.asf-header__actions { gap: 0.5em; margin-left: auto; }
	.asf-header__actions [data-asf-search-toggle],
	.asf-header__actions [data-asf-search-box],
	.asf-header__actions .asf-icon-btn--fav,
	.asf-header__actions .asf-icon-btn--plain { display: none; }
	.asf-btn-entrar { padding: 0.5em 1em; font-size: 0.85em; }
	.asf-mobile-nav { padding-left: 0.9em; padding-right: 0.9em; }
	.asf-mobile-nav .asf-so-celular { display: block; }
}

/* Telas bem estreitas (até 360px, ex.: iPhone SE de 1ª geração com 320px):
   aperta mais um pouco o header pra continuar sem rolagem lateral. */
@media (max-width: 360px) {
	.asf-header__inner { padding-left: 0.7em; padding-right: 0.7em; gap: 0.5em; }
	.asf-logo { font-size: 0.82em; }
	.asf-btn-entrar { padding: 0.45em 0.8em; font-size: 0.8em; }
}

/* =========================================================================
   BOTÕES
   ========================================================================= */
.asf-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--asf-space-sm);
	justify-content: center;
	font-family: var(--asf-font-heading);
	font-weight: var(--asf-fw-medium);
	font-size: var(--asf-fs-sm);
	line-height: 1.2;
	padding: var(--asf-space-sm) var(--asf-space-lg);
	border-radius: var(--asf-radius-md);
	text-decoration: none;
	border: none;
	cursor: pointer;
}
.asf-btn-primary { background: var(--asf-gold); color: var(--asf-navy); }
.asf-btn-primary:hover { background: var(--asf-gold-dark); }
.asf-btn-outline-light {
	background: transparent;
	border: 1.5px solid rgba(255,255,255,0.55);
	color: var(--asf-white);
}
.asf-btn-outline-light:hover { background: rgba(255,255,255,0.12); }
.asf-btn-outline-light[disabled] { cursor: not-allowed; opacity: 0.65; }
/* 2º botão do hero (Ouvir/Entrar para ouvir): fundo claro SÓLIDO, diferente
   do "Explorar Conteúdo" (que é só contorno) — igual ao Base44, onde os
   2 botões do hero têm pesos visuais diferentes um do outro. */
.asf-btn-fill-light { background: rgba(255,255,255,0.92); color: var(--asf-navy); }
.asf-btn-fill-light:hover { background: var(--asf-white); }
.asf-btn-fill-light[disabled] { cursor: not-allowed; opacity: 0.7; background: rgba(255,255,255,0.6); }
/* ghost define só COR — tamanho vem de .asf-btn (padrão) ou dos
   modificadores .asf-btn-sm / .asf-btn-xs. Misturar cor e tamanho na mesma
   classe era o que fazia cada card ter um tamanho de botão diferente. */
.asf-btn-ghost {
	background: rgba(16,29,74,0.06);
	color: var(--asf-navy-2);
}
.asf-btn-ghost[disabled],
.asf-btn-ghost.is-locked { cursor: not-allowed; opacity: 0.65; }
.asf-btn-full { width: 100%; }
/* Botão pequeno: mesma medida do original (10px, pad 4/8) — usado no "Ler". */
.asf-btn-sm {
	font-size: var(--asf-fs-xs);
	padding: var(--asf-space-xs) var(--asf-space-md);
	border-radius: var(--asf-radius-md);
}
.asf-btn-xs {
	font-size: var(--asf-fs-2xs);
	padding: var(--asf-space-2xs) var(--asf-space-sm);
	border-radius: var(--asf-radius-sm);
	gap: var(--asf-space-2xs);
}

/* =========================================================================
   HERO — home (com foto) e páginas internas (gradiente liso)
   ========================================================================= */
.asf-hero-home {
	/* Foto real (Unsplash, licença gratuita, baixada e salva em
	   wp-content/uploads/asf-images/) por baixo do gradiente azul. Caminho
	   relativo à pasta do tema: wp-content/themes/kadence-child/ -> uploads/.
	   Overlay mais leve no meio (onde fica a Bíblia) e um pouco mais denso à
	   esquerda, pra foto aparecer sem perder a leitura do título. */
	background-color: var(--asf-navy);
	background-image:
		linear-gradient(120deg, rgba(23,38,90,0.80) 0%, rgba(10,17,45,0.70) 55%, rgba(8,14,38,0.80) 100%),
		url("../../uploads/asf-images/hero-bible.jpg");
	background-size: cover, cover;
	background-position: center, center 35%;
	background-repeat: no-repeat, no-repeat;
	padding: 3em 0;
}
.asf-hero-home__grid {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 2.5em;
	align-items: center;
}
.asf-hero-home__eyebrow {
	color: var(--asf-gold);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-semibold);
	margin: 0 0 var(--asf-space-2xs);
}
.asf-hero-home__sub {
	color: var(--asf-text-on-blue);
	font-size: var(--asf-fs-sm);
	margin: 0 0 var(--asf-space-lg);
}
.asf-hero-home__title {
	font-size: clamp(28px, 3.4vw, var(--asf-fs-hero));
	color: var(--asf-white);
	line-height: 1.15;
	margin: 0 0 var(--asf-space-lg);
}
.asf-hero-home__desc {
	color: var(--asf-text-on-blue);
	font-size: var(--asf-fs-lg);
	max-width: 44ch;
	margin: 0 0 var(--asf-space-2xl);
}
.asf-hero-home__actions { display: flex; gap: var(--asf-space-md); flex-wrap: wrap; }

.asf-verse-card {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow-lg);
	padding: var(--asf-card-pad-hero);
}
.asf-verse-card__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--asf-space-lg);
}
.asf-verse-card__label {
	display: inline-flex;
	align-items: center;
	gap: var(--asf-space-sm);
	color: var(--asf-gold-dark);
	font-weight: var(--asf-fw-semibold);
	font-size: var(--asf-fs-sm);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.asf-badge {
	background: var(--asf-badge-bg);
	color: var(--asf-badge-text);
	font-size: var(--asf-fs-xs);
	font-weight: var(--asf-fw-medium);
	padding: var(--asf-space-2xs) var(--asf-space-md);
	border-radius: var(--asf-radius-pill);
	display: inline-block;
	line-height: 1.35;
}
.asf-verse-card__text {
	font-style: italic;
	font-size: var(--asf-fs-xl);
	line-height: 1.45;
	margin: 0 0 var(--asf-space-md);
}
.asf-verse-card__ref {
	color: var(--asf-gold-dark);
	font-size: var(--asf-fs-md);
	font-weight: var(--asf-fw-semibold);
	margin: 0 0 var(--asf-space-lg);
}
.asf-verse-card__actions { display: flex; gap: var(--asf-space-xs); flex-wrap: wrap; margin-bottom: var(--asf-space-sm); }
.asf-verse-card__more {
	text-align: right;
	font-weight: var(--asf-fw-semibold);
	font-size: var(--asf-fs-xs);
	color: var(--asf-gold-dark);
	text-decoration: none;
	display: block;
}

/* Variante escura/semi-transparente do card, usada só no hero da home
   (flutuando sobre a foto de fundo) — o card "solto" em outras páginas
   (single.php) continua claro, como os demais cards do site. */
.asf-verse-card--hero {
	background: rgba(16, 25, 58, 0.55);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,0.15);
	color: var(--asf-white);
}
.asf-verse-card--hero .asf-verse-card__label { color: var(--asf-gold); }
.asf-verse-card--hero .asf-verse-card__text { color: var(--asf-white); }
.asf-verse-card--hero .asf-verse-card__ref { color: var(--asf-gold); }
.asf-verse-card--hero .asf-badge { background: rgba(255,255,255,0.16); color: var(--asf-white); }
.asf-verse-card--hero .asf-btn-ghost { background: rgba(255,255,255,0.12); color: var(--asf-white); opacity: 1; }
/* .asf-hero-home na frente só pra ganhar em especificidade da regra
   genérica ".asf-hero-home .asf-favorite-btn" lá embaixo (mesmas 2 classes
   → empataria e a de baixo venceria por ordem, deixando o coração
   invisível — cor escura em cima do hero escuro). */
.asf-hero-home .asf-verse-card--hero .asf-favorite-btn { color: rgba(255,255,255,0.6); }
.asf-hero-home .asf-verse-card--hero .asf-favorite-btn.is-favorite { color: var(--asf-gold); }

.asf-hero-inner {
	background: linear-gradient(120deg, var(--asf-blue-start) 0%, var(--asf-navy) 100%);
	padding: 2.4em 0;
}
.asf-hero-inner__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1em; flex-wrap: wrap; }
.asf-hero-inner h1 { color: var(--asf-white); font-size: 2em; margin: 0 0 0.2em; }
.asf-hero-inner p.asf-hero-inner__sub { color: var(--asf-text-on-blue); margin: 0; }
.asf-hero-inner__icon {
	width: 56px; height: 56px; border-radius: 50%; background: var(--asf-gold);
	display: flex; align-items: center; justify-content: center; font-size: 1.5em; margin: 0 auto 1em;
}
.asf-hero-inner--center { text-align: center; }
/* precisa do `p` pra empatar em especificidade com ".asf-hero-inner
   p.asf-hero-inner__sub" acima (que zera a margem) — senão a margem auto
   não aplica e o texto, mesmo com text-align center, fica num bloco 60ch
   encostado à esquerda. */
.asf-hero-inner--center p.asf-hero-inner__sub { max-width: 60ch; margin: 0.5em auto 0; }

/* =========================================================================
   MOMENTO — página /momento/{humor}/: conteúdo real por humor (sem IA),
   4 cards empilhados (versículo, oração, reflexão, frase) + temas relacionados.
   ========================================================================= */
.asf-momento-hero__emoji { display: block; font-size: 3em; line-height: 1; margin: var(--asf-space-md) 0 var(--asf-space-sm); }

.asf-momento-cards {
	display: flex;
	flex-direction: column;
	gap: var(--asf-space-2xl);
	max-width: 720px;
	margin: var(--asf-space-2xl) auto;
}
.asf-momento-card {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow-lg);
	padding: var(--asf-card-pad-hero);
}
.asf-momento-card--vazio { text-align: center; }
.asf-momento-card__top {
	display: flex;
	align-items: center;
	gap: var(--asf-space-sm);
	margin-bottom: var(--asf-space-lg);
}
.asf-momento-card__icon {
	width: 40px;
	height: 40px;
	border-radius: var(--asf-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--asf-fs-lg);
	color: var(--asf-white);
	flex-shrink: 0;
}
.asf-momento-card__label {
	flex-grow: 1;
	font-weight: var(--asf-fw-semibold);
	color: var(--asf-navy-2);
	font-size: var(--asf-fs-sm);
}
.asf-momento-card__badge { flex-shrink: 0; }
.asf-momento-card__title {
	font-weight: var(--asf-fw-bold);
	font-size: var(--asf-fs-md);
	color: var(--asf-navy);
	margin: 0 0 var(--asf-space-sm);
}
.asf-momento-card__text {
	font-style: italic;
	font-size: var(--asf-fs-xl);
	line-height: 1.45;
	margin: 0 0 var(--asf-space-md);
}
.asf-momento-card__ref {
	color: var(--asf-gold-dark);
	font-size: var(--asf-fs-md);
	font-weight: var(--asf-fw-semibold);
	margin: 0 0 var(--asf-space-lg);
}
.asf-momento-card__leiamais { color: var(--asf-gold-dark); }

.asf-related-moods {
	max-width: 720px;
	margin: 0 auto var(--asf-space-2xl);
	text-align: center;
}
.asf-related-moods h2 { font-size: var(--asf-fs-md); margin: 0 0 var(--asf-space-lg); }
.asf-related-moods__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--asf-space-sm);
}
.asf-related-moods__list a {
	padding: var(--asf-space-sm) var(--asf-space-lg);
	border-radius: var(--asf-radius-pill);
	border: 1.5px solid var(--asf-border);
	text-decoration: none;
	font-size: var(--asf-fs-xs);
	font-weight: var(--asf-fw-medium);
	color: var(--asf-navy-2);
	background: var(--asf-white);
}
.asf-related-moods__list a:hover { border-color: var(--asf-gold); color: var(--asf-gold-dark); }

.asf-search-bar {
	display: flex;
	gap: 0.6em;
	background: var(--asf-white);
	border-radius: var(--asf-radius-pill);
	padding: 0.4em;
	box-shadow: var(--asf-shadow);
	margin-top: 1.6em;
	max-width: 720px;
}
.asf-search-bar input {
	flex-grow: 1;
	border: none;
	padding: 0.7em 1em;
	font-family: var(--asf-font-body);
	background: transparent;
}
.asf-search-bar input:focus { outline: none; }

/* =========================================================================
   QUICK NAV (ícones logo abaixo do hero da home)
   ========================================================================= */
.asf-quicknav {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: var(--asf-grid-gap);
	/* Agora é a 1ª linha da coluna esquerda (dentro de .asf-home-grid), não
	   mais uma faixa de largura total sozinha — sem margem em cima, pra
	   começar exatamente na mesma altura da sidebar (align-items:start). */
	margin: 0 0 var(--asf-space-2xl);
}
.asf-quicknav__item {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-card-pad);
	text-align: center;
	text-decoration: none;
	color: var(--asf-navy-2);
	position: relative;
}
.asf-quicknav__icon {
	width: 40px; height: 40px; border-radius: var(--asf-radius-md);
	display: flex; align-items: center; justify-content: center;
	margin: 0 auto var(--asf-space-sm); font-size: var(--asf-fs-lg);
}
.asf-quicknav__title { font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-sm); display: block; }
.asf-quicknav__sub { font-size: var(--asf-fs-xs); color: var(--asf-text-muted); }
.asf-quicknav__soon {
	position: absolute; top: var(--asf-space-sm); right: var(--asf-space-sm);
	font-size: var(--asf-fs-2xs); background: var(--asf-badge-bg); color: var(--asf-badge-text);
	padding: 2px var(--asf-space-sm); border-radius: var(--asf-radius-pill); font-weight: var(--asf-fw-medium);
}

/* =========================================================================
   LAYOUT COM SIDEBAR (home)
   ========================================================================= */
.asf-home-grid {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: var(--asf-space-2xl);
	align-items: start;
	margin: var(--asf-space-2xl) 0;
}
.asf-section-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 var(--asf-space-lg);
}
.asf-section-title h2 { margin: 0; font-size: var(--asf-fs-lg); }
.asf-section-title a { font-weight: var(--asf-fw-medium); font-size: var(--asf-fs-xs); text-decoration: none; }

.asf-sidebar-card {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-card-pad-lg);
	margin-bottom: var(--asf-grid-gap);
	font-size: var(--asf-fs-sm);
}
.asf-streak-card { text-align: center; }
.asf-streak-card__label { font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-sm); display: flex; align-items: center; justify-content: center; gap: var(--asf-space-sm); }
.asf-streak-card__ring {
	width: 84px; height: 84px; border-radius: 50%;
	border: 6px solid var(--asf-badge-bg);
	display: flex; align-items: center; justify-content: center;
	margin: var(--asf-space-md) auto var(--asf-space-sm);
}
.asf-streak-card__num { font-size: var(--asf-fs-xxl); font-weight: var(--asf-fw-bold); }
.asf-streak-card__sub { font-size: var(--asf-fs-xs); color: var(--asf-text-muted); }
.asf-streak-card__cta { color: var(--asf-gold-dark); font-weight: var(--asf-fw-medium); font-size: var(--asf-fs-xs); margin-top: var(--asf-space-md); }

.asf-progress-list { list-style: none; margin: var(--asf-space-md) 0 0; padding: 0; }
.asf-progress-list li {
	display: flex; align-items: center; gap: var(--asf-space-sm);
	padding: var(--asf-space-sm) 0; border-bottom: 1px solid var(--asf-border);
	font-size: var(--asf-fs-xs);
}
.asf-progress-list li:last-child { border-bottom: none; }
.asf-progress-list .asf-progress-num { margin-left: auto; font-weight: 800; }

.asf-premium-card {
	background: linear-gradient(120deg, var(--asf-blue-start), var(--asf-navy));
	color: var(--asf-white);
	text-align: center;
}
.asf-premium-card h3 { color: var(--asf-white); margin: var(--asf-space-sm) 0 var(--asf-space-2xs); font-size: var(--asf-fs-sm); }
.asf-premium-card p { color: var(--asf-text-on-blue); font-size: var(--asf-fs-xs); line-height: 1.5; margin: 0 0 var(--asf-space-lg); }
.asf-premium-card__icon { font-size: var(--asf-fs-xl); }

.asf-testimonial { padding: var(--asf-space-md) 0; border-bottom: 1px solid var(--asf-border); }
.asf-testimonial:last-child { border-bottom: none; }
.asf-testimonial__stars { color: var(--asf-gold); font-size: var(--asf-fs-xs); margin-bottom: var(--asf-space-2xs); }
.asf-testimonial__quote { font-size: var(--asf-fs-xs); line-height: 1.5; font-style: italic; margin: 0 0 var(--asf-space-sm); color: var(--asf-text-muted); }
.asf-testimonial__author { display: flex; align-items: center; gap: var(--asf-space-sm); font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-xs); }
.asf-testimonial__avatar {
	width: 28px; height: 28px; border-radius: 50%;
	background: var(--asf-badge-bg); color: var(--asf-badge-text);
	display: flex; align-items: center; justify-content: center;
	font-size: var(--asf-fs-2xs); font-weight: var(--asf-fw-bold);
	flex-shrink: 0;
}
/* Quando tiver foto real do depoimento (ver front-page.php, array
   $depoimentos), essa modificadora troca o círculo de iniciais por uma
   foto de verdade, mesmo tamanho/formato. */
.asf-testimonial__avatar--foto { object-fit: cover; background: none; }

/* =========================================================================
   CARDS DE CONTEÚDO (versículo/oração/reflexão do dia + listagens)
   ========================================================================= */
.asf-today-grid {
	display: grid;
	/* minmax 250px (não 215px) pra caber só 4 por linha no container de
	   1180px, não 5 — Reflexões/Frases pedem cards maiores (Luiz, 2026-09-27).
	   .asf-home-grid abaixo tem seu próprio override fixo de 4 colunas, então
	   não depende deste valor base. */
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: var(--asf-grid-gap);
}
/* Na home, ao lado da barra lateral (streak/progresso/premium), força os 4
   cards "preparado para hoje" a caberem numa linha só, lado a lado com a
   barra — é isso que o auto-fit/minmax sozinho não conseguia (o 4º card
   quebrava pra linha de baixo por falta de espaço com a sidebar ocupando
   300px). Só vale a partir de 901px, onde o .asf-home-grid ainda é 2
   colunas — abaixo disso a home vira 1 coluna e o grid solto volta a decidir. */
@media (min-width: 901px) {
	.asf-home-grid .asf-today-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--asf-space-md);
	}
}
.asf-content-card {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.asf-content-card__media {
	height: var(--asf-card-media-h);
	position: relative;
	display: flex;
	align-items: flex-end;
	padding: var(--asf-space-sm);
}
.asf-content-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Badge sobre a imagem é a versão menor (10px), como no original */
.asf-content-card__media .asf-badge {
	position: relative;
	z-index: 1;
	font-size: var(--asf-fs-2xs);
	padding: 2px var(--asf-space-sm);
	background: rgba(255,255,255,0.92);
}
.asf-content-card__body {
	padding: var(--asf-card-pad);
	display: flex;
	flex-direction: column;
	gap: var(--asf-space-xs);
	flex-grow: 1;
}
/* Título e excerpt são cortados em nº fixo de linhas, como no original —
   sem isso um texto longo estica o card e quebra o alinhamento da fileira
   (era o que deixava os cards com 750px de altura contra 413px do original). */
.asf-content-card__title {
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-semibold);
	line-height: 1.3;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.asf-content-card__excerpt {
	font-size: var(--asf-fs-sm);
	line-height: 1.55;
	color: var(--asf-text-muted);
	font-style: italic;
	flex-grow: 1;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.asf-content-card__ref { color: var(--asf-gold-dark); font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-2xs); margin: 0; }
.asf-content-card__actions { display: flex; gap: var(--asf-space-xs); flex-wrap: wrap; margin-top: var(--asf-space-2xs); }
.asf-content-card__footer { display: flex; align-items: center; justify-content: space-between; margin-top: var(--asf-space-2xs); }
.asf-content-card__footer a { font-weight: var(--asf-fw-medium); font-size: var(--asf-fs-xs); text-decoration: none; }

/* Gradientes decorativos por categoria (fallback quando não há image_url) */
.asf-grad-amor       { background: linear-gradient(120deg,#e0245e,#a3123f); }
.asf-grad-esperanca   { background: linear-gradient(120deg,#2f8fd7,#16266b); }
.asf-grad-fe          { background: linear-gradient(120deg,#5a3ce6,#2a1a80); }
.asf-grad-forca       { background: linear-gradient(120deg,#e6742f,#a3420f); }
.asf-grad-gratidao    { background: linear-gradient(120deg,#2fb787,#0f6b4d); }
.asf-grad-paz         { background: linear-gradient(120deg,#3c9de6,#1a4f8f); }
.asf-grad-protecao    { background: linear-gradient(120deg,#4a5568,#1a202c); }
.asf-grad-proposito   { background: linear-gradient(120deg,#f5a623,#b3740c); }
.asf-grad-sabedoria   { background: linear-gradient(120deg,#7c5ce6,#3d2a80); }
.asf-grad-devocao     { background: linear-gradient(120deg,#d7318f,#821c58); }
.asf-grad-motivacao   { background: linear-gradient(120deg,#e6b800,#8f7300); }
.asf-grad-cura        { background: linear-gradient(120deg,#2fb7b7,#0f6b6b); }
.asf-grad-familia     { background: linear-gradient(120deg,#e67ea3,#a3315e); }
.asf-grad-trabalho    { background: linear-gradient(120deg,#607d8b,#37474f); }

.asf-quote-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.1em;
}
.asf-quote-card {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	border: 2px solid transparent;
	padding: var(--asf-card-pad-lg);
	display: flex;
	flex-direction: column;
	gap: var(--asf-space-md);
}
.asf-quote-card.is-featured { border-color: var(--asf-gold); }
.asf-quote-card__top { display: flex; align-items: center; justify-content: space-between; }
.asf-quote-card__text { font-style: italic; font-size: var(--asf-fs-sm); line-height: 1.5; flex-grow: 1; margin: 0; }
.asf-quote-card__ref { color: var(--asf-gold-dark); font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-xs); margin: 0; }
.asf-quote-card__title { font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-sm); margin: 0 0 var(--asf-space-2xs); }

/* =========================================================================
   AÇÕES DO CARD (Ouvir/Ler/Baixar, WhatsApp, Telegram, Copiar, Compartilhar)
   ========================================================================= */
/* Fileira compacta que quebra linha sozinha (flex-wrap) — os botões têm
   largura de conteúdo (auto), nunca esticam pra 100% do card. É assim que o
   site original faz: "Ouvir"+"Ler" cabem juntos, WhatsApp/Telegram/
   Compartilhar geralmente não cabem ao lado de mais nada e caem pra própria
   linha sozinhos — mas por falta de espaço, não por serem forçados a 100%. */
.asf-card-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--asf-space-xs);
	margin-top: var(--asf-space-sm);
}

/* "Ler capítulo completo" (página de Versículo/Reflexão, quando a
   Referência é reconhecida — ver asf_render_link_capitulo_biblia()). */
.asf-link-capitulo {
	display: inline-flex;
	margin-top: var(--asf-space-md);
}

/* =========================================================================
   CONTEÚDO RELACIONADO (final de single.php) — cruza os 4 CPTs pela mesma
   categoria (asf_categoria); completa com mais recentes do mesmo tipo se
   faltar. Ver asf_render_related_content().
   ========================================================================= */
.asf-related {
	margin: var(--asf-space-2xl) 0 var(--asf-space-xl);
}
.asf-related__titulo {
	font-size: var(--asf-fs-lg);
	margin: 0 0 var(--asf-space-lg);
}
.asf-related__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--asf-space-md);
}
.asf-related-card {
	display: flex;
	flex-direction: column;
	gap: var(--asf-space-sm);
	padding: var(--asf-card-pad);
	background: var(--asf-white);
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-md);
	text-decoration: none;
	transition: box-shadow 0.15s, border-color 0.15s;
}
.asf-related-card:hover {
	box-shadow: var(--asf-shadow);
	border-color: transparent;
}
.asf-related-card__tipo { align-self: flex-start; }
.asf-related-card__texto {
	margin: 0;
	color: var(--asf-navy-2);
	font-size: var(--asf-fs-sm);
	line-height: 1.4;
}
@media (max-width: 640px) {
	.asf-related__grid { grid-template-columns: 1fr; }
}
.asf-card-actions .asf-btn { flex: 0 0 auto; width: auto; }
.asf-btn-baixar {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: var(--asf-radius-md);
	background: var(--asf-gold);
	color: var(--asf-navy);
	border: none;
	cursor: pointer;
	font-size: var(--asf-fs-xs);
	display: flex;
	align-items: center;
	justify-content: center;
}
.asf-btn-baixar:hover { background: var(--asf-gold-dark); }
.asf-btn-whatsapp { background: #25D366; color: #fff; }
.asf-btn-whatsapp:hover { background: #1ea952; color: #fff; }
.asf-btn-telegram { background: #229ED9; color: #fff; }
.asf-btn-telegram:hover { background: #1c85b8; color: #fff; }

/* =========================================================================
   FAVORITAR (sobrescreve o coração genérico do plugin com o tom do design)
   ========================================================================= */
.asf-favorite-btn { color: rgba(16,29,74,0.35); }
.asf-favorite-btn.is-favorite { color: var(--asf-gold); }
.asf-hero-home .asf-favorite-btn,
.asf-verse-card .asf-favorite-btn { color: rgba(16,29,74,0.35); }
/* Visitante deslogado: no lugar do coração, um cadeado avulso (igual ao
   Base44) — troca só o glifo do ::before genérico do plugin, sem duplicar
   tamanho/posição que já vêm de .asf-favorite-btn. */
.asf-favorite-btn.is-locked::before { content: "🔒"; }
.asf-favorite-btn.is-locked { cursor: pointer; text-decoration: none; }

/* =========================================================================
   CATEGORIAS (pills)
   ========================================================================= */
.asf-category-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 1.4em 0;
}
.asf-category-nav a {
	padding: var(--asf-space-sm) var(--asf-space-lg);
	border-radius: var(--asf-radius-pill);
	border: 1.5px solid var(--asf-border);
	text-decoration: none;
	font-size: var(--asf-fs-xs);
	font-weight: var(--asf-fw-medium);
	color: var(--asf-navy-2);
	background: var(--asf-white);
}
.asf-category-nav a.is-active {
	background: var(--asf-navy);
	border-color: var(--asf-navy);
	color: var(--asf-white);
}

/* =========================================================================
   MEU MOMENTO COM DEUS
   ========================================================================= */
.asf-momento {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-space-2xl);
	margin: var(--asf-space-2xl) 0;
}
.asf-momento__head { display: flex; align-items: center; gap: var(--asf-space-sm); margin-bottom: var(--asf-space-2xs); }
.asf-momento__head h2 { margin: 0; font-size: var(--asf-fs-lg); }
.asf-momento p.asf-momento__sub { color: var(--asf-text-muted); font-size: var(--asf-fs-sm); margin: 0 0 var(--asf-space-xl); }
.asf-momento__cols { display: grid; grid-template-columns: 2fr 1fr; gap: var(--asf-space-2xl); }

/* Botões de humor. Este componente usa azul-marinho no selecionado (como no
   app original), não o dourado do resto do site. */
.asf-mood-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--asf-space-sm);
	align-content: start;
}
.asf-mood-btn,
.asf-mood-btn:visited {
	display: flex;
	align-items: center;
	gap: var(--asf-space-sm);
	min-width: 0;
	padding: var(--asf-space-sm) var(--asf-space-md);
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-md);
	background: var(--asf-white);
	color: var(--asf-navy-2);
	font-family: var(--asf-font-body);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-medium);
	line-height: 1.45;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	box-shadow: none;
	transition: background-color 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
}
.asf-mood-btn:hover { border-color: var(--asf-blue-end); background: var(--asf-bg-soft); color: var(--asf-navy-2); }
.asf-mood-btn:focus-visible { outline: 2px solid var(--asf-blue-start); outline-offset: 2px; }
.asf-mood-btn.is-selected,
.asf-mood-btn.is-selected:hover {
	background: var(--asf-blue-end);
	border-color: var(--asf-blue-end);
	color: var(--asf-white);
	box-shadow: var(--asf-shadow);
}
.asf-mood-btn__emoji { flex-shrink: 0; font-size: var(--asf-fs-md); }
.asf-mood-btn__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asf-mood-btn--mais,
.asf-mood-btn--mais:visited { justify-content: center; background: var(--asf-navy); border-color: var(--asf-navy); color: var(--asf-white); }
.asf-mood-btn--mais:hover { background: var(--asf-blue-end); border-color: var(--asf-blue-end); color: var(--asf-white); }

/* Painel "Receba agora" — muda na hora ao escolher um humor (child.js). */
.asf-receba-agora {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-lg);
	padding: var(--asf-space-xl);
	background: var(--asf-white);
}
.asf-receba-agora p.asf-receba-agora__eyebrow { margin: 0 0 var(--asf-space-2xs); font-size: var(--asf-fs-sm); color: var(--asf-text-muted); }
.asf-receba-agora p.asf-receba-agora__humor { margin: 0 0 var(--asf-space-lg); font-size: var(--asf-fs-sm); font-weight: var(--asf-fw-semibold); color: var(--asf-blue-end); }
/* Caixa "Você selecionou" com mais destaque: borda forte na cor da marca +
   fundo levemente colorido, pra não passar batido como um texto qualquer
   do card (era só parágrafo solto antes, sem nenhuma caixa). */
.asf-receba-agora__selecao {
	background: linear-gradient(120deg, rgba(47,91,215,0.1), rgba(16,29,74,0.1));
	border: 2px solid var(--asf-blue-end);
	border-radius: var(--asf-radius-md);
	padding: var(--asf-space-md) var(--asf-space-lg);
	margin: 0 0 var(--asf-space-lg);
}
.asf-receba-agora__selecao p.asf-receba-agora__eyebrow { margin: 0 0 var(--asf-space-2xs); font-weight: var(--asf-fw-medium); }
.asf-receba-agora__selecao p.asf-receba-agora__humor { margin: 0; font-size: var(--asf-fs-lg); font-weight: var(--asf-fw-bold); }
.asf-receba-agora p.asf-receba-agora__titulo { margin: 0 0 var(--asf-space-md); font-size: var(--asf-fs-sm); font-weight: var(--asf-fw-bold); color: var(--asf-blue-end); }
.asf-receba-agora__lista {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--asf-space-md);
	list-style: none;
	margin: 0 0 var(--asf-space-xl);
	padding: 0;
}
.asf-receba-agora__lista li { display: flex; align-items: center; gap: var(--asf-space-sm); font-size: var(--asf-fs-sm); line-height: 1.45; color: var(--asf-blue-start); }
.asf-receba-agora__lista .asf-icon { width: 16px; height: 16px; flex-shrink: 0; }
.asf-receba-agora__cta,
.asf-receba-agora__cta:visited {
	display: block;
	width: 100%;
	padding: var(--asf-space-md) var(--asf-space-lg);
	border: 0;
	border-radius: var(--asf-radius-md);
	background: var(--asf-navy);
	color: var(--asf-white);
	font-family: var(--asf-font-heading);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-semibold);
	line-height: 1.45;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s;
}
.asf-receba-agora__cta:hover { background: var(--asf-blue-end); color: var(--asf-white); }
.asf-receba-agora__cta:disabled,
.asf-receba-agora__cta:disabled:hover { background: var(--asf-border); color: var(--asf-text-muted); cursor: not-allowed; }
.asf-receba-agora__cta[hidden] { display: none; }

/* =========================================================================
   GERAR NOVO (listagens) — botão do topo e estado de categoria vazia
   ========================================================================= */
.asf-btn.asf-btn-gerar {
	gap: var(--asf-space-sm);
	border: 0;
	background: var(--asf-gold);
	color: var(--asf-white);
	font-family: var(--asf-font-heading);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-semibold);
	cursor: pointer;
}
.asf-btn.asf-btn-gerar:hover { background: var(--asf-gold-dark); color: var(--asf-white); }
.asf-btn.asf-btn-gerar--azul { background: var(--asf-blue-end); }
.asf-btn.asf-btn-gerar--azul:hover { background: var(--asf-navy); }
.asf-btn.asf-btn-gerar--bloqueado,
.asf-btn.asf-btn-gerar--bloqueado:hover { background: var(--asf-bg-soft); color: var(--asf-navy-2); }
.asf-btn-gerar .asf-icon,
.asf-btn-lista-vazia .asf-icon { width: 16px; height: 16px; flex-shrink: 0; }
.asf-btn-gerar__carregando { display: none; }
[data-asf-gerar-novo].is-loading { cursor: progress; opacity: 0.85; }
[data-asf-gerar-novo].is-loading .asf-btn-gerar__icone { display: none; }
[data-asf-gerar-novo].is-loading .asf-btn-gerar__carregando { display: inline-block; animation: asf-girar 0.8s linear infinite; }
@keyframes asf-girar { to { transform: rotate(360deg); } }

.asf-lista-vazia { text-align: center; padding: calc(var(--asf-space-2xl) * 2) 0; }
.asf-lista-vazia__icone { display: block; width: 48px; height: 48px; margin: 0 auto var(--asf-space-lg); }
.asf-lista-vazia__icone--dourado { color: var(--asf-gold); }
.asf-lista-vazia__icone--azul { color: var(--asf-blue-end); }
.asf-lista-vazia p.asf-lista-vazia__texto { margin: 0 0 var(--asf-space-lg); color: var(--asf-text-muted); }
.asf-btn.asf-btn-lista-vazia {
	gap: var(--asf-space-sm);
	border: 0;
	background: var(--asf-blue-end);
	color: var(--asf-white);
	font-family: var(--asf-font-heading);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-semibold);
	cursor: pointer;
}
.asf-btn.asf-btn-lista-vazia:hover { background: var(--asf-navy); color: var(--asf-white); }

/* =========================================================================
   EXPLORE MAIS CONTEÚDOS
   ========================================================================= */
.asf-explore-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--asf-grid-gap);
}
/* Card em 2 partes empilhadas: foto (só imagem, sem texto em cima) +
   corpo com fundo claro (título/descrição/botão), igual ao Base44 — antes
   o texto ficava sobreposto direto na foto com gradiente escuro atrás. */
.asf-explore-card {
	display: flex;
	flex-direction: column;
	border-radius: var(--asf-radius-lg);
	overflow: hidden;
	text-decoration: none;
	background: var(--asf-white);
	box-shadow: var(--asf-shadow);
}
.asf-explore-card__media {
	aspect-ratio: 16 / 9;
	background-color: var(--asf-navy);
	background-size: cover;
	background-position: center;
}
.asf-explore-card__body {
	padding: var(--asf-card-pad);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.asf-explore-card__title { font-weight: var(--asf-fw-bold); font-size: var(--asf-fs-sm); margin: 0 0 var(--asf-space-2xs); color: var(--asf-navy); }
.asf-explore-card__sub { font-size: var(--asf-fs-sm); color: var(--asf-text-muted); margin: 0 0 var(--asf-space-sm); }
.asf-explore-card__arrow {
	width: 30px; height: 30px; border-radius: 50%;
	color: var(--asf-white);
	display: flex; align-items: center; justify-content: center;
	font-weight: var(--asf-fw-bold); font-size: var(--asf-fs-sm);
}

/* =========================================================================
   FAIXA DE FEATURES
   ========================================================================= */
.asf-feature-strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--asf-space-2xl);
	text-align: center;
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-space-2xl) var(--asf-space-xl);
	margin: var(--asf-space-2xl) 0;
}

/* Card "Um espaço diário com a Palavra de Deus" no fim da home, antes do
   rodapé — imagem à esquerda (blob arredondado), texto + citação à direita.
   Substituiu o antigo .asf-home-intro (texto corrido sem card). */
.asf-daily-card {
	display: grid;
	grid-template-columns: minmax(260px, 460px) 1fr;
	gap: var(--asf-space-2xl);
	align-items: center;
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-space-2xl);
	margin: 0 0 var(--asf-space-2xl);
}
.asf-daily-card__media {
	position: relative;
	aspect-ratio: 5 / 4;
}
.asf-daily-card__media::before {
	content: '';
	position: absolute;
	inset: -6%;
	background: radial-gradient(circle at 30% 30%, rgba(47, 91, 215, 0.16), rgba(47, 91, 215, 0) 70%);
	border-radius: 42% 58% 63% 37% / 47% 42% 58% 53%;
	z-index: 0;
}
.asf-daily-card__media img {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 42% 58% 63% 37% / 47% 42% 58% 53%;
	box-shadow: var(--asf-shadow-lg);
}
.asf-daily-card__icon { font-size: var(--asf-fs-xl); line-height: 1; margin-bottom: var(--asf-space-sm); }
.asf-daily-card__body h2 { font-size: var(--asf-fs-lg); margin: 0 0 var(--asf-space-lg); }
.asf-daily-card__body p {
	color: var(--asf-text-muted);
	font-size: var(--asf-fs-sm);
	line-height: 1.75;
	margin: 0 0 var(--asf-space-lg);
}
.asf-daily-card__body p:last-of-type { margin-bottom: var(--asf-space-lg); }
.asf-daily-card__quote {
	display: flex;
	gap: var(--asf-space-md);
	background: var(--asf-bg-soft);
	border-left: 3px solid var(--asf-gold);
	border-radius: var(--asf-radius-sm);
	padding: var(--asf-space-lg);
}
.asf-daily-card__quote-icon { font-size: var(--asf-fs-lg); flex: 0 0 auto; }
.asf-daily-card__quote blockquote {
	margin: 0 0 var(--asf-space-2xs);
	font-style: italic;
	font-size: var(--asf-fs-sm);
	color: var(--asf-navy-2);
}
.asf-daily-card__quote cite {
	display: block;
	font-style: normal;
	font-size: var(--asf-fs-2xs);
	font-weight: var(--asf-fw-semibold);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--asf-text-muted);
}
.asf-daily-card__quote cite a { color: var(--asf-blue-start); text-decoration: none; }
.asf-daily-card__quote cite a:hover { text-decoration: underline; }

@media (max-width: 900px) {
	.asf-daily-card { grid-template-columns: 1fr; }
	.asf-daily-card__media { max-width: 340px; margin: 0 auto; }
}
.asf-feature-strip__icon { font-size: var(--asf-fs-xl); margin-bottom: var(--asf-space-sm); }
.asf-feature-strip h4 { margin: 0 0 var(--asf-space-2xs); font-size: var(--asf-fs-sm); }
.asf-feature-strip p { margin: 0; font-size: var(--asf-fs-sm); color: var(--asf-text-muted); }

/* =========================================================================
   NEWSLETTER
   ========================================================================= */
.asf-newsletter {
	background: var(--asf-navy);
	color: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	padding: 2em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5em;
	flex-wrap: wrap;
	margin: 2em 0;
}
.asf-newsletter__icon {
	width: 48px; height: 48px; border-radius: 12px; background: var(--asf-gold);
	display: flex; align-items: center; justify-content: center; font-size: 1.3em; flex-shrink: 0;
}
.asf-newsletter__text { display: flex; gap: 1em; align-items: center; flex-grow: 1; min-width: 260px; }
.asf-newsletter h2 { color: var(--asf-white); font-size: 1.2em; margin: 0 0 0.2em; }
.asf-newsletter p { color: var(--asf-text-on-blue); margin: 0; font-size: 0.88em; }
.asf-newsletter form { display: flex; gap: 0.6em; flex-wrap: wrap; }
.asf-newsletter input {
	padding: 0.7em 1em; border-radius: var(--asf-radius-pill); border: none; min-width: 200px;
}
.asf-newsletter .asf-newsletter__note { width: 100%; font-size: 0.72em; opacity: 0.7; margin-top: 0.5em; }

/* =========================================================================
   FOOTER
   ========================================================================= */
.asf-footer {
	background: var(--asf-navy);
	color: var(--asf-text-on-blue);
	padding: 3em 0 1.5em;
	margin-top: 3em;
}
.asf-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 2em;
}
.asf-footer h4 { color: var(--asf-white); font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.05em; margin: 0 0 1em; }
.asf-footer__social { display: flex; gap: 0.6em; margin-top: 1em; }
.asf-footer ul { list-style: none; margin: 0; padding: 0; }
.asf-footer li { margin-bottom: 0.6em; }
.asf-footer a { color: var(--asf-text-on-blue); text-decoration: none; font-size: 0.9em; }
.asf-footer a:hover { color: var(--asf-white); }
/* E-mail de contato do rodapé (coluna "Conteúdos") — maior e mais visível
   que os links normais da lista, por pedido explícito (2026-09-26). */
.asf-footer__email {
	display: inline-block;
	font-size: 1.05em;
	font-weight: var(--asf-fw-semibold);
	color: var(--asf-white) !important;
	text-decoration: underline;
	word-break: break-word;
}
.asf-footer__email:hover { color: var(--asf-gold) !important; }
.asf-footer__bottom {
	display: flex; justify-content: space-between; align-items: center;
	margin-top: 2.5em; padding-top: 1.5em; border-top: 1px solid rgba(255,255,255,0.1);
	font-size: 0.8em; flex-wrap: wrap; gap: 0.5em;
}

/* =========================================================================
   FRASES — cards com foto de fundo (mesma foto/overlay do PNG baixado, ver
   gerarImagemCard() em frontend.js — o card na listagem fica igual ao que a
   pessoa baixa). Imagem entra inline via style="background-image" (varia por
   post); o gradiente escuro de legibilidade é fixo, via ::before.
   ========================================================================= */
.asf-frase-card {
	border-radius: var(--asf-radius-lg);
	padding: 1.4em;
	color: var(--asf-white);
	display: flex;
	flex-direction: column;
	gap: 0.8em;
	position: relative;
	min-height: 240px;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.asf-frase-card::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(16,29,74,0.55) 0%, rgba(8,14,38,0.85) 100%);
}
.asf-frase-card > * { position: relative; }
.asf-frase-card__quote { font-size: 1.5em; opacity: 0.6; line-height: 1; }
.asf-frase-card__text { font-weight: 700; font-size: 1.02em; line-height: 1.4; flex-grow: 1; }
.asf-frase-card__author { font-size: 0.82em; opacity: 0.85; }
.asf-frase-card .asf-favorite-btn { color: rgba(255,255,255,0.7); }
.asf-frase-card .asf-favorite-btn.is-favorite { color: var(--asf-white); }
/* Mesmo ajuste de contraste do .asf-verse-card--hero: fundo colorido/gradiente
   por trás dos botões "ghost" (Ouvir/Ler/Copiar/Compartilhar) precisa de um
   fundo claro translúcido, senão o texto navy do ghost padrão some. */
.asf-frase-card .asf-btn-ghost { background: rgba(255,255,255,0.15); color: var(--asf-white); }
.asf-frase-card .asf-btn-ghost[disabled],
.asf-frase-card .asf-btn-ghost.is-locked { opacity: 0.75; }

/* =========================================================================
   GATE DE LOGIN (Orações, Reflexões, Frases, Músicas — exigem conta)
   ========================================================================= */
.asf-login-gate {
	max-width: 480px;
	margin: 4em auto;
	text-align: center;
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow-lg);
	padding: 3em 2em;
}
.asf-login-gate__icon {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--asf-gold);
	color: var(--asf-navy);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8em;
	margin: 0 auto 1.2em;
}
.asf-login-gate h1 { font-size: 1.4em; margin: 0 0 0.6em; }
.asf-login-gate p { color: var(--asf-text-muted); margin: 0 0 1.6em; }

/* =========================================================================
   LOGIN / CADASTRO
   ========================================================================= */
.asf-auth-tabs {
	display: flex;
	background: var(--asf-bg-soft);
	border-radius: var(--asf-radius-pill);
	padding: 0.3em;
	margin-bottom: 1.5em;
}
.asf-auth-tab {
	flex: 1;
	background: none;
	border: none;
	padding: 0.7em;
	border-radius: var(--asf-radius-pill);
	font-family: var(--asf-font-heading);
	font-weight: 700;
	font-size: 0.9em;
	cursor: pointer;
	color: var(--asf-text-muted);
}
.asf-auth-tab.is-active { background: var(--asf-white); color: var(--asf-navy-2); box-shadow: var(--asf-shadow); }
.asf-auth-label {
	display: block;
	font-size: 0.85em;
	font-weight: 700;
	margin-bottom: 1em;
}
.asf-auth-input {
	display: block;
	width: 100%;
	margin-top: 0.4em;
	padding: 0.75em 1em;
	border-radius: var(--asf-radius-md);
	border: 1.5px solid var(--asf-border);
	font-family: var(--asf-font-body);
	font-size: 1em;
	box-sizing: border-box;
}
.asf-auth-input:focus { outline: 2px solid var(--asf-blue-start); border-color: var(--asf-blue-start); }

/* Seletor de nota (1-5 estrelas) do formulário de depoimento — CSS puro
   (sem JS): os inputs vêm em ordem decrescente no HTML (5,4,3,2,1) com
   row-reverse, então ":checked ~ label" e ":hover ~ label" (irmãos DEPOIS
   no HTML = visualmente à ESQUERDA da estrela ativa) acendem certinho as
   estrelas da esquerda até a selecionada/sob o mouse. */
.asf-star-rating {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	gap: 0.15em;
	font-size: 1.8em;
	line-height: 1;
	margin: 0.3em 0 1.2em;
}
.asf-star-rating input {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	opacity: 0;
}
.asf-star-rating label { color: var(--asf-border); cursor: pointer; transition: color 0.15s; }
.asf-star-rating input:checked ~ label { color: var(--asf-gold); }
.asf-star-rating label:hover,
.asf-star-rating label:hover ~ label { color: var(--asf-gold); }
.asf-star-rating input:focus-visible + label { outline: 2px solid var(--asf-blue-start); outline-offset: 2px; border-radius: 3px; }
.asf-marco-banner {
	display: flex;
	align-items: center;
	gap: 1rem;
	background: linear-gradient(90deg, var(--asf-blue-start), var(--asf-blue-end));
	color: #fff;
	border-radius: 12px;
	padding: 1rem 1.25rem;
	margin: 1.5rem 0;
}
.asf-marco-banner__icone { font-size: 1.8rem; line-height: 1; flex-shrink: 0; }
.asf-marco-banner__texto { display: flex; flex-direction: column; gap: 0.15rem; flex: 1; }
.asf-marco-banner__texto strong { font-size: 1rem; }
.asf-marco-banner__texto span { font-size: 0.9rem; opacity: 0.9; }
.asf-marco-banner .asf-btn-fill { background: #fff; color: var(--asf-blue-start); flex-shrink: 0; white-space: nowrap; }
.asf-marco-banner .asf-btn-fill:hover { opacity: 0.9; }
@media (max-width: 640px) {
	.asf-marco-banner { flex-wrap: wrap; }
	.asf-marco-banner .asf-btn-fill { width: 100%; text-align: center; }
}
.asf-auth-error {
	background: #fdecec;
	color: #b3261e;
	padding: 0.8em 1em;
	border-radius: var(--asf-radius-md);
	font-size: 0.88em;
	margin-bottom: 1em;
}
.asf-btn-google {
	background: var(--asf-white);
	border: 1.5px solid var(--asf-border);
	color: var(--asf-navy-2);
	margin-bottom: 1.2em;
}
.asf-btn-google:hover { background: var(--asf-bg-soft); }
.asf-btn-google__icon {
	width: 22px; height: 22px; border-radius: 50%; background: var(--asf-white);
	color: #4285F4; font-weight: 800; font-size: 0.85em;
	display: inline-flex; align-items: center; justify-content: center;
	box-shadow: 0 0 0 1px var(--asf-border);
}
.asf-auth-divider {
	display: flex;
	align-items: center;
	text-align: center;
	color: var(--asf-text-muted);
	font-size: 0.78em;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin: 0 0 1.2em;
}
.asf-auth-divider::before,
.asf-auth-divider::after {
	content: "";
	flex: 1;
	border-bottom: 1px solid var(--asf-border);
}
.asf-auth-divider span { padding: 0 1em; }

.asf-auth-success {
	background: #e9f9ef;
	color: #146c2e;
	padding: 0.8em 1em;
	border-radius: var(--asf-radius-md);
	font-size: 0.9em;
	margin-bottom: 1em;
}

/* =========================================================================
   MEU PERFIL — estatísticas, jornada, configurações, conta
   ========================================================================= */
.asf-stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1em;
	margin-bottom: 1.6em;
}
.asf-stat-tile {
	background: var(--asf-white);
	border-radius: var(--asf-radius-md);
	box-shadow: var(--asf-shadow);
	padding: 1.4em 1em;
	text-align: center;
}
.asf-stat-tile__icon { font-size: 1.5em; margin-bottom: 0.3em; }
.asf-stat-tile__num { font-size: 1.6em; font-weight: 800; color: var(--asf-navy-2); display: block; }
.asf-stat-tile__label { font-size: 0.8em; color: var(--asf-text-muted); }

.asf-journey {
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: 1.6em;
}
.asf-journey__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.8em; font-weight: 700; }
.asf-journey__track { background: var(--asf-bg-soft); border-radius: var(--asf-radius-pill); height: 12px; overflow: hidden; }
.asf-journey__fill { background: linear-gradient(90deg, var(--asf-gold), var(--asf-gold-dark)); height: 100%; border-radius: var(--asf-radius-pill); }
.asf-journey__sub { font-size: 0.85em; color: var(--asf-text-muted); margin-top: 0.6em; }

.asf-perfil-header {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 1.6em;
}
.asf-perfil-header__avatar {
	width: 64px; height: 64px; border-radius: 50%; background: var(--asf-gold); color: var(--asf-navy);
	display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.4em; flex-shrink: 0;
}
.asf-perfil-header h1 { margin: 0; font-size: 1.3em; }
.asf-perfil-header p { margin: 0.2em 0 0; color: var(--asf-text-muted); font-size: 0.9em; }

.asf-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
@media (max-width: 600px) { .asf-form-row { grid-template-columns: 1fr; } }

/* =========================================================================
   PÁGINA DE CONTATO — casca visual (hero + card, page-templates/contato.php)
   em cima do HTML que o Contact Form 7 gera sozinho. Reaproveita os tokens
   de auth/perfil (.asf-auth-label/.asf-auth-input, .asf-form-row) e o
   mesmo desenho de pill do "Meu Momento com Deus" (.asf-mood-btn), só que
   com seletores próprios — o CF7 não deixa a gente escrever a tag <button>
   nem escolher a marcação, então em vez de reusar a classe original (que
   tem JS de humor grudado nela) replicamos a receita visual aqui.
   ========================================================================= */
.asf-contato-form p:last-child { margin-bottom: 0; }

.asf-contato-tipo-rotulo { display: block; margin-bottom: 0.4em; }
.asf-contato-tipo {
	display: flex;
	flex-wrap: wrap;
	gap: var(--asf-space-sm);
}
.asf-contato-tipo .wpcf7-list-item { margin: 0; }
.asf-contato-tipo .wpcf7-list-item label {
	display: flex;
	align-items: center;
	gap: var(--asf-space-sm);
	padding: var(--asf-space-sm) var(--asf-space-md);
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-md);
	background: var(--asf-white);
	color: var(--asf-navy-2);
	font-family: var(--asf-font-body);
	font-size: var(--asf-fs-sm);
	font-weight: var(--asf-fw-medium);
	cursor: pointer;
	transition: background-color 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
}
.asf-contato-tipo .wpcf7-list-item label:hover { border-color: var(--asf-blue-end); background: var(--asf-bg-soft); }
.asf-contato-tipo .wpcf7-list-item label:has(input:checked) {
	background: var(--asf-blue-end);
	border-color: var(--asf-blue-end);
	color: var(--asf-white);
	box-shadow: var(--asf-shadow);
}
.asf-contato-tipo .wpcf7-list-item label:has(input:focus-visible) {
	outline: 2px solid var(--asf-blue-start);
	outline-offset: 2px;
}
/* Some visualmente com o círculo nativo do rádio, mas sem display:none —
   mantém foco por teclado (Tab) funcionando. */
.asf-contato-tipo input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	opacity: 0;
}

.asf-contato-form .wpcf7-submit,
.asf-contato-form input[type="submit"] {
	display: inline-flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	font-family: var(--asf-font-heading);
	font-weight: var(--asf-fw-medium);
	font-size: var(--asf-fs-sm);
	padding: var(--asf-space-sm) var(--asf-space-lg);
	border-radius: var(--asf-radius-md);
	border: none;
	background: var(--asf-gold);
	color: var(--asf-navy);
	cursor: pointer;
	margin-top: 0.5em;
}
.asf-contato-form .wpcf7-submit:hover,
.asf-contato-form input[type="submit"]:hover { background: var(--asf-gold-dark); }

.asf-contato-form .wpcf7-not-valid-tip { display: block; color: #b3261e; font-size: 0.82em; margin-top: 0.3em; }
.asf-contato-form .wpcf7-response-output {
	margin-top: 1.2em;
	border-radius: var(--asf-radius-md);
	padding: 0.8em 1em;
	font-size: var(--asf-fs-sm);
}

/* =========================================================================
   PÁGINAS INSTITUCIONAIS — casca hero+card (page-institucional.php) usada
   em Política de Privacidade, Termos de Uso, Contato, Suporte e Excluir
   Conta. Só ajusta o espaçamento do conteúdo solto de dentro do card —
   cores/tipografia continuam vindo do global styles do WP e do Kadence.
   ========================================================================= */
.asf-institucional-card h2 { margin: var(--asf-space-lg) 0 var(--asf-space-sm); font-size: var(--asf-fs-lg); color: var(--asf-navy); }
.asf-institucional-card h3 { margin: var(--asf-space-md) 0 var(--asf-space-xs); font-size: var(--asf-fs-md); color: var(--asf-navy); }
.asf-institucional-card > *:first-child { margin-top: 0; }
.asf-institucional-card p { line-height: 1.6; }
.asf-institucional-card ul,
.asf-institucional-card ol { line-height: 1.6; padding-left: 1.3em; }
.asf-institucional-card a { color: var(--asf-blue-end); }

/* =========================================================================
   SOBRE — página institucional especial (page-templates/sobre.php):
   Missão/Visão lado a lado, grade "O que oferecemos" e banner final.
   ========================================================================= */
.asf-sobre-mv {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--asf-grid-gap);
	margin: var(--asf-space-2xl) 0;
}
.asf-sobre-mv .asf-sidebar-card { margin-bottom: 0; }
/* Blocos de E-E-A-T (Equipe / Compromisso Editorial) — mesmo card branco já
   usado no resto da página, só com respiro vertical entre eles. */
.asf-sobre-bloco { margin: 0 0 var(--asf-space-lg); }
.asf-sobre-bloco .asf-sidebar-card { margin-bottom: 0; }
.asf-sobre-bloco .asf-sidebar-card p + p { margin-top: var(--asf-space-sm); }
.asf-sobre-mv h3 { margin: 0 0 var(--asf-space-sm); font-size: var(--asf-fs-lg); color: var(--asf-navy); }
.asf-sobre-mv p { margin: 0; font-size: var(--asf-fs-sm); line-height: 1.6; color: var(--asf-text-muted); }

.asf-sobre-oferecemos {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--asf-grid-gap);
	margin: 0 0 var(--asf-space-2xl);
}
.asf-oferecemos-card {
	position: relative;
	background: var(--asf-white);
	border-radius: var(--asf-radius-lg);
	box-shadow: var(--asf-shadow);
	padding: var(--asf-card-pad-lg);
	text-align: center;
}
.asf-oferecemos-card__icone {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--asf-fs-lg);
	color: var(--asf-white);
	margin: 0 auto var(--asf-space-sm);
}
.asf-oferecemos-card h3 { margin: 0 0 var(--asf-space-2xs); font-size: var(--asf-fs-md); color: var(--asf-navy); }
.asf-oferecemos-card p { margin: 0; font-size: var(--asf-fs-xs); color: var(--asf-text-muted); line-height: 1.5; }

.asf-sobre-cta {
	background: linear-gradient(120deg, var(--asf-blue-start), var(--asf-navy));
	border-radius: var(--asf-radius-lg);
	color: var(--asf-white);
	text-align: center;
	padding: var(--asf-space-2xl);
	margin: 0 0 var(--asf-space-2xl);
}
.asf-sobre-cta h2 { color: var(--asf-white); margin: 0 0 var(--asf-space-sm); }
.asf-sobre-cta p { color: var(--asf-text-on-blue); margin: 0 0 var(--asf-space-lg); }
.asf-sobre-cta__acoes { display: flex; gap: var(--asf-space-md); justify-content: center; flex-wrap: wrap; }

@media (max-width: 600px) {
	.asf-sobre-mv { grid-template-columns: 1fr; }
	.asf-sobre-oferecemos { grid-template-columns: 1fr; }
}

/* =========================================================================
   RESPONSIVO
   ========================================================================= */
@media (max-width: 900px) {
	.asf-hero-home__grid { grid-template-columns: 1fr; }
	.asf-home-grid { grid-template-columns: 1fr; }
	.asf-quicknav { grid-template-columns: repeat(3, 1fr); }
	.asf-momento__cols { grid-template-columns: 1fr; }
	.asf-explore-grid { grid-template-columns: repeat(2, 1fr); }
	.asf-feature-strip { grid-template-columns: repeat(2, 1fr); }
	.asf-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.asf-quicknav { grid-template-columns: repeat(2, 1fr); }
	.asf-explore-grid { grid-template-columns: 1fr; }
	.asf-feature-strip { grid-template-columns: 1fr; }
	.asf-footer__grid { grid-template-columns: 1fr; }
	.asf-mood-grid { grid-template-columns: repeat(2, 1fr); }
	.asf-quote-grid { grid-template-columns: 1fr; }
	.asf-today-grid { grid-template-columns: 1fr; }
}


/* ==========================================================================
   HEADER — igual ao Base44: transparente sobre o hero, escurece ao rolar
   ========================================================================== */
.asf-header {
	background: #10224E;
	transition: background-color .3s cubic-bezier(.4,0,.2,1), box-shadow .3s cubic-bezier(.4,0,.2,1), backdrop-filter .3s cubic-bezier(.4,0,.2,1);
}
.asf-header.is-scrolled {
	background: rgba(16, 34, 78, 0.95);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);
}
/* Páginas com hero escuro (home e internas): header fixo e transparente por cima do hero */
body:has(.asf-header + .asf-hero-home) .asf-header,
body:has(.asf-header + .asf-hero-inner) .asf-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
}
body:has(.asf-header + .asf-hero-home) .asf-header:not(.is-scrolled),
body:has(.asf-header + .asf-hero-inner) .asf-header:not(.is-scrolled) {
	background: transparent;
	box-shadow: none;
}
/* Menu mobile aberto: fundo sólido pra manter leitura */
.asf-header:has([data-asf-mobile-nav]:not([hidden])) {
	background: rgba(16, 34, 78, 0.97) !important;
}
.admin-bar .asf-header { top: 32px !important; }
@media (max-width: 782px) { .admin-bar .asf-header { top: 46px !important; } }
@media (max-width: 600px) { .admin-bar .asf-header { top: 0 !important; } }
/* Hero começa atrás do header (como no Base44), conteúdo mantém a mesma posição */
.asf-header + .asf-hero-home { padding-top: calc(3em + var(--asf-header-h, 88px)); }
.asf-header + .asf-hero-inner { padding-top: calc(2.4em + var(--asf-header-h, 88px)); }


/* ==========================================================================
   MENU MOBILE — igual ao Base44
   ========================================================================== */
@media (max-width: 960px) {
	/* Header no celular: só logo + botão do menu (itens da conta vão pro menu) */
	.asf-header__actions { margin-left: auto; }
	.asf-header__actions > :not(.asf-menu-toggle) { display: none !important; }
	.asf-menu-toggle {
		width: 40px; height: 40px; padding: 8px; border-radius: 12px;
		font-size: 0; line-height: 0; cursor: pointer;
		transition: background-color .2s ease;
	}
	.asf-menu-toggle:hover { background: rgba(255,255,255,0.1); }
	.asf-menu-toggle::before {
		content: ""; display: block; width: 24px; height: 24px; background: #fff;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='4' x2='20' y1='6' y2='6'/%3E%3Cline x1='4' x2='20' y1='12' y2='12'/%3E%3Cline x1='4' x2='20' y1='18' y2='18'/%3E%3C/svg%3E") center / 24px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='4' x2='20' y1='6' y2='6'/%3E%3Cline x1='4' x2='20' y1='12' y2='12'/%3E%3Cline x1='4' x2='20' y1='18' y2='18'/%3E%3C/svg%3E") center / 24px no-repeat;
	}
	.asf-menu-toggle[aria-expanded="true"]::before {
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
	}
}
@media (min-width: 961px) { .asf-mobile-nav { display: none !important; } }

.asf-mobile-nav {
	background: #10224E;
	border-top: 1px solid rgba(255,255,255,0.1);
	padding: 12px 16px;
	max-height: calc(100vh - var(--asf-header-h, 64px));
	overflow-y: auto;
}
@media (max-width: 560px) { .asf-mobile-nav { padding: 12px 16px; } }
.asf-mobile-nav .asf-mobile-nav__busca { display: none !important; }
.asf-mobile-nav #asf-mobile-menu { display: flex; flex-direction: column; gap: 4px; }
.asf-mobile-nav #asf-mobile-menu a {
	display: block;
	padding: 12px 16px;
	border: 0;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	color: rgba(255,255,255,0.8);
	transition: all .2s ease;
}
.asf-mobile-nav #asf-mobile-menu a:hover { color: #fff; background: rgba(255,255,255,0.1); }
.asf-mobile-nav #asf-mobile-menu li.current-menu-item > a,
.asf-mobile-nav #asf-mobile-menu li.current-menu-parent > a,
.asf-mobile-nav #asf-mobile-menu a[aria-current="page"] {
	background: #F4B400;
	color: #fff;
}
/* Rodapé do menu: Favoritos / Perfil / Sair (logado) ou Entrar / Cadastrar (visitante) */
.asf-mobile-nav .asf-mobile-nav__conta {
	display: flex !important;
	gap: 8px;
	margin: 8px 0 0;
	padding: 12px 0 0;
	border-top: 1px solid rgba(255,255,255,0.1);
}
.asf-mobile-nav .asf-mobile-nav__conta li { flex: 1; display: block !important; }
.asf-mobile-nav .asf-mobile-nav__conta a {
	display: flex; align-items: center; justify-content: center; gap: 8px;
	padding: 10px 0;
	border: 0;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 400;
	color: rgba(255,255,255,0.8);
	transition: all .2s ease;
}
.asf-mobile-nav .asf-mobile-nav__conta a:hover { color: #fff; background: rgba(255,255,255,0.1); }
.asf-mobile-nav .asf-mobile-nav__entrar a {
	background: #F4B400;
	color: #fff;
	font-weight: 600;
	padding: 12px 16px;
}
.asf-mobile-nav .asf-mobile-nav__entrar a:hover { background: #e0a600; color: #fff; }

/* =========================================================================
   BÍBLIA (índice /biblia/, livro /biblia/{livro}/, capítulo /biblia/{livro}/{cap})
   ========================================================================= */
.asf-biblia-crumb { font-size: var(--asf-fs-xs); color: var(--asf-text-on-blue); margin: 0 0 var(--asf-space-sm); }
.asf-biblia-crumb a { color: var(--asf-white); text-decoration: none; opacity: 0.9; }
.asf-biblia-crumb a:hover { text-decoration: underline; }
.asf-biblia-crumb span { margin: 0 var(--asf-space-2xs); opacity: 0.6; }

/* Índice: grade de livros */
.asf-biblia-livros {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: var(--asf-space-md);
	margin-bottom: var(--asf-space-lg);
}
.asf-biblia-livro-link {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--asf-space-sm);
	background: var(--asf-white);
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-md);
	padding: var(--asf-space-md) var(--asf-space-lg);
	text-decoration: none;
	color: var(--asf-navy);
	transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}
.asf-biblia-livro-link:hover { border-color: var(--asf-blue-end); box-shadow: var(--asf-shadow); transform: translateY(-1px); }
.asf-biblia-livro-link__nome { font-weight: var(--asf-fw-semibold); font-size: var(--asf-fs-sm); }
.asf-biblia-livro-link__caps { font-size: var(--asf-fs-2xs); color: var(--asf-text-muted); flex-shrink: 0; }

/* Livro: grade numérica de capítulos */
.asf-biblia-caps {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(52px, 1fr));
	gap: var(--asf-space-sm);
}
.asf-biblia-cap-link {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	background: var(--asf-bg-soft, #f2f5fb);
	border: 1px solid var(--asf-border);
	border-radius: var(--asf-radius-md);
	text-decoration: none;
	color: var(--asf-navy);
	font-weight: var(--asf-fw-semibold);
	font-size: var(--asf-fs-sm);
	transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}
.asf-biblia-cap-link:hover { background: var(--asf-blue-end); border-color: var(--asf-blue-end); color: var(--asf-white); }

/* Capítulo: texto dos versículos */
.asf-biblia-capitulo__titulo {
	font-style: italic;
	color: var(--asf-text-muted);
	text-align: center;
	margin: 0 0 var(--asf-space-lg);
	font-size: var(--asf-fs-sm);
}
.asf-biblia-texto { font-size: 1.05rem; line-height: 1.85; color: var(--asf-navy-2); }
.asf-biblia-versiculo { margin: 0 0 var(--asf-space-sm); }
.asf-biblia-versiculo__num {
	font-size: 0.7em;
	font-weight: var(--asf-fw-bold);
	color: var(--asf-gold-dark);
	margin-right: 0.35em;
	vertical-align: super;
	line-height: 0;
}
.asf-biblia-texto em { font-style: italic; color: var(--asf-text-muted); }

.asf-biblia-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--asf-space-sm);
	margin-top: var(--asf-space-xl);
	flex-wrap: wrap;
}

/* "Versículo em destaque neste capítulo" — Versículos/Reflexões cuja
   Referência caiu neste capítulo (ASF_Biblia::get_indice_referencias). */
.asf-biblia-destaque {
	margin-top: var(--asf-space-xl);
	padding: var(--asf-card-pad);
	background: var(--asf-bg-soft);
	border-radius: var(--asf-radius-md);
}
.asf-biblia-destaque__titulo {
	font-size: var(--asf-fs-sm);
	margin: 0 0 var(--asf-space-md);
}
.asf-biblia-destaque__link {
	display: flex;
	align-items: center;
	gap: var(--asf-space-sm);
	padding: var(--asf-space-sm) 0;
	text-decoration: none;
	color: var(--asf-navy-2);
	font-size: var(--asf-fs-xs);
}
.asf-biblia-destaque__link + .asf-biblia-destaque__link {
	border-top: 1px solid var(--asf-border);
}
.asf-biblia-destaque__link:hover { color: var(--asf-blue-start); }

/* Crédito obrigatório da licença (CC BY 4.0 — Bíblia Livre) */
.asf-biblia-rodape {
	margin-top: var(--asf-space-xl);
	padding-top: var(--asf-space-lg);
	border-top: 1px solid var(--asf-border);
}
.asf-biblia-creditos {
	font-size: var(--asf-fs-2xs);
	line-height: 1.6;
	color: var(--asf-text-muted);
	margin: 0;
}
.asf-biblia-creditos a { color: var(--asf-blue-end); word-break: break-word; }