/*
Theme Name: Astra — Itahisa Valido Santana
Theme URI: https://smartbytes.es
Template: astra
Author: Smartbytes
Author URI: https://smartbytes.es
Description: Tema hijo de Astra para la web de Itahisa Valido Santana, Procuradora de los Tribunales. Añade fuentes locales, estilos de marca, datos estructurados y la franja del Kit Digital.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-itahisa
*/

/* ---------- Fuentes locales (sin conexión a Google Fonts) ---------- */
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/inter-latin-wght-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-latin-500-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-latin-600-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Cormorant Garamond";
	font-style: italic;
	font-weight: 500;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-latin-500-italic.woff2") format("woff2");
}

/* ---------- Marca ---------- */
:root {
	--ivs-carbon: #221C16;
	--ivs-dorado: #A9813C;
	--ivs-dorado-oscuro: #7C5B28;
	--ivs-crema: #F5EEE4;
	--ivs-gris: #EDE6DA;
}

body, button, input, select, textarea {
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}
h1, h2, h3, h4, h5, h6,
.site-title, .entry-title {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-weight: 500;
}

::selection { background: var(--ivs-dorado); color: var(--ivs-carbon); }

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--ivs-dorado-oscuro);
	outline-offset: 3px;
}
.site-footer :where(a, button):focus-visible { outline-color: var(--ivs-dorado); }

/* ---------- Cabecera ---------- */
.site-header .site-title { font-size: clamp(1.2rem, 2.4vw, 1.55rem); font-weight: 600; letter-spacing: .03em; line-height: 1.05; margin: 0; }
.site-header .site-title a { color: var(--ivs-carbon); }
.site-header .site-description {
	font-family: "Inter", sans-serif;
	font-size: .66rem;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--ivs-dorado-oscuro);
	margin: .2rem 0 0;
}
.main-header-menu .menu-link {
	font-size: .8125rem;
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	position: relative;
}
.ast-desktop .main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 1em; right: 1em; bottom: 1.2em;
	height: 1px;
	background: var(--ivs-dorado);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}
.ast-desktop .main-header-menu > .menu-item > .menu-link:hover::after,
.ast-desktop .main-header-menu > .current-menu-item > .menu-link::after { transform: scaleX(1); }

/* ---------- Detalles de marca usados en Elementor (clase CSS del widget) ---------- */
.ivs-kicker .elementor-heading-title,
.ivs-kicker {
	letter-spacing: .28em;
	text-transform: uppercase;
}
.ivs-foto-marco { position: relative; }
.ivs-foto-marco::before {
	content: "";
	position: absolute;
	inset: 1.25rem -1.25rem -1.25rem 1.25rem;
	border: 1px solid var(--ivs-dorado);
	z-index: 0;
}
.ivs-foto-marco img { position: relative; z-index: 1; box-shadow: 0 30px 60px -30px rgba(34, 28, 22, .45); }
@media (max-width: 767px) {
	.ivs-foto-marco::before { inset: .75rem -.75rem -.75rem .75rem; }
}

.ivs-card { transition: transform .25s ease, box-shadow .25s ease; }
.ivs-card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -24px rgba(34, 28, 22, .35); }
@media (prefers-reduced-motion: reduce) { .ivs-card, .ivs-card:hover { transition: none; transform: none; } }

.ivs-lista ul { list-style: none; padding-left: 0; margin: 0; }
.ivs-lista li {
	padding: .7rem 0 .7rem 1.6rem;
	border-bottom: 1px solid rgba(169, 129, 60, .3);
	position: relative;
}
.ivs-lista li::before {
	content: "✦";
	position: absolute;
	left: 0;
	top: .8rem;
	font-size: .75rem;
	color: var(--ivs-dorado);
}
.ivs-lista li:last-child { border-bottom: 0; }

/* Enlaces dentro de texto: subrayados, no se distinguen solo por el color (WCAG 1.4.1). */
.site-content .elementor-widget-text-editor p a,
.site-content .elementor-widget-text-editor li a,
.site-content .ivs-form p a { text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
.site-content .elementor-widget-text-editor p a:hover,
.site-content .elementor-widget-text-editor li a:hover,
.site-content .ivs-form p a:hover { text-decoration-thickness: 2px; }
.site-content .ivs-dato p a { text-decoration: none; }
.site-content .ivs-dato p a:hover { text-decoration: underline; }

.ivs-dato a { text-decoration: none; }
.ivs-dato a:hover { text-decoration: underline; }

.ivs-legal h2 { font-size: 1.9rem; margin-top: 2.25rem; }
.ivs-legal ul { margin-left: 1.25rem; }

/* ---------- Formulario de contacto (Contact Form 7) ---------- */
.ivs-form { --ivs-borde: #8A7560; --ivs-error: #A1231D; }
.ivs-form p { margin: 0 0 1.9rem; }
.ivs-form__nota { font-size: .875rem; }
.ivs-form__fila { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
@media (max-width: 600px) { .ivs-form__fila { grid-template-columns: 1fr; } }
.ivs-form label { display: block; font-size: .9375rem; font-weight: 500; color: var(--ivs-carbon); }
.ivs-form .wpcf7-form-control-wrap { display: block; margin-top: .35rem; position: relative; }
.ivs-form input[type="text"],
.ivs-form input[type="email"],
.ivs-form input[type="tel"],
.ivs-form textarea {
	width: 100%;
	padding: .8rem .9rem;
	font-size: 1rem;
	color: var(--ivs-carbon);
	background: #fff;
	border: 1px solid var(--ivs-borde); /* 4,3:1 sobre blanco: cumple el 3:1 de componentes */
	border-radius: 0;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.ivs-form textarea { min-height: 9rem; resize: vertical; }
.ivs-form input:focus-visible,
.ivs-form textarea:focus-visible {
	outline: 2px solid var(--ivs-dorado-oscuro);
	outline-offset: 2px;
	border-color: var(--ivs-carbon);
}
.ivs-form input[aria-invalid="true"],
.ivs-form textarea[aria-invalid="true"] { border-color: var(--ivs-error); border-width: 2px; }
/* El aviso ocupa el margen inferior reservado: aparecer o desaparecer no desplaza el formulario. */
.ivs-form .wpcf7-not-valid-tip { position: absolute; left: 0; top: 100%; color: var(--ivs-error); font-size: .8125rem; font-weight: 500; line-height: 1.3; margin-top: .25rem; }
.ivs-form .wpcf7-not-valid-tip::before { content: "⚠ "; }
.ivs-form__legal { font-size: .8125rem; line-height: 1.55; padding: 1rem 1.1rem; background: rgba(255, 255, 255, .6); border-left: 2px solid var(--ivs-dorado); margin-bottom: 1rem; }
.ivs-form__legal p { margin: 0; }
.ivs-form .wpcf7-acceptance .wpcf7-list-item { margin: 0; display: block; }
.ivs-form .wpcf7-acceptance label { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; cursor: pointer; }
.ivs-form input[type="checkbox"] { width: 1.25rem; height: 1.25rem; margin-top: .15rem; flex: none; accent-color: var(--ivs-dorado-oscuro); }
.ivs-form input[type="submit"] {
	font-family: "Inter", sans-serif;
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: #fff;
	background: var(--ivs-dorado-oscuro);
	border: 0;
	border-radius: 0;
	padding: 1rem 1.9rem;
	cursor: pointer;
	transition: background-color .3s ease;
}
.ivs-form input[type="submit"]:hover,
.ivs-form input[type="submit"]:focus-visible { background: var(--ivs-carbon); }
.ivs-form input[type="submit"]:disabled { opacity: .6; cursor: not-allowed; }
.ivs-form .wpcf7-spinner { vertical-align: middle; }
.wpcf7 form .wpcf7-response-output { margin: 1rem 0 0; padding: .9rem 1rem; border-width: 2px; font-size: .9375rem; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: var(--ivs-error, #A1231D); color: #A1231D; background: #fff; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #2F6B2F; color: #1F4D1F; background: #fff; }

/* ---------- Banner de cookies (CookieYes) ---------- */
/* Botones del aviso: mismo ancho y sin márgenes heredados del tema. */
.cky-consent-container .cky-notice-btn-wrapper { display: flex; flex-direction: column; gap: 10px; }
.cky-consent-container .cky-notice-btn-wrapper .cky-btn { width: 100%; margin: 0; }
.cky-consent-container .cky-btn,
.cky-modal .cky-btn { opacity: 1; font-family: "Inter", sans-serif; font-weight: 600; letter-spacing: .08em; }
.cky-consent-container .cky-btn:hover,
.cky-modal .cky-btn:hover { opacity: 1; filter: brightness(.85); }
/* Títulos de categoría: sin el espaciado de los botones del tema. */
.cky-modal .cky-accordion-btn { letter-spacing: normal; text-transform: none; font-family: "Inter", sans-serif; font-weight: 600; }
.cky-consent-container :focus-visible,
.cky-modal :focus-visible,
.cky-btn-revisit-wrapper :focus-visible { outline: 2px solid #7C5B28; outline-offset: 2px; }

/* ---------- Pie ---------- */
.site-footer { font-size: .875rem; }
.site-footer .ast-builder-html-element h2 {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.35rem;
	line-height: 1.2;
	font-weight: 500;
	color: #fff;
	margin-bottom: .75rem;
}
.site-footer a { text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.site-footer .footer-widget-area img { max-width: 170px; height: auto; }
.site-below-footer-wrap { border-top: 1px solid rgba(169, 129, 60, .6); }
#astra-footer-menu .menu-link { font-size: .875rem; }
@media (max-width: 921px) {
	.site-footer .site-primary-footer-wrap,
	.site-footer .site-below-footer-wrap { padding-left: 24px; padding-right: 24px; }
	.site-primary-footer-wrap .site-footer-section + .site-footer-section { margin-top: 2.25rem; }
}

.ivs-kit-digital { background: #fff; padding: 1rem clamp(1rem, 4vw, 2.5rem); text-align: center; }
.ivs-kit-digital img { width: 100%; max-width: 900px; height: auto; display: inline-block; }

/* ---------- Animaciones ---------- */

/* Entrada más corta y suave que la de serie de Elementor (desplaza 100% de la altura). */
@keyframes ivsFadeInUp {
	from { opacity: 0; transform: translate3d(0, 28px, 0); }
	to   { opacity: 1; transform: none; }
}
@keyframes ivsFadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}
.elementor-element.animated { animation-duration: .9s; animation-timing-function: cubic-bezier(.22, .61, .36, 1); }
.elementor-element.animated.animated-slow { animation-duration: 1.4s; }
.elementor-element.animated.fadeInUp { animation-name: ivsFadeInUp; }
.elementor-element.animated.fadeIn { animation-name: ivsFadeIn; }

/* Filete dorado: las líneas se dibujan desde el centro al aparecer. */
.elementor-widget-divider.animated .elementor-divider-separator::before,
.elementor-widget-divider.animated .elementor-divider-separator::after {
	transform-origin: center;
	animation: ivsDibujar 1.1s cubic-bezier(.22, .61, .36, 1) both;
}
@keyframes ivsDibujar {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

/* Fotos: zoom lento dentro de su marco y desplazamiento del filete dorado. */
.elementor-widget-image:not(.ivs-foto-marco) { overflow: hidden; }
.elementor-widget-image img { transition: transform 1.2s cubic-bezier(.22, .61, .36, 1); }
.elementor-widget-image:not(.ivs-foto-marco):hover img { transform: scale(1.04); }
.ivs-foto-marco::before { transition: transform .6s cubic-bezier(.22, .61, .36, 1); }
.ivs-foto-marco:hover::before { transform: translate(-10px, -10px); }

/* Botones: leve elevación. */
.elementor-button { transition: background-color .3s ease, color .3s ease, border-color .3s ease, transform .3s ease, box-shadow .3s ease; }
.elementor-button:hover { transform: translateY(-2px); box-shadow: 0 12px 24px -14px rgba(34, 28, 22, .55); }

/* Listas: la estrella dorada se desplaza al pasar el ratón. */
.ivs-lista li::before { transition: transform .3s ease; }
.ivs-lista li:hover::before { transform: translateX(4px); }

/* Accesibilidad: sin animaciones si el usuario ha pedido reducir el movimiento. */
@media (prefers-reduced-motion: reduce) {
	.elementor-invisible { visibility: visible !important; opacity: 1 !important; }
	.elementor-element.animated,
	.elementor-widget-divider.animated .elementor-divider-separator::before,
	.elementor-widget-divider.animated .elementor-divider-separator::after { animation: none !important; }
	.elementor-widget-image img,
	.ivs-foto-marco::before,
	.elementor-button,
	.ivs-lista li::before { transition: none !important; }
	.elementor-widget-image:hover img,
	.ivs-foto-marco:hover::before,
	.elementor-button:hover,
	.ivs-lista li:hover::before { transform: none !important; }
}
