/*
Theme Name:   De Resina · Luz atrapada
Description:  Tema hijo de Kadence. Portada inmersiva «Luz atrapada» (galería en WebGL con resina translúcida, vídeo y grano de película) y capa editorial de galería para el resto del sitio.
Template:     kadence
Version:      0.1.0
Text Domain:  deresina-luz
*/

/* ------------------------------------------------------------------
   Tokens
   ------------------------------------------------------------------ */
html:root {
	--cn-bg: #0c0a08;
	--cn-paper: #f3eee6;
	--cn-paper-2: #e9e2d6;
	--cn-card: #fbf8f2;
	--cn-ink: #1a1510;
	--cn-ink-2: #3b332b;
	--cn-muted: #85796b;
	--cn-line: rgba(26, 21, 16, 0.12);
	--cn-line-strong: rgba(26, 21, 16, 0.3);
	--cn-accent: #d9a24b;
	--cn-accent-ink: #120d08;
	--cn-accent-text: #8a5a14;
	--cn-accent-on-dark: #e7b866;

	--cn-display: "Cormorant Garamond", "Cormorant", Georgia, serif;
	--cn-display-weight: 500;
	--cn-display-style: italic;
	--cn-display-tracking: -0.01em;
	--cn-display-leading: 0.98;
	--cn-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--cn-hero-size: clamp(3.4rem, 9vw, 8.6rem);
	--cn-hero-size-m: clamp(3.2rem, 15vw, 4.8rem);

	--cn-radius: 2px;
	--cn-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--cn-wrap: 1280px;
	--cn-gutter: clamp(16px, 4vw, 56px);
	--cn-grain: 0.07;
	--cn-marquee-sep: "◆";
	--cn-veil-dark: linear-gradient(90deg, rgba(8, 6, 5, 0.74) 0%, rgba(8, 6, 5, 0.36) 40%, rgba(8, 6, 5, 0) 66%);
	--cn-veil-light: linear-gradient(90deg, rgba(243, 238, 230, 0.9) 0%, rgba(243, 238, 230, 0.5) 36%, rgba(243, 238, 230, 0) 60%);

	--global-palette1: #1a1510;
	--global-palette2: #8a5a14;
	--global-palette3: #1a1510;
	--global-palette4: #3b332b;
	--global-palette5: #5c5247;
	--global-palette6: #85796b;
	--global-palette7: #e9e2d6;
	--global-palette8: #f3eee6;
	--global-palette9: #fbf8f2;
	--global-heading-font-family: var(--cn-display);
	--global-body-font-family: var(--cn-sans);
}

/* ------------------------------------------------------------------
   Base (todas las páginas)
   ------------------------------------------------------------------ */
body {
	background: var(--cn-paper);
	color: var(--cn-ink-2);
	font-family: var(--cn-sans);
	-webkit-font-smoothing: antialiased;
}
.content-bg, body.content-style-unboxed .site { background: var(--cn-paper); }
.entry.single-entry, .content-style-boxed .content-bg:not(.loop-entry) { background: var(--cn-card); box-shadow: none; border: 1px solid var(--cn-line); border-radius: var(--cn-radius); }

h1, h2, h3, .entry-title {
	font-family: var(--cn-display);
	font-weight: 500;
	font-style: italic;
	letter-spacing: -0.01em;
	line-height: 1.02;
	color: var(--cn-ink);
}
h4, h5, h6 { font-family: var(--cn-sans); font-weight: 600; }
.entry-content h2 { font-size: clamp(2.1rem, 3.8vw, 3.2rem); margin-top: 1.4em; }
.entry-content h3 { font-size: clamp(1.6rem, 2.4vw, 2.1rem); }
a { color: var(--cn-accent-text); text-underline-offset: 3px; }
::selection { background: var(--cn-accent); color: var(--cn-ink); }
:focus-visible { outline: 2px solid var(--cn-accent); outline-offset: 3px; }

/* Cabecera: sustituye el azul del personalizador por el negro de galería */
html #masthead { background: transparent; }
#masthead .site-header-row-container-inner,
#mobile-header .site-header-row-container-inner {
	background: rgba(12, 10, 8, 0.94);
	backdrop-filter: saturate(1.2) blur(12px);
	-webkit-backdrop-filter: saturate(1.2) blur(12px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
#masthead .header-navigation .header-menu-container > ul > li > a,
#mobile-header .menu-toggle-open { color: rgba(255, 255, 255, 0.86); }
#masthead .header-navigation .header-menu-container > ul > li > a {
	font-family: var(--cn-sans);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
#masthead .header-navigation .header-menu-container > ul > li > a:hover,
#masthead .header-navigation .header-menu-container > ul > li.current-menu-item > a { color: var(--cn-accent-on-dark); }
.header-navigation .header-menu-container ul ul.sub-menu { background: #15110d; border: 1px solid rgba(255, 255, 255, 0.07); box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45); }
.header-navigation .header-menu-container ul ul li.menu-item > a { color: rgba(255, 255, 255, 0.8); font-size: 14px; }
.header-navigation .header-menu-container ul ul li.menu-item > a:hover { color: var(--cn-accent-on-dark); background: rgba(255, 255, 255, 0.04); }

/* Logotipo tipográfico */
.site-branding .brand:has(.cn-wordmark) .site-title-wrap { display: none; }
.cn-wordmark { display: inline-flex; align-items: baseline; gap: 10px; line-height: 1; }
.cn-wordmark__name { font-family: var(--cn-display); font-style: italic; font-weight: 500; font-size: clamp(26px, 2.4vw, 32px); color: #fff; }
.cn-wordmark__tld { font-family: var(--cn-sans); font-size: 10px; font-weight: 600; letter-spacing: 0.34em; text-transform: uppercase; color: var(--cn-accent-on-dark); }

/* Cabecera de página interior */
.entry-hero.page-hero-section .entry-hero-container-inner {
	background: var(--cn-bg);
	background-image: radial-gradient(ellipse at 50% 120%, rgba(217, 162, 75, 0.28), rgba(217, 162, 75, 0) 60%);
}
.entry-hero.page-hero-section .entry-header { min-height: 260px; justify-content: flex-end; padding-bottom: 36px; }
.entry-hero .entry-title { color: #fff; font-size: clamp(2.8rem, 6.5vw, 5.6rem); }
.entry-hero .kadence-breadcrumbs, .entry-hero .kadence-breadcrumbs a { color: rgba(255, 255, 255, 0.6); }

/* Galerías de colecciones: pie de foto como cartela de museo */
.wp-block-gallery.has-nested-images figure.wp-block-image { overflow: hidden; border-radius: var(--cn-radius); background: #fff; }
.wp-block-gallery.has-nested-images figure.wp-block-image img { transition: transform 1s var(--cn-ease); }
.wp-block-gallery.has-nested-images figure.wp-block-image:hover img { transform: scale(1.04); }
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	background: linear-gradient(0deg, rgba(12, 10, 8, 0.85), rgba(12, 10, 8, 0));
	font-family: var(--cn-display);
	font-style: italic;
	font-size: clamp(1.2rem, 1.8vw, 1.6rem);
	padding: 34px 14px 14px;
}
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption a { color: #fff; text-decoration: none; }

.wp-block-button__link, .button, button.button, input[type="submit"] { border-radius: var(--cn-radius); font-family: var(--cn-sans); font-weight: 600; letter-spacing: 0.06em; }

/* Pie */
#colophon, .site-footer .site-footer-row-container-inner { background: var(--cn-bg); color: rgba(255, 255, 255, 0.62); }
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--cn-accent-on-dark); }