/* Tarot Gratis — estilos del tema (ligero, sin dependencias) */

body {
	background-color: #0c1030;
	background-image:
		radial-gradient(1px 1px at 12% 18%, rgba(242, 222, 176, .55) 50%, transparent 51%),
		radial-gradient(1px 1px at 78% 9%, rgba(255, 255, 255, .45) 50%, transparent 51%),
		radial-gradient(1.5px 1.5px at 42% 33%, rgba(242, 222, 176, .4) 50%, transparent 51%),
		radial-gradient(1px 1px at 88% 41%, rgba(255, 255, 255, .35) 50%, transparent 51%),
		radial-gradient(1px 1px at 23% 62%, rgba(255, 255, 255, .3) 50%, transparent 51%),
		radial-gradient(1.5px 1.5px at 66% 71%, rgba(242, 222, 176, .35) 50%, transparent 51%),
		radial-gradient(ellipse 90% 60% at 50% -10%, #232a66 0%, rgba(12, 16, 48, 0) 70%);
	background-attachment: fixed;
	-webkit-font-smoothing: antialiased;
}

::selection { background: #d6b26e; color: #0c1030; }

/* Cabecera */
.tg-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(12, 16, 48, .82);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(214, 178, 110, .18);
}
.admin-bar .tg-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .tg-header { top: 0; } }

.tg-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-top: .75rem;
	padding-bottom: .75rem;
}
.tg-header .wp-block-site-title a { text-decoration: none; }
.tg-header .wp-block-site-title a::before { content: "☾\FE0E  "; color: #d6b26e; }
.tg-header .wp-block-navigation a { text-decoration: none; }
.tg-header .wp-block-navigation a:hover { color: #d6b26e; }
.tg-header .wp-block-navigation__responsive-container.is-menu-open { background: #0c1030; color: #e6e3f4; }
.tg-header-right { display: flex; align-items: center; gap: 1.25rem; }

/* Texto */
.tg-center { text-align: center; }
.tg-lead { font-size: 1.2rem; color: #c9c6e6; max-width: 640px; margin-left: auto !important; margin-right: auto !important; text-align: center; }
.tg-kicker {
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .25em;
	font-size: .78rem;
	color: #d6b26e;
	margin-bottom: .25rem !important;
}
.tg-kicker::before, .tg-kicker::after { content: " ✦\FE0E "; opacity: .7; }

h1, h2 { text-wrap: balance; }
p { text-wrap: pretty; }

.tg-hero { padding-top: clamp(2.5rem, 7vw, 5rem); padding-bottom: 1rem; }
.tg-hero h1 {
	text-align: center;
	background: linear-gradient(180deg, #f8f2e4 30%, #d6b26e 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.tg-seccion { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: clamp(2.5rem, 6vw, 4.5rem); }

/* Bloques: estilos de grupo */
.wp-block-group.is-style-tarjeta {
	background: linear-gradient(180deg, rgba(35, 42, 102, .55), rgba(21, 26, 69, .55));
	border: 1px solid rgba(214, 178, 110, .22);
	border-radius: 18px;
	padding: clamp(1.25rem, 3vw, 2rem);
	box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
}
.wp-block-group.is-style-destacado-oro {
	background:
		radial-gradient(ellipse at top, rgba(214, 178, 110, .18), transparent 70%),
		#151a45;
	border: 1px solid #d6b26e;
	border-radius: 22px;
	padding: clamp(1.5rem, 4vw, 3rem);
	text-align: center;
}

/* Tarjetas de tiradas */
.tg-tiradas .wp-block-column {
	background: linear-gradient(180deg, rgba(35, 42, 102, .5), rgba(21, 26, 69, .5));
	border: 1px solid rgba(214, 178, 110, .2);
	border-radius: 18px;
	padding: 1.5rem;
	text-align: center;
	transition: transform .2s ease, border-color .2s ease;
}
.tg-tiradas .wp-block-column:hover { transform: translateY(-4px); border-color: #d6b26e; }
.tg-icono { font-size: 2.2rem; line-height: 1; color: #d6b26e; margin-bottom: .5rem !important; }
.tg-tiradas h3 { margin-top: .25rem; }
.tg-tiradas p { color: #c9c6e6; font-size: .95rem; }

/* Pasos */
.tg-paso-num {
	display: inline-grid;
	place-items: center;
	width: 2.6rem; height: 2.6rem;
	border-radius: 50%;
	border: 1px solid #d6b26e;
	color: #d6b26e;
	font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
	font-size: 1.2rem;
}

/* FAQ */
.wp-block-details { background: rgba(21, 26, 69, .6); }
.wp-block-details summary { cursor: pointer; font-weight: 600; color: #f8f2e4; }
.wp-block-details[open] summary { color: #d6b26e; }

/* Contenido de artículos */
.wp-block-post-content a { text-underline-offset: 3px; }
.wp-block-post-content blockquote { border-left: 2px solid #d6b26e; padding-left: 1.25rem; font-style: italic; color: #f2deb0; }
.wp-block-post-featured-image img { border-radius: 16px; }
.tg-migas { font-size: .85rem; color: #a7a4cc; margin-bottom: 1rem; }
.tg-migas a { color: #a7a4cc; text-decoration: none; }
.tg-migas a:hover { color: #d6b26e; }

/* Listado de entradas */
.tg-listado .wp-block-post {
	background: rgba(21, 26, 69, .6);
	border: 1px solid rgba(214, 178, 110, .18);
	border-radius: 16px;
	padding: 1.25rem;
}
.tg-listado .wp-block-post-title a { text-decoration: none; color: #f8f2e4; }
.tg-listado .wp-block-post-title a:hover { color: #d6b26e; }
.tg-listado .wp-block-post-excerpt { color: #c9c6e6; font-size: .95rem; }

/* Pie */
.tg-footer {
	border-top: 1px solid rgba(214, 178, 110, .18);
	background: #090c25;
	padding-top: 3rem;
	padding-bottom: 6rem; /* espacio para la barra de llamada en móvil */
	font-size: .9rem;
	color: #a7a4cc;
}
.tg-footer a { color: #c9c6e6; text-decoration: none; }
.tg-footer a:hover { color: #d6b26e; }
.tg-footer-legal { font-size: .8rem; opacity: .85; }

/* Accesibilidad / movimiento */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Landing de tirada */
.tg-titulo-hero {
	text-align: center;
	background: linear-gradient(180deg, #f8f2e4 30%, #d6b26e 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.tg-hero .tg-migas { text-align: center; }
.tg-tirada-wrap { margin-bottom: 2rem; }

/* Contenido SEO */
.tg-contenido h2 { margin-top: 3rem; }
.tg-contenido ul li { margin-bottom: .4rem; }
.tg-contenido ul li::marker { color: #d6b26e; }
.tg-cta-intermedio { text-align: center; margin: 2.5rem auto !important; }
.tg-cta-intermedio p { margin-bottom: .25rem; }
.tg-cta-intermedio .tg-cta-tit { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; font-size: 1.35rem; color: #f8f2e4; }

/* Ajustes rejilla de tiradas */
.tg-tiradas .tg-icono { font-size: 2.2rem; line-height: 1; color: #d6b26e; margin-bottom: .25rem; }
.tg-tiradas h3 a { text-decoration: none; }
.tg-tiradas h3 a:hover { color: #f2deb0; }
.tg-tiradas h3 { font-size: 1.4rem; }

/* ---------- Cabecera: el desenfoque va en un pseudo-elemento para no
   atrapar el menú móvil (backdrop-filter crea un contenedor para position:fixed) ---------- */
.tg-header { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; isolation: isolate; }
.tg-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: rgba(12, 16, 48, .82);
	backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}

/* ---------- Menú móvil ---------- */
.tg-header .wp-block-navigation__responsive-container-open { color: #d6b26e; padding: 6px; }
.tg-header .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
.tg-header .wp-block-navigation__responsive-container.is-menu-open {
	background:
		radial-gradient(1px 1px at 18% 22%, rgba(242, 222, 176, .6) 50%, transparent 51%),
		radial-gradient(1px 1px at 82% 14%, rgba(255, 255, 255, .5) 50%, transparent 51%),
		radial-gradient(1.5px 1.5px at 70% 78%, rgba(242, 222, 176, .45) 50%, transparent 51%),
		radial-gradient(1px 1px at 12% 86%, rgba(255, 255, 255, .35) 50%, transparent 51%),
		radial-gradient(ellipse 120% 70% at 50% 0%, #2a3278 0%, #0c1030 70%) !important;
	color: #f8f2e4 !important;
	padding: 1.25rem 1.5rem 2rem !important;
	animation: tg-menu-in .35s ease both;
}
@keyframes tg-menu-in { from { opacity: 0; transform: translateY(-8px); } }
.tg-header .wp-block-navigation__responsive-close { width: 100%; max-width: 420px; margin: 0 auto; }
.tg-header .wp-block-navigation__responsive-container-close { color: #d6b26e; top: 0; right: 0; }
.tg-header .wp-block-navigation__responsive-container-close svg { width: 32px; height: 32px; }
.tg-header .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 4.5rem !important; align-items: center !important;
}
.tg-header .is-menu-open .wp-block-navigation__container {
	flex-direction: column; align-items: stretch !important; gap: 0 !important;
	width: 100%; max-width: 420px; margin: 0 auto;
}
.tg-header .is-menu-open .wp-block-navigation__container::before {
	content: "✦\FE0E  Tiradas de tarot  ✦\FE0E";
	display: block; text-align: center; margin-bottom: 1.25rem;
	font-size: .75rem; letter-spacing: .28em; text-transform: uppercase; color: #d6b26e;
}
.tg-header .is-menu-open .wp-block-navigation-item {
	width: 100%; justify-content: center !important;
	border-bottom: 1px solid rgba(214, 178, 110, .2);
	animation: tg-menu-item .4s ease both;
}
.tg-header .is-menu-open .wp-block-navigation-item:first-child { border-top: 1px solid rgba(214, 178, 110, .2); }
.tg-header .is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: .05s; }
.tg-header .is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: .1s; }
.tg-header .is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: .15s; }
.tg-header .is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: .2s; }
@keyframes tg-menu-item { from { opacity: 0; transform: translateY(10px); } }
.tg-header .is-menu-open .wp-block-navigation-item__content {
	display: block; width: 100%; text-align: center; padding: 1.05rem 0 !important;
	font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
	font-size: 1.55rem; color: #f8f2e4 !important;
}
.tg-header .is-menu-open .wp-block-navigation-item__content:hover,
.tg-header .is-menu-open .current-menu-item > .wp-block-navigation-item__content { color: #d6b26e !important; }
.tg-header .is-menu-open .wp-block-navigation__container::after {
	content: "Tarot gratis · Sin registro · 22 Arcanos Mayores";
	display: block; text-align: center; margin-top: 1.5rem; font-size: .8rem; color: #a7a4cc;
}
@media (max-width: 600px) {
	.tg-header .wp-block-site-title { font-size: 1.3rem; }
	.tg-header-right { gap: .75rem; }
}