/*
Theme Name: Adriana Blocks
Theme URI: https://adrianatecnologiaynegocios.com
Author: Alfredo Chavarr
Description: Tema de bloques (Full Site Editing) para la página personal de Adriana. Todo el contenido se edita con bloques nativos de WordPress. Al activarlo por primera vez sube solo las fotos a la Biblioteca de medios, arma la página de inicio y deja listos el encabezado y el pie de página.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adriana-blocks
*/

/* ---------- Colores (modo claro / oscuro automático) ---------- */
:root {
	--adr-ink: #241b33;
	--adr-indigo: #332457;
	--adr-plum: #7c4fb8;
	--adr-plum-soft: #9b72ce;
	--adr-terracotta: #c97c4c;
	--adr-terracotta-soft: #e0a57c;
	--adr-gold: #b0894f;
	--adr-cream: #fbf6ee;
	--adr-stone: #f1e7d6;
	--adr-text: #2b2338;
	--adr-muted: #6b5f7a;
	--adr-on-dark: #f5efe3;
	--adr-on-dark-muted: #c9bedc;
	--adr-line: #e4d9c4;
}
@media (prefers-color-scheme: dark) {
	:root {
		--adr-cream: #1b1526;
		--adr-stone: #221a33;
		--adr-text: #f0e9f7;
		--adr-muted: #b7a9cc;
		--adr-line: rgba(245, 239, 227, 0.14);
		--adr-ink: #120d1c;
		--adr-indigo: #1e1636;
	}
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; overflow-x: hidden; }
h1, h2, h3, h4 { text-wrap: balance; }
img, video { max-width: 100%; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.wp-block-button__link { transition: none !important; }
}

/* ---------- Secciones ---------- */
.adr-section, .adr-header, .adr-footer, .adr-page {
	padding-left: clamp(20px, 5vw, 64px);
	padding-right: clamp(20px, 5vw, 64px);
}
.adr-page { padding-top: 56px; padding-bottom: 88px; }
.adr-section { padding-top: 88px; padding-bottom: 88px; }
.adr-section--tight { padding-top: 64px; padding-bottom: 64px; }
.adr-hero { padding-top: 72px; padding-bottom: 96px; }
.adr-video-intro { padding-top: 0; padding-bottom: 88px; }
.adr-cta { padding-top: 100px; padding-bottom: 100px; }
.adr-section > .adr-section-head {
	max-width: 640px;
	margin-bottom: 48px;
	margin-left: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2)) !important;
	margin-right: auto !important;
}
@media (max-width: 781px) {
	.adr-section { padding-top: 64px; padding-bottom: 64px; }
	.adr-hero { padding-top: 40px; padding-bottom: 56px; }
	.adr-cta { padding-top: 72px; padding-bottom: 72px; }
}
.adr-cta__title { max-width: 16ch; margin-left: auto; margin-right: auto; }
.adr-cta p { max-width: 44ch; margin-left: auto; margin-right: auto; }

/* ---------- Encabezado (fijo, con desenfoque) ---------- */
.adr-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: color-mix(in srgb, var(--wp--preset--color--base) 88%, transparent);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.admin-bar .adr-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .adr-header { top: 46px; } }
.adr-header__inner { padding-top: 12px; padding-bottom: 12px; gap: 16px; }
.adr-logo { margin: 0; }
.adr-header .adr-logo img,
.adr-footer .adr-logo img { width: auto; max-width: none; display: block; }
.adr-header .adr-logo img { height: clamp(60px, 9vw, 92px); }
.adr-footer .adr-logo img { height: 56px; }
.adr-nav { font-weight: 600; }
.adr-nav .wp-block-navigation-item a { opacity: 0.75; transition: opacity 0.2s; }
.adr-nav .wp-block-navigation-item a:hover { opacity: 1; }
.adr-nav-cta .wp-block-button__link { padding: 9px 18px; font-size: 14px; }
/* El logo trae fondo blanco: "multiplicar" lo funde con el crema de la página y conserva su sombra. */
.adr-logo img { mix-blend-mode: multiply; }
@media (prefers-color-scheme: dark) {
	.adr-logo img { mix-blend-mode: normal; background: #fbf6ee; border-radius: 12px; padding: 4px 10px; }
}

/* ---------- Textos ---------- */
.adr-eyebrow {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--plum);
	margin: 0;
}
.adr-h1 { line-height: 1.03; }
.adr-h1 em { font-style: italic; color: var(--wp--preset--color--plum); font-weight: 500; }
.adr-lede { max-width: 46ch; }
.adr-close { max-width: 48ch; margin-top: 22px; }
.adr-pull {
	font-family: var(--wp--preset--font-family--fraunces);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(24px, 3vw, 32px);
	line-height: 1.35;
	margin: 0 0 24px;
	padding: 0;
}
.adr-pull p { font-size: inherit; }
.adr-lines p {
	font-family: var(--wp--preset--font-family--fraunces);
	font-style: italic;
	font-size: 19px;
	margin: 0 0 10px;
}
.adr-kicker {
	font-family: var(--wp--preset--font-family--fraunces);
	font-style: italic;
	font-size: 21px;
	line-height: 1.4;
}

/* ---------- Botones ---------- */
.wp-block-button__link { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	box-shadow: 0 8px 24px -8px rgba(124, 79, 184, 0.55);
}
.wp-block-button__link:hover { transform: translateY(-2px); }
.wp-block-button__link:focus-visible { outline: 3px solid var(--wp--preset--color--plum-soft); outline-offset: 3px; }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--line);
	box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--wp--preset--color--plum); color: var(--wp--preset--color--contrast); }
.adr-btn-terracotta .wp-block-button__link {
	background: var(--wp--preset--color--terracotta);
	color: #241b33;
	box-shadow: 0 8px 24px -8px rgba(201, 124, 76, 0.5);
}
.adr-btn-ink .wp-block-button__link {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--on-dark);
	box-shadow: none;
	padding: 12px 20px;
	font-size: 14.5px;
}

/* ---------- Imágenes y video ---------- */
.adr-hero-media { position: relative; }
.adr-badge {
	position: absolute;
	top: -18px;
	right: -14px;
	z-index: 5;
	margin: 0;
	background: var(--wp--preset--color--terracotta);
	color: #241b33;
	font-family: var(--wp--preset--font-family--fraunces);
	font-style: italic;
	font-weight: 500;
	font-size: 15px;
	line-height: 1.15;
	padding: 16px;
	border-radius: 50%;
	width: 96px;
	height: 96px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	transform: rotate(-8deg);
	box-shadow: 0 12px 28px -10px rgba(201, 124, 76, 0.6);
}
@media (max-width: 420px) {
	.adr-badge { width: 76px; height: 76px; font-size: 12.5px; padding: 10px; top: -12px; right: -8px; }
}
.adr-frame {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 24px 48px -20px rgba(34, 20, 50, 0.4);
	margin: 0;
}
.adr-frame--hero { border-radius: 18px; box-shadow: 0 30px 60px -24px rgba(34, 20, 50, 0.35); }
.adr-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adr-frame--hero img { object-position: 50% 6%; }
.adr-frame--hero figcaption {
	position: absolute;
	left: 20px;
	bottom: 20px;
	margin: 0;
	background: color-mix(in srgb, var(--wp--preset--color--base) 92%, transparent);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: var(--wp--preset--color--contrast);
	padding: 10px 16px;
	border-radius: 12px;
	font-size: 13px;
	font-weight: 700;
	box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.3);
}
.adr-clip {
	position: relative;
	max-width: 220px;
	margin: 0 auto;
	aspect-ratio: 9 / 16;
	border-radius: 16px;
	overflow: hidden;
	background: var(--wp--preset--color--ink);
	box-shadow: 0 20px 40px -18px rgba(34, 20, 50, 0.4);
}
.adr-clip video { width: 100%; height: 100%; object-fit: cover; display: block; }
.adr-clip figcaption {
	position: absolute;
	left: 12px;
	bottom: 12px;
	margin: 0;
	background: color-mix(in srgb, var(--wp--preset--color--base) 90%, transparent);
	color: var(--wp--preset--color--contrast);
	font-size: 11.5px;
	font-weight: 800;
	padding: 6px 10px;
	border-radius: 999px;
}

/* ---------- Tarjetas ---------- */
.adr-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 22px;
	padding: clamp(24px, 4vw, 40px);
}
.adr-card--narrow { max-width: 1020px; margin-left: auto; margin-right: auto; }
.adr-pilares { gap: 24px; }
.adr-pilar {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 18px;
	padding: 32px 28px;
	height: 100%;
}
.adr-pilar::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; }
.adr-pilar--ia::before { background: var(--adr-plum); }
.adr-pilar--negocios::before { background: var(--adr-terracotta); }
.adr-pilar--bienestar::before { background: var(--adr-gold); }
.adr-pilar__label { margin-bottom: 14px; }
.adr-example { padding: 20px 0; border-top: 1px solid var(--wp--preset--color--line); gap: 16px; }
.adr-example:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.adr-example .adr-n {
	font-family: var(--wp--preset--font-family--fraunces);
	font-style: italic;
	color: var(--wp--preset--color--plum);
	font-size: 20px;
	flex: 0 0 auto;
	margin: 0;
}
.adr-example h4 { margin: 0 0 6px; }
.adr-chips { gap: 10px; margin: 22px 0 28px; }
.adr-chip {
	margin: 0;
	font-size: 13.5px;
	font-weight: 700;
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
}
.adr-leadbox {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
	padding: 24px;
	margin-top: 8px;
}
.adr-redes { border-radius: 24px; padding: 56px clamp(24px, 5vw, 64px); gap: 32px; align-items: center; }
.adr-redes h2 { max-width: 22ch; }
.adr-nexus-list {
	list-style: none;
	margin: 22px 0 30px;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 20px;
}
.adr-nexus-list li {
	color: var(--wp--preset--color--on-dark-muted);
	font-size: 14.5px;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 8px;
}
.adr-nexus-list li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
	flex: 0 0 auto;
}

/* ---------- Pie de página ---------- */
.adr-footer { border-top: 1px solid var(--wp--preset--color--line); padding-top: 36px; padding-bottom: 36px; }
.adr-footer__links { margin: 0; }
.adr-footer__links a { text-decoration: none; }