/*
 * Destino — country page (template-destino.php). Scoped under .dst, no global
 * reset. Home-aligned: cream, Playfair espresso headings, navy accents, S4 trip
 * cards (same as the catalog), full-bleed hero with the floating site header.
 */

/* Angelface (brand script) is declared globally in inprodi-hero-fonts.css. */

.dst, .dst *, .dst *::before, .dst *::after { box-sizing: border-box; }

.dst {
	--d-ink: #3e2618;
	--d-navy: #1c3f58;
	--d-badge: #204782;
	--d-terra: #cf8a44;
	--d-line: #e6ddcf;
	--d-body: #4b5563;
	--d-cream: #f8eee7;
	width: 100%;
	background: #f8eee7;
	font-family: var(--nk-font-sans);
	color: var(--d-body);
}

.dst-wrap { max-width: 80rem; margin: 0 auto; padding: 0 24px; }
.dst-eyebrow { font-family: 'Jost', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--d-terra); margin: 0 0 12px; }
.dst-stitle { font-family: 'Playfair Display', serif !important; font-weight: 500; text-transform: none; letter-spacing: normal; font-size: clamp(26px, 3.2vw, 38px); color: var(--d-ink); margin: 0; line-height: 1.2; }
.dst-prose { font-size: 16px; line-height: 1.7; color: var(--d-body); margin-top: 18px; }
.dst-prose p { margin: 0 0 1.1em; } .dst-prose p:last-child { margin-bottom: 0; }
.dst-btn { display: inline-flex; align-items: center; gap: 9px; padding: 15px 28px; border-radius: 12px; background: var(--nk-btn, #a16921); border: 1px solid var(--nk-btn, #a16921); color: var(--nk-btn-ink, #fff); font-family: 'Jost', sans-serif; font-size: 15px; letter-spacing: 0.06em; text-decoration: none; }
.dst-btn .cv { width: 15px; height: 15px; transition: transform 0.3s ease; }
.dst-btn:hover .cv { transform: translateX(3px); }
/* Variante blanca para fondos oscuros. Hoy no la usa nadie; el texto va en el
   color de botón (--nk-btn) y no en el azul de antes, para que si vuelve a
   hacer falta no reintroduzca un color que el sitio ya no usa en botones. */
.dst-btn--white { background: #fff; border-color: #fff; color: var(--nk-btn, #a16921); box-shadow: 0 8px 24px rgba(0,0,0,0.16); }
.dst-sec { padding: 76px 0; }

/* ── Hero ── */
.dst-hero { position: relative; min-height: 78vh; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; background: #111 center/cover no-repeat; }
.dst-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.34), rgba(0,0,0,0.5)); }
.dst-hero__inner { position: relative; z-index: 2; padding: 150px 24px 90px; color: #fff; max-width: 800px; }
.dst-hero .dst-eyebrow { font-family: 'Jost', sans-serif; font-size: 15px; color: rgba(255,255,255,0.85); margin-bottom: 10px; }
.dst-hero__title { font-family: 'Playfair Display', serif !important; font-weight: 500; text-transform: none; letter-spacing: normal; text-indent: 0; font-size: clamp(46px, 7.5vw, 80px); line-height: 1.05; margin: -0.16em 0 0; color: #fff; text-shadow: 0 2px 16px rgba(0,0,0,0.4); }
.dst-hero__sub { font-family: 'Playfair Display', serif; font-style: italic; color: rgba(255,255,255,0.95); font-size: clamp(28px, 3.6vw, 36px); line-height: 1.35; margin: -2px auto 0; max-width: 640px; text-shadow: 0 2px 12px rgba(0,0,0,0.4); }
/* Tiny screens: single-word country names (ARGENTINA, ANTÁRTIDA) can't wrap —
   ease size/tracking so they never clip against the hero edges. */
@media (max-width: 360px) {
	.dst-hero__title { font-size: 38px; letter-spacing: normal; text-indent: 0; }
}

/* White Nunatak stacked logo (LOGO_NUNATAK-32) below the description. */
.dst-hero__mark { display: block; max-height: 80px; width: auto; margin: 40px auto 0; opacity: 0.95; filter: brightness(0) invert(1); pointer-events: none; user-select: none; }

/* ── Trips (S4 cards, = catalog) ── */
.dst-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, 1fr); margin-top: 36px; }
@media (max-width: 900px) { .dst-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .dst-grid { grid-template-columns: 1fr; } }
.dst-card { display: flex; flex-direction: column; background: #fbf4ea; border: 1px solid var(--d-line); border-radius: 20px; overflow: hidden; text-decoration: none; color: inherit; transition: transform 0.4s ease, box-shadow 0.4s ease; }
.dst-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(62,38,24,0.12); }
.dst-card__media { position: relative; aspect-ratio: 4/3; background: #ece0d1 center/cover no-repeat; }
/* Badge con el código del país (ARG, CHL…), donde antes iba la bandera. Mismo
   tratamiento que .insp-cat__cbadge del catálogo: placa blanca sobre la foto con
   el texto en navy, y ancho según contenido. */
.dst-card__badge { position: absolute; z-index: 2; top: 14px; left: 14px; display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 26px; padding: 0 9px; background: rgba(255,255,255,0.94); border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.2); color: var(--d-navy); font-family: var(--nk-font-sans); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; line-height: 1; }
.dst-card__strip { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid #f0e9df; }
.dst-card__cell { padding: 12px 8px; text-align: center; }
.dst-card__cell + .dst-card__cell { border-left: 1px solid #f0e9df; }
.dst-card__lab { display: block; font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--d-body); opacity: 0.7; margin-bottom: 3px; }
.dst-card__val { font-size: 15px; font-weight: 600; color: var(--d-ink); display: inline-flex; align-items: center; gap: 5px; justify-content: center; line-height: 1.2; }
.dst-bed { width: 15px; height: 15px; flex-shrink: 0; color: var(--d-navy); }
.dst-card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 11px; flex: 1; }
.dst-card__title { margin: 0; font-family: 'Playfair Display', serif !important; font-weight: 500; font-size: 20px; line-height: 1.22; color: var(--d-ink); }
.dst-card__desc { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--d-body); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dst-card__btn { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 18px; border-radius: 12px; background: var(--nk-btn, #a16921); border: 1px solid var(--nk-btn, #a16921); color: var(--nk-btn-ink, #fff); font-size: 13.5px; }
.dst-card__btn .cv { width: 15px; height: 15px; transition: transform 0.3s ease; }
.dst-card:hover .dst-card__btn .cv { transform: translateX(3px); }

/* ── Intro ── */
.dst-intro__grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 56px; align-items: start; }
@media (max-width: 840px) { .dst-intro__grid { grid-template-columns: 1fr; gap: 32px; } }
.dst-hlist { background: #fbf4ea; border: 1px solid var(--d-line); border-radius: 18px; padding: 26px 28px; }
/* "Lo mejor de {país}". Iba en Angelface (la caligráfica del sistema viejo): se
   quedó fuera del rollback a Playfair y el cliente lo señaló en su revisión de
   copy ("cambiar cursiva a este tipo de texto y color"). Ahora usa la itálica de
   marca —Playfair Display— y el terracota de los subtítulos, igual que el resto
   de acentos del sitio. Se quita el -webkit-text-stroke: existía solo para
   engordar el trazo finísimo de Angelface. OJO: .dst-scard__name (los nombres de
   las estaciones, más abajo) sigue en Angelface — mismo resto del sistema viejo,
   en esta misma página. */
.dst-hlist h3 { font-family: 'Playfair Display', serif !important; font-style: italic; font-weight: 500; font-size: 28px; color: var(--d-terra); margin: 0 0 16px; }
.dst-hlist ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 13px; }
.dst-hlist li { display: flex; align-items: flex-start; gap: 11px; font-size: 15px; color: var(--d-ink); line-height: 1.4; }
.dst-hlist li svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px; color: var(--d-navy); }

/* ── Facts (sin Playfair) ── */
.dst-facts { background: #f4e8da; border-top: 1px solid var(--d-line); border-bottom: 1px solid var(--d-line); }
.dst-facts__grid { max-width: 80rem; margin: 0 auto; padding: 26px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
@media (max-width: 700px) { .dst-facts__grid { grid-template-columns: repeat(2, 1fr); } }
.dst-fact { display: flex; align-items: center; gap: 13px; }
.dst-fact__ic { flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px; background: rgba(207,138,68,0.14); color: var(--d-terra); display: flex; align-items: center; justify-content: center; }
.dst-fact__ic svg { width: 22px; height: 22px; }
.dst-fact__lab { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--d-body); opacity: 0.7; margin: 0 0 2px; }
.dst-fact__val { font-family: var(--nk-font-sans); font-weight: 600; font-size: 16px; color: var(--d-ink); margin: 0; }

/* ── Lugares imperdibles ── */
/* Se lee como galería, no como mosaico de postales: hueco estrecho, esquina
   apenas redondeada y sin tarjeta flotante (fuera sombra y hover que levanta).
   El nombre del lugar se queda siempre —es el contenido de la sección— y la
   descripción se revela al pasar el cursor, para que en reposo domine la foto. */
.dst-places__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 36px; }
@media (max-width: 900px) { .dst-places__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .dst-places__grid { grid-template-columns: 1fr; } }
.dst-place { position: relative; aspect-ratio: 3/2; border-radius: 6px; overflow: hidden; display: flex; align-items: flex-end; background: #ece0d1 center/cover no-repeat; }
.dst-place::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.62), rgba(0,0,0,0.08) 46%, transparent 70%); transition: background 0.35s ease; }
.dst-place:hover::after { background: linear-gradient(to top, rgba(0,0,0,0.76), rgba(0,0,0,0.24) 58%, rgba(0,0,0,0.05) 82%); }
.dst-place__t { position: relative; z-index: 2; width: 100%; padding: 18px 20px; color: #fff; }
.dst-place__name { font-family: 'Geist', sans-serif !important; font-weight: 400; text-transform: uppercase; letter-spacing: 0.07em; font-size: 17px; margin: 0; color: #fff; }
.dst-place__desc { font-size: 13.5px; color: rgba(255,255,255,0.88); margin: 6px 0 0; line-height: 1.4; }
/* Ocultamos con opacidad (no display:none) para que el lector de pantalla siga
   leyendo la descripción. Donde no hay cursor —táctil— se muestra siempre. */
@media (hover: hover) {
	.dst-place__desc { opacity: 0; transform: translateY(6px); transition: opacity 0.35s ease, transform 0.35s ease; }
	.dst-place:hover .dst-place__desc { opacity: 1; transform: none; }
}

/* Mosaico (solo escritorio): la primera foto manda a 2×2 y el resto la rodean.
   En mosaico la altura la da la fila, no la proporción, así que se anula el
   aspect-ratio —si no, pelea con el `grid-row: span 2`—.

   El número de lugares lo pone cada país (son términos hijos de la taxonomía),
   así que el total casi nunca cuadra con el patrón y la última fila quedaría
   coja. Las reglas de abajo estiran las fichas finales para cerrarla siempre:

     N=1  → la única ocupa las 3 columnas.
     N=2  → la segunda ocupa las dos filas de la columna libre.
     N≡1 (mod 3) → la última va sola en su fila: ocupa las 3 columnas.
     N≡2 (mod 3) → quedan dos: la penúltima ocupa dos columnas.
     N≡0 (mod 3) → la fila ya cierra sola, no hace falta regla. */
@media (min-width: 901px) {
	.dst-places__grid { grid-auto-rows: 190px; grid-auto-flow: dense; }
	.dst-place { aspect-ratio: auto; }
	.dst-place:first-child { grid-column: span 2; grid-row: span 2; }
	.dst-place:only-child { grid-column: span 3; grid-row: span 2; }
	.dst-place:last-child:nth-child(2) { grid-row: span 2; }
	.dst-place:last-child:nth-child(3n+1):not(:first-child) { grid-column: span 3; }
	.dst-place:nth-last-child(2):nth-child(3n+1):not(:first-child) { grid-column: span 2; }
	/* La ficha grande se merece un nombre más grande. */
	.dst-place:first-child .dst-place__name { font-size: 21px; }
}

/* ── Mejor época ── */
.dst-season { background: linear-gradient(180deg, #f8eee7 0%, #f2e4d4 100%); border-top: 1px solid var(--d-line); }
.dst-season__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 36px; }
@media (max-width: 820px) { .dst-season__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .dst-season__grid { grid-template-columns: 1fr; } }
.dst-scard { background: var(--d-cream); border: 1px solid var(--d-line); border-radius: 16px; padding: 24px; }
.dst-scard.is-best { border-color: var(--d-terra); box-shadow: 0 10px 30px rgba(207,138,68,0.14); }
.dst-scard__ic { color: var(--d-terra); } .dst-scard__ic svg { width: 26px; height: 26px; }
.dst-scard__name { font-family: 'Angelface', cursive !important; font-weight: 400; -webkit-text-stroke: 0.4px currentColor; font-size: 26px; color: var(--d-ink); margin: 12px 0 2px; }
.dst-scard__mo { font-size: 12.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--d-terra); margin: 0 0 10px; }
.dst-scard__d { font-size: 14px; line-height: 1.5; color: var(--d-body); margin: 0; }
.dst-scard__tag { display: inline-block; margin-top: 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #fff; background: var(--d-terra); padding: 3px 9px; border-radius: 999px; }

/* ── CTA ── */
/* ── Country cards (Destinos index, template-destinos.php) ── */
.dst-pgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 36px; }
@media (max-width: 760px) { .dst-pgrid { grid-template-columns: 1fr; } }
.dst-pcard { position: relative; aspect-ratio: 4/3; border-radius: 20px; overflow: hidden; display: flex; align-items: flex-end; background: #ece0d1 center/cover no-repeat; transition: transform 0.4s ease, box-shadow 0.4s ease; }
.dst-pcard:hover { transform: translateY(-5px); box-shadow: 0 20px 44px rgba(62,38,24,0.18); }
.dst-pcard::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.82), rgba(0,0,0,0.18) 55%, transparent 75%); }
.dst-pcard__t { position: relative; z-index: 2; width: 100%; padding: 26px 28px; color: #fff; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.dst-pcard__name { font-family: 'Geist', sans-serif !important; font-weight: 400; text-transform: uppercase; letter-spacing: 0.09em; font-size: clamp(22px, 2.6vw, 30px); margin: 0; line-height: 1.1; color: #fff; }
.dst-pcard__tag { font-family: 'Angelface', cursive; -webkit-text-stroke: 0.5px currentColor; font-size: clamp(22px, 2.5vw, 28px); color: #ffffff; margin: 5px 0 0; line-height: 1.2; text-shadow: 0 1px 12px rgba(0,0,0,0.4); }
.dst-pcard__meta { display: block; font-family: 'Jost', sans-serif; font-size: 11.5px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.75); margin-top: 10px; }
.dst-pcard__go { flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,0.94); color: var(--d-navy); display: flex; align-items: center; justify-content: center; transition: transform 0.3s ease; box-shadow: 0 4px 14px rgba(0,0,0,0.25); }
.dst-pcard:hover .dst-pcard__go { transform: translateX(4px); }
.dst-pcard__go svg { width: 18px; height: 18px; }

/* ── Galería del país ("<País> en imágenes") ──────────────────────────────
   Rejilla de 5 con la primera foto grande, que llena exactamente 4×2 celdas:
   la primera ocupa 2×2 y las otras cuatro una cada una, así que nunca quedan
   huecos. Las variantes --count-N cubren los países con menos fotos. */
.dst-gal { display: grid; gap: 10px; margin-top: 36px; grid-auto-flow: dense; }
.dst-gal__item { position: relative; margin: 0; overflow: hidden; border-radius: 6px; background: #ece0d1; }
.dst-gal__link { position: relative; display: block; width: 100%; height: 100%; }
.dst-gal__item .dst-gal__link img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.dst-gal__item:hover .dst-gal__link img { transform: scale(1.04); }
/* Los enlaces de las fotos que no se pintan sólo alimentan el visor. */
.dst-gal > .dst-gal__link[hidden] { display: none; }

.dst-gal--count-5 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 200px); }
.dst-gal--count-5 .dst-gal__item:first-child { grid-column: span 2; grid-row: span 2; }
.dst-gal--count-4 { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; }
.dst-gal--count-3 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 160px); }
.dst-gal--count-3 .dst-gal__item:first-child { grid-column: span 2; grid-row: span 2; }
.dst-gal--count-2 { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 300px; }

@media (max-width: 820px) {
	.dst-gal--count-5, .dst-gal--count-4, .dst-gal--count-3 { grid-template-columns: repeat(2, 1fr); grid-template-rows: none; grid-auto-rows: 160px; }
	.dst-gal--count-5 .dst-gal__item:first-child,
	.dst-gal--count-3 .dst-gal__item:first-child { grid-column: span 2; grid-row: span 2; }
	.dst-gal--count-2 { grid-auto-rows: 200px; }
}

/* "Ver más" compacto SOBRE la última foto. La foto se oscurece para que la
   píldora se lea encima; el velo no intercepta el clic, así que pinchar fuera
   del botón sigue abriendo el visor por esa foto. */
.dst-gal__item--more .dst-gal__link::after {
	content: ""; position: absolute; inset: 0;
	background: rgba(12, 10, 9, 0.46);
	pointer-events: none; transition: background 0.3s ease;
}
.dst-gal__item--more:hover .dst-gal__link::after { background: rgba(12, 10, 9, 0.58); }
.dst-gal__more {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	z-index: 2; display: inline-flex; align-items: baseline; gap: 7px;
	font-family: 'Jost', sans-serif; font-size: 12px; font-weight: 500;
	letter-spacing: 0.12em; text-transform: uppercase;
	color: #fff; background: rgba(255, 255, 255, 0.14);
	border: 1px solid rgba(255, 255, 255, 0.55); border-radius: 999px;
	padding: 9px 16px; cursor: pointer; white-space: nowrap;
	backdrop-filter: blur(3px);
	transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.dst-gal__more:hover { background: #fff; border-color: #fff; color: var(--d-ink); }
.dst-gal__more-t { font-size: 10.5px; letter-spacing: 0.14em; }
/* En las celdas pequeñas de móvil sólo cabe el "+N". */
@media (max-width: 520px) {
	.dst-gal__more { padding: 7px 12px; gap: 0; }
	.dst-gal__more-t { display: none; }
}

/* Visor a pantalla completa. */
.dst-noscroll { overflow: hidden; }
.dst-lightbox {
	position: fixed; inset: 0; z-index: 99999;
	background: rgba(12, 10, 9, 0.94);
	display: none; align-items: center; justify-content: center;
}
.dst-lightbox.is-open { display: flex; }
.dst-lightbox__stage { margin: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 64px 72px; }
.dst-lightbox__img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; }
.dst-lightbox__close, .dst-lightbox__nav {
	position: absolute; background: rgba(255, 255, 255, 0.1); color: #fff;
	border: 0; cursor: pointer; border-radius: 50%;
	width: 46px; height: 46px; font-size: 26px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
	transition: background 0.25s ease;
}
.dst-lightbox__close:hover, .dst-lightbox__nav:hover { background: rgba(255, 255, 255, 0.22); }
.dst-lightbox__close { top: 18px; right: 18px; }
.dst-lightbox__nav--prev { left: 14px; top: 50%; transform: translateY(-50%); }
.dst-lightbox__nav--next { right: 14px; top: 50%; transform: translateY(-50%); }
.dst-lightbox--solo .dst-lightbox__nav, .dst-lightbox--solo .dst-lightbox__counter { display: none; }
.dst-lightbox__counter {
	position: absolute; bottom: 20px; left: 0; right: 0; margin: 0; text-align: center;
	font-family: 'Jost', sans-serif; font-size: 12px; letter-spacing: 0.14em;
	color: rgba(255, 255, 255, 0.75);
}
@media (max-width: 640px) {
	.dst-lightbox__stage { padding: 56px 12px; }
	.dst-lightbox__nav { width: 40px; height: 40px; }
}

/* ── Postales (photo mosaic from the country's inspiraciones galleries) ── */
.dst-mosaic { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; gap: 14px; margin-top: 36px; }
.dst-mosaic__img { border-radius: 16px; background: #ece0d1 center/cover no-repeat; }
.dst-mosaic__img:first-child { grid-column: span 2; grid-row: span 2; }
@media (max-width: 820px) { .dst-mosaic { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 160px; } }

/* ── Nosotros (template-nosotros.php) — shares the dst hero/CTA, adds its own bands ── */
.dst-hero--nos .dst-hero__title { font-size: clamp(36px, 5.8vw, 60px); line-height: 1.08; }
.dst-hero--nos .dst-hero__sub { font-size: clamp(28px, 3.4vw, 34px); margin-top: -10px; }
.nos-lead { padding: 84px 24px; text-align: center; }
.nos-lead__script { font-family: 'Angelface', cursive; -webkit-text-stroke: 0.5px currentColor; color: var(--d-ink); font-size: clamp(38px, 5.2vw, 54px); line-height: 1.25; margin: 0 0 14px; }
.nos-lead__p { max-width: 44rem; margin: 0 auto; font-size: 18px; line-height: 1.7; color: var(--d-body); }
.nos-esencia { background: linear-gradient(180deg, #f4e7d8 0%, #f8eee7 100%); border-top: 1px solid var(--d-line); padding: 84px 0; }
.nos-esencia__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
@media (max-width: 840px) { .nos-esencia__grid { grid-template-columns: 1fr; gap: 32px; } }
.nos-esencia__img { aspect-ratio: 4/3; border-radius: 20px; background: #ece0d1 center/cover no-repeat; }
.nos-esencia__txt p { margin: 18px 0 0; font-size: 16px; line-height: 1.7; }
.nos-sc { display: block; font-family: 'Playfair Display', serif; font-style: italic; text-transform: none; letter-spacing: 0; text-indent: 0; font-size: 1em; line-height: 1.2; }
.nos-valores { padding: 84px 0; text-align: center; }
.nos-valores__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 40px; text-align: left; }
@media (max-width: 900px) { .nos-valores__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .nos-valores__grid { grid-template-columns: 1fr; } }
.nos-vcard { background: #f3e7d8; border: 1px solid #e6d5c1; border-radius: 18px; padding: 26px; }
.nos-vcard__ic { width: 44px; height: 44px; border-radius: 12px; background: rgba(207,138,68,0.14); color: var(--d-terra); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.nos-vcard__ic svg { width: 22px; height: 22px; }
.nos-vcard__t { font-family: 'Geist', sans-serif !important; font-weight: 500; text-transform: uppercase; letter-spacing: 0.07em; font-size: 15px; color: var(--d-ink); margin: 0 0 8px; }
.nos-vcard__d { font-size: 14.5px; line-height: 1.55; margin: 0; color: var(--d-body); }
.nos-band { position: relative; min-height: 52vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 90px 24px; overflow: hidden; background: #111 center/cover no-repeat; }
.nos-band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.38), rgba(0,0,0,0.46)); }
.nos-band__inner { position: relative; z-index: 2; color: #fff; max-width: 720px; }
.nos-band__title { font-family: 'Playfair Display', serif !important; font-weight: 500; text-transform: none; letter-spacing: normal; text-indent: 0; font-size: clamp(26px, 4vw, 42px); margin: 0; line-height: 1.15; color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,0.4); }
.nos-band__script { font-family: 'Playfair Display', serif; font-style: italic; font-size: clamp(32px, 4.4vw, 46px); color: rgba(255,255,255,0.95); margin: -2px 0 0; line-height: 1.3; text-shadow: 0 2px 12px rgba(0,0,0,0.4); }
.nos-band__sub { font-family: 'Jost', sans-serif; font-size: 16.5px; line-height: 1.6; color: rgba(255,255,255,0.9); margin: 14px auto 0; max-width: 46ch; }
.nos-equipo { background: linear-gradient(180deg, #f8eee7 0%, #f2e4d4 100%); border-top: 1px solid var(--d-line); padding: 84px 0; text-align: center; }
.nos-equipo__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 380px)); gap: 22px; justify-content: center; margin-top: 40px; }
@media (max-width: 700px) { .nos-equipo__grid { grid-template-columns: 1fr; } }
.nos-dcard { background: #fbf4ea; border: 1px solid #e8d9c8; border-radius: 20px; padding: 36px 30px; }
.nos-dcard__ava { width: 170px; height: 170px; border-radius: 50%; margin: 0 auto 22px; background: var(--d-navy) center/cover no-repeat; color: #fff; display: flex; align-items: center; justify-content: center; font-family: 'Geist', sans-serif; font-size: 48px; letter-spacing: 0.05em; border: 5px solid #fff; box-shadow: 0 10px 28px rgba(62,38,24,0.16); }
.nos-dcard__name { font-family: 'Geist', sans-serif !important; font-weight: 400; text-transform: uppercase; letter-spacing: 0.08em; font-size: 19px; color: var(--d-ink); margin: 0 0 4px; }
.nos-dcard__role { font-family: 'Jost', sans-serif; font-size: 12px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--d-terra); margin: 0 0 14px; }
.nos-dcard__bio { font-size: 14.5px; line-height: 1.6; margin: 0; color: var(--d-body); }

.dst-cta { position: relative; min-height: 56vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 80px 24px 100px; overflow: hidden; background: #f8eee7 center/cover no-repeat; }
/* Home-CTA base: dark scrim up top fading to the cream footer color. */
/* Fade lands on FLAT cream at 88% so the last ~12% already matches the footer — no visible seam. */
.dst-cta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.28) 0%, rgba(0,0,0,0.22) 34%, rgba(0,0,0,0.10) 50%, rgba(248,238,231,0.18) 60%, rgba(248,238,231,0.42) 68%, rgba(248,238,231,0.66) 75%, rgba(248,238,231,0.85) 81%, rgba(248,238,231,0.96) 85%, #f8eee7 88%, #f8eee7 100%); }
/* Flat cream strip meeting the footer — insurance against gradient banding.
   (::after is taken by the veil above, so the strip rides on ::before.) */
.dst-cta::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background-color: #f8eee7; z-index: 1; pointer-events: none; }
.dst-cta__inner { position: relative; z-index: 2; color: #fff; max-width: 620px; }
.dst-cta__eyebrow { font-family: 'Jost', sans-serif; font-size: 15px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(255,255,255,0.85); text-shadow: 0 2px 12px rgba(0,0,0,0.42); margin: 0 0 10px; }
.dst-cta__mark { display: block; max-height: 76px; width: auto; margin: 4px auto 30px; opacity: 0.95; filter: brightness(0) invert(1); pointer-events: none; user-select: none; }
.dst-cta__title { font-family: 'Geist', sans-serif !important; font-weight: 400; text-transform: uppercase; letter-spacing: 0.1em; text-indent: 0.1em; font-size: clamp(28px, 4vw, 44px); margin: 0 0 10px; color: #fff; text-shadow: 0 2px 16px rgba(0,0,0,0.42); }
.dst-cta__d { font-family: 'Angelface', cursive; color: rgba(255,255,255,0.95); -webkit-text-stroke: 0.6px currentColor; text-shadow: 0 2px 12px rgba(0,0,0,0.42); font-size: clamp(24px, 3vw, 30px); line-height: 1.35; margin: 0 0 26px; }

@media (min-width: 640px) { .dst-wrap, .dst-facts__grid { padding-left: 24px; padding-right: 24px; } }

@media (prefers-reduced-motion: reduce) {
	.dst-card, .dst-place, .dst-place::after, .dst-place__desc, .dst-btn .cv, .dst-card__btn .cv { transition: none; }
	.dst-place__desc { opacity: 1; transform: none; }
}
