/* Portfolio de bodas.
   La identidad visual NO se define aqui: se hereda del kit de Elementor.
   Colores y tipografias entran por las variables globales que Elementor ya
   imprime en post-8.css; si algun dia cambian en el kit, estas paginas siguen.

   Lo unico literal son el terracota y el dorado de los botones, porque en este
   sitio no son colores globales del kit sino estilos por widget. Quedan aqui
   declarados una sola vez para poder cambiarlos en un sitio. */

.dwlc-wedding,
.dwlc-archive {
	--dwlc-ink:       var(--e-global-color-primary, #545748);
	--dwlc-text:      var(--e-global-color-text, #6D705E);
	--dwlc-muted:     var(--e-global-color-secondary, #54595F);
	--dwlc-surface:   #F6F4EC;
	--dwlc-cta:       #DE967D;
	--dwlc-cta-alt:   #C0A163;
	--dwlc-rule:      rgba(84, 87, 72, .18);

	--dwlc-font-head: var(--e-global-typography-primary-font-family, "Marcellus"), Georgia, serif;
	--dwlc-font-ui:   var(--e-global-typography-secondary-font-family, "Montserrat"), Helvetica, Arial, sans-serif;

	/* El header del Theme Builder es position:fixed con min-height 90px y margen
	   inferior negativo: no ocupa sitio en el flujo. Las paginas de Elementor lo
	   compensan con el padding de su primera seccion; aqui hay que hacerlo a mano. */
	--dwlc-header-offset: 90px;

	color: var(--dwlc-text);
	font-family: var(--e-global-typography-text-font-family, "Marcellus"), Georgia, serif;
	font-weight: var(--e-global-typography-text-font-weight, normal);
	margin: 0 auto;
	padding: calc(var(--dwlc-header-offset) + 2.5rem) 1.25rem 4rem;
}

/*
 * El ancho va aparte y con especificidad elevada a proposito.
 * hello-elementor declara `body:not([class*=elementor-page-]) .site-main{max-width:1140px}`,
 * que pesa mas que una clase suelta. Ese :not() deja de protegernos justo cuando se
 * quita Elementor de la pagina, que es lo que hace la migracion.
 */
body .dwlc-wedding.site-main {
	max-width: 820px;
}

body .dwlc-archive.site-main {
	max-width: 1100px;
}

/* Los anclajes tampoco deben quedar debajo del header fijo. */
.dwlc-wedding :target,
.dwlc-narrative h2 {
	scroll-margin-top: calc(var(--dwlc-header-offset) + 1rem);
}

.dwlc-wedding h1,
.dwlc-wedding h2,
.dwlc-wedding h3,
.dwlc-archive h1,
.dwlc-archive h2 {
	font-family: var(--dwlc-font-head);
	color: var(--dwlc-ink);
	font-weight: var(--e-global-typography-primary-font-weight, 600);
}

/* Breadcrumb */
.dwlc-breadcrumb {
	font-family: var(--dwlc-font-ui);
	font-size: .75rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	opacity: .65;
	margin-bottom: 1.5rem;
}

.dwlc-breadcrumb a {
	color: var(--dwlc-ink);
	text-decoration: none;
}

.dwlc-breadcrumb a:hover {
	text-decoration: underline;
}

/* Hero */
.dwlc-hero__headline {
	font-size: clamp(1.9rem, 4vw, 2.75rem);
	line-height: 1.15;
	margin: 0 0 .75rem;
}

.dwlc-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .9rem;
	font-family: var(--dwlc-font-ui);
	font-size: .8125rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	margin: 0 0 1.75rem;
}

.dwlc-hero__couple {
	color: var(--dwlc-ink);
	font-weight: 500;
}

.dwlc-hero__image {
	margin: 0 0 1.75rem;
}

.dwlc-hero__image img,
.dwlc-gallery figure img,
.dwlc-gallery-inline figure img,
.dwlc-card img {
	width: 100%;
	height: auto;
	display: block;
}

.dwlc-hero__intro {
	font-size: 1.15rem;
	line-height: 1.65;
}

/* At a glance */
.dwlc-glance {
	margin: 2.5rem 0;
	padding: 1.75rem;
	background: var(--dwlc-surface);
}

.dwlc-glance__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1.5rem;
	margin: 0;
}

.dwlc-glance__item dt {
	font-family: var(--dwlc-font-ui);
	font-size: .6875rem;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	opacity: .65;
	margin-bottom: .35rem;
}

.dwlc-glance__item dd {
	margin: 0;
	font-family: var(--dwlc-font-head);
	font-size: 1.1rem;
	color: var(--dwlc-ink);
}

/* Narrativa */
.dwlc-narrative {
	line-height: 1.75;
}

.dwlc-narrative h2 {
	margin-top: 2.75rem;
	font-size: clamp(1.35rem, 2.5vw, 1.65rem);
}

/* Galerias */
.dwlc-gallery__grid,
.dwlc-gallery-inline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1rem;
	margin: 1.75rem 0;
}

.dwlc-gallery figure,
.dwlc-gallery-inline figure {
	margin: 0;
}

/*
 * Ratio uniforme en las rejillas.
 *
 * Sin esto, una foto vertical estira su fila y deja huecos muertos junto a las
 * horizontales. 10 de las 12 fotos de una boda tipica son 3:2 horizontal, asi que
 * ese es el ratio de la celda: las horizontales entran intactas y solo las
 * verticales se recortan en la miniatura.
 *
 * El recorte es solo de la rejilla. El schema, la imagen de redes y el srcset
 * siguen apuntando al original completo.
 */
.dwlc-gallery__grid img,
.dwlc-gallery-inline img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	object-position: center;
}

.dwlc-gallery figcaption {
	font-family: var(--dwlc-font-ui);
	font-size: .75rem;
	letter-spacing: .04em;
	opacity: .7;
	margin-top: .5rem;
}

/* CTA: mismo lenguaje que los botones del header (Montserrat 12/500, mayusculas,
   letter-spacing 2px, terracota, sin radio, padding 18/30) */
.dwlc-cta {
	margin: 3rem 0;
	text-align: center;
}

.dwlc-cta__link {
	display: inline-block;
	padding: 18px 30px;
	background: var(--dwlc-cta);
	border: 1px solid var(--dwlc-cta);
	color: #FFFFFF;
	font-family: var(--dwlc-font-ui);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.dwlc-cta__link:hover,
.dwlc-cta__link:focus {
	background: transparent;
	color: var(--dwlc-cta);
}

/* Testimonio */
.dwlc-testimonial {
	margin: 3.5rem 0;
	padding: 2rem;
	background: var(--dwlc-surface);
	border-left: 2px solid var(--dwlc-cta-alt);
	font-family: var(--dwlc-font-head);
	font-size: 1.2rem;
	line-height: 1.6;
	color: var(--dwlc-ink);
}

.dwlc-testimonial cite {
	display: block;
	margin-top: 1rem;
	font-family: var(--dwlc-font-ui);
	font-size: .75rem;
	font-style: normal;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .7;
}

/* Inversion */
.dwlc-investment {
	margin: 3rem 0;
	padding-top: 2rem;
	border-top: 1px solid var(--dwlc-rule);
}

.dwlc-investment__amount {
	font-family: var(--dwlc-font-head);
	font-size: 1.9rem;
	color: var(--dwlc-ink);
	margin: .25rem 0;
}

.dwlc-investment__note {
	font-family: var(--dwlc-font-ui);
	font-size: .85rem;
	opacity: .75;
}

/* Vendors */
.dwlc-vendors {
	margin: 3rem 0;
	padding-top: 2rem;
	border-top: 1px solid var(--dwlc-rule);
}

.dwlc-vendors ul {
	list-style: none;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.25rem;
}

.dwlc-vendors__role {
	display: block;
	font-family: var(--dwlc-font-ui);
	font-size: .6875rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	opacity: .6;
	margin-bottom: .15rem;
}

.dwlc-vendors a {
	color: var(--dwlc-ink);
}

/* Relacionadas: dos columnas, portada y nombres */
.dwlc-related {
	margin: 3rem 0;
	padding-top: 2rem;
	border-top: 1px solid var(--dwlc-rule);
}

.dwlc-related__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-top: 1.5rem;
}

.dwlc-related__item a {
	display: block;
	color: var(--dwlc-ink);
	text-decoration: none;
}

.dwlc-related__item img {
	width: 100%;
	height: 260px;
	object-fit: cover;
	display: block;
}

.dwlc-related__names {
	display: block;
	margin-top: .75rem;
	font-family: var(--dwlc-font-head);
	font-size: 1.1rem;
}

@media (max-width: 600px) {
	.dwlc-related__grid {
		grid-template-columns: 1fr;
	}
}

/* Archivos de taxonomia */

.dwlc-archive__intro {
	max-width: 65ch;
	line-height: 1.7;
}

.dwlc-archive__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 2.5rem;
	margin-top: 2.5rem;
}

.dwlc-card h2 {
	font-size: 1.15rem;
	line-height: 1.35;
	margin: .85rem 0 .3rem;
}

.dwlc-card a {
	text-decoration: none;
	color: inherit;
}

.dwlc-card__couple {
	font-family: var(--dwlc-font-ui);
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .7;
	margin: 0;
}