/*
 * Tasman Landing — estilos principales.
 * Diseño 2a "Editorial redondeado" del handoff bundle + requisitos 2026-07-06:
 * sticky nav, hero video full, smooth scroll, cards → subpáginas.
 */

:root {
	/* Paleta oficial Tasman — reemplaza los placeholders del handoff bundle. */
	--tsm-ivory:      #F2F3EE;  /* canvas principal (marfil casi blanco) */
	--tsm-ivory-2:    #E4E2D4;  /* superficies sand secundarias */
	--tsm-ivory-3:    #E3D8C3;  /* marfil cálido (arrows, chips bg) */
	--tsm-ink:        #291A14;  /* marrón oscuro (tinta principal) */
	--tsm-ink-2:      #4D3B2D;  /* marrón medio (texto secundario) */
	--tsm-ink-3:      #2E2E2E;  /* gris carbón (texto neutro) */
	--tsm-border:     #E1DBCF;  /* borde suave */
	--tsm-border-2:   #E3D8C3;  /* borde alt */
	--tsm-accent:     #99553E;  /* terracota oficial (CTAs, kickers) */
	--tsm-accent-hi:  #7D4530;  /* terracota más oscuro para hover */
	--tsm-accent-lt:  #D9B5A1;  /* terracota clara para kicker sobre foto */
	--tsm-olive:      #2C4122;  /* verde profundo (badge "Abierto a inversión") */
	--tsm-navy:       #291A14;  /* footer marrón oscuro (mismo que ink) */
	--tsm-wa:         #25D366;
	--tsm-white:      #ffffff;

	/* Sombras y rgba derivadas del accent oficial (153, 85, 62) */
	--tsm-accent-rgb: 153, 85, 62;
	--tsm-ink-rgb:    41, 26, 20;

	/* Tipografía oficial Tasman: Federo (display serif) + Jost (geometric sans). */
	--tsm-sans:       'Jost', system-ui, -apple-system, Segoe UI, sans-serif;
	--tsm-serif:      'Federo', Georgia, 'Times New Roman', serif;

	--tsm-r-lg:       28px;
	--tsm-r-md:       24px;
	--tsm-r-sm:       16px;
	--tsm-r-pill:     999px;

	--tsm-shadow-card:    0 8px 28px rgba(33,29,24,.08);
	--tsm-shadow-process: 0 6px 20px rgba(33,29,24,.05);
	--tsm-shadow-icon:    0 4px 14px rgba(33,29,24,.06);
	--tsm-shadow-nav:     0 6px 24px rgba(33,29,24,.10);
	--tsm-shadow-wa:      0 10px 28px rgba(20,16,10,.3);

	--tsm-nav-h:      68px;

	/* Anchos de contención (best practice: contenido acotado, backgrounds full-width) */
	--tsm-content-max: 1200px; /* ancho seguro para texto/grids editoriales */
	--tsm-island-max:  1560px; /* cap para nav/hero/footer en pantallas 4K/ultrawide */
	--tsm-gutter:      24px;   /* inset lateral mínimo */
	--tsm-gutter-sm:   16px;   /* inset lateral mínimo en mobile */

	--tsm-ease:          cubic-bezier(.16, 1, .3, 1);         /* soft — legacy alias */
	--ease-out-strong:   cubic-bezier(.23, 1, .32, 1);        /* dropdowns, popovers, reveal, links */
	--ease-drawer:       cubic-bezier(.32, .72, 0, 1);        /* iOS-style, cards con lift */
}

/* ---------- reset & body ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body.tsm-page {
	background: var(--tsm-ivory);
	color: var(--tsm-ink);
	font-family: var(--tsm-sans);
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
	overflow-x: hidden;
}
body.tsm-page * { box-sizing: border-box; }
body.tsm-page h1, body.tsm-page h2, body.tsm-page h3, body.tsm-page h4 {
	font-family: var(--tsm-serif);
	font-weight: 500;
	margin: 0;
	color: var(--tsm-ink);
}
body.tsm-page img { display: block; max-width: 100%; }
body.tsm-page button { font-family: inherit; }
.tsm-kicker {
	font: 700 12px/1 var(--tsm-sans);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tsm-accent);
	margin: 0 0 16px;
	display: block;
}

/* Twenty Twenty-Five: ocultar header/footer/title estándar cuando la landing está montada.
   Selectores duplicados con .tsm-page (body_class de PHP) y :has() (fallback moderno). */
.tsm-page > header.wp-block-template-part,
.tsm-page > footer.wp-block-template-part,
.tsm-page .wp-site-blocks > header,
.tsm-page .wp-site-blocks > footer,
.tsm-page .wp-block-post-title,
.tsm-page .wp-block-template-part[data-type="header"],
.tsm-page .wp-block-template-part[data-type="footer"],
body:has(.tsm-page-root) > .wp-site-blocks > header,
body:has(.tsm-page-root) > .wp-site-blocks > footer,
body:has(.tsm-page-root) .wp-block-post-title,
body:has(.tsm-page-root) .wp-block-template-part[data-type="header"],
body:has(.tsm-page-root) .wp-block-template-part[data-type="footer"] { display: none !important; }

/* Break out del contentSize (1100px) — WP core aplica !important en .is-layout-constrained > *, hay que ganar en specificity + !important */
.tsm-page-root,
.is-layout-constrained > .tsm-page-root,
.wp-block-post-content > .tsm-page-root,
main > .tsm-page-root,
.wp-site-blocks .tsm-page-root {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	position: relative;
}
.tsm-page .wp-block-post-content,
.tsm-page .entry-content,
.tsm-page main.wp-block-group,
.tsm-page .is-layout-constrained,
body:has(.tsm-page-root) .wp-block-post-content,
body:has(.tsm-page-root) .entry-content,
body:has(.tsm-page-root) main.wp-block-group,
body:has(.tsm-page-root) .is-layout-constrained {
	max-width: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Nuclear hide del WP post title en la landing (por si WP inyecta inline !important) */
body.tsm-page .wp-block-post-title,
body.tsm-page h1.wp-block-post-title,
body:has(.tsm-page-root) .wp-block-post-title,
body:has(.tsm-page-root) h1.wp-block-post-title {
	display: none !important;
	visibility: hidden !important;
	position: absolute !important;
	left: -99999px !important;
	height: 0 !important;
	width: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Cerrar huecos superiores/inferiores que deja TT5 en los wrappers.
   La global padding de TT5 aplica padding-block a .wp-block-group.has-global-padding —
   hay que anularlo en TODOS los wrappers dentro de la landing, no solo main. */
body.tsm-page,
body:has(.tsm-page-root) {
	margin: 0 !important;
	padding: 0 !important;
}
body.tsm-page .wp-site-blocks,
body:has(.tsm-page-root) .wp-site-blocks,
body.tsm-page .wp-block-group,
body:has(.tsm-page-root) .wp-block-group,
body.tsm-page .wp-block-post-content,
body:has(.tsm-page-root) .wp-block-post-content,
body.tsm-page .entry-content,
body:has(.tsm-page-root) .entry-content,
body.tsm-page .has-global-padding,
body:has(.tsm-page-root) .has-global-padding {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	gap: 0 !important;
	row-gap: 0 !important;
}

/* Scroll-margin para que los anclas no queden tapados por el sticky nav */
body.tsm-page section[id] { scroll-margin-top: calc(var(--tsm-nav-h) + 24px); }

/* ---------- NAV ----------
 * Safe zones: env(safe-area-inset-*) para notch, dynamic island y bordes redondeados.
 * Fallback a los mismos márgenes cuando el navegador no las soporta.
 */
.tsm-nav {
	position: fixed;
	top: max(24px, env(safe-area-inset-top, 0px) + 12px);
	left: max(var(--tsm-gutter), env(safe-area-inset-left, 0px), calc(50vw - var(--tsm-island-max) / 2));
	right: max(var(--tsm-gutter), env(safe-area-inset-right, 0px), calc(50vw - var(--tsm-island-max) / 2));
	z-index: 40;
	display: flex; align-items: center; justify-content: space-between;
	background: rgba(255,255,255,.12);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border-radius: var(--tsm-r-pill);
	padding: 14px 22px;
	transition: background .3s var(--tsm-ease), box-shadow .3s var(--tsm-ease), padding .3s var(--tsm-ease), top .3s var(--tsm-ease), left .3s var(--tsm-ease), right .3s var(--tsm-ease), border-radius .3s var(--tsm-ease);
}
.tsm-nav__brand {
	color: #fff;
	text-decoration: none;
	display: inline-flex; align-items: center;
	transition: color .3s var(--tsm-ease), transform .3s var(--tsm-ease);
	line-height: 0; /* elimina baseline whitespace del SVG inline */
}
.tsm-nav__brand svg {
	display: block;
	width: 130px;
	height: auto;
	color: inherit;
}
.tsm-nav__brand:hover { transform: translateY(-1px); }
.tsm-nav__right { display: flex; align-items: center; gap: 32px; }
.tsm-nav__links { display: flex; gap: 32px; list-style: none; margin: 0; padding: 0; }
.tsm-nav__links a {
	font: 500 14px/1 var(--tsm-sans);
	color: #fff;
	opacity: .9;
	text-decoration: none;
	position: relative;
	padding-block: 4px;
	transition: color 200ms var(--ease-out-strong), opacity 200ms var(--ease-out-strong);
}
.tsm-nav__links a::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -2px;
	height: 1px;
	background: currentColor;
	clip-path: inset(0 100% 0 0);
	transition: clip-path 260ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-nav__links a:hover { opacity: 1; }
	.tsm-nav__links a:hover::after { clip-path: inset(0 0 0 0); }
}
.tsm-nav__links a:focus-visible { opacity: 1; outline: none; }
.tsm-nav__links a:focus-visible::after { clip-path: inset(0 0 0 0); }
.tsm-lang {
	display: flex; gap: 2px;
	background: rgba(255,255,255,.18);
	border-radius: var(--tsm-r-pill);
	padding: 3px;
	transition: background .3s var(--tsm-ease);
}
.tsm-lang__btn {
	border: none;
	border-radius: var(--tsm-r-pill);
	padding: 6px 12px;
	font: 600 12px/1 var(--tsm-sans);
	cursor: pointer;
	min-height: 28px;
	background: transparent;
	color: #fff;
	transition: background .2s var(--tsm-ease), color .2s var(--tsm-ease);
	text-decoration: none;
	display: inline-flex; align-items: center;
}
.tsm-lang__btn[aria-current="true"],
.tsm-lang__btn.is-active { background: #fff; color: var(--tsm-ink); }

/* Estado sticky del nav: fondo sólido, sombra, contenido más compacto. Nav ya es fixed. */
.tsm-nav--sticky {
	top: max(12px, env(safe-area-inset-top, 0px) + 8px);
	left: max(12px, env(safe-area-inset-left, 0px), calc(50vw - var(--tsm-island-max) / 2));
	right: max(12px, env(safe-area-inset-right, 0px), calc(50vw - var(--tsm-island-max) / 2));
	background: rgba(242, 243, 238, .96);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	box-shadow: var(--tsm-shadow-nav);
	padding: 10px 20px;
}

/* Tablet intermedio (901–1100px): apretar el nav para que quepan todos los items. */
@media (min-width: 901px) and (max-width: 1100px) {
	.tsm-nav__links { gap: 24px; }
	.tsm-nav__right { gap: 20px; }
	.tsm-nav__right .tsm-btn { display: none; }
}
.tsm-nav--sticky .tsm-nav__brand { color: var(--tsm-ink); }
.tsm-nav--sticky .tsm-nav__brand svg { width: 118px; }
.tsm-nav--sticky .tsm-nav__links a { color: var(--tsm-ink); opacity: .85; }
.tsm-nav--sticky .tsm-nav__links a:hover { opacity: 1; color: var(--tsm-accent); }
.tsm-nav--sticky .tsm-lang { background: rgba(33,29,24,.06); }
.tsm-nav--sticky .tsm-lang__btn { color: var(--tsm-ink); }
.tsm-nav--sticky .tsm-lang__btn[aria-current="true"],
.tsm-nav--sticky .tsm-lang__btn.is-active { background: var(--tsm-ink); color: #fff; }
.tsm-nav--sticky .tsm-nav__toggle { color: var(--tsm-ink); }

.tsm-btn {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--tsm-accent);
	color: #fff;
	border: none;
	border-radius: var(--tsm-r-pill);
	padding: 17px 32px;
	font: 600 15px/1 var(--tsm-sans);
	cursor: pointer;
	min-height: 44px;
	text-decoration: none;
	transition: background 180ms var(--ease-out-strong), box-shadow 200ms var(--ease-out-strong), transform 120ms var(--ease-out-strong);
	box-shadow: 0 0 0 rgba(193,98,45,0);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-btn:hover { background: var(--tsm-accent-hi); box-shadow: 0 8px 20px rgba(var(--tsm-accent-rgb),.28); }
}
.tsm-btn:active { transform: scale(.97); transition-duration: 100ms; }
.tsm-btn:focus-visible { outline: 2px solid var(--tsm-accent); outline-offset: 3px; }
.tsm-btn--sm { padding: 12px 22px; font-size: 13px; }
.tsm-btn--block { display: flex; width: 100%; }
.tsm-btn--outline {
	background: transparent;
	color: var(--tsm-accent);
	box-shadow: inset 0 0 0 1.5px var(--tsm-accent);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-btn--outline:hover { background: var(--tsm-accent); color: #fff; box-shadow: inset 0 0 0 1.5px var(--tsm-accent), 0 8px 20px rgba(var(--tsm-accent-rgb),.24); }
}
.tsm-btn__icon { display: inline-flex; margin-inline-start: 8px; }
.tsm-btn__icon svg { width: 16px; height: 16px; }

/* ---------- HERO VIDEO (full viewport, con fallback Ken Burns) ---------- */
.tsm-hero-video {
	position: relative;
	width: 100vw;
	margin-inline: calc(50% - 50vw);
	height: 100svh;
	min-height: 640px;
	max-height: 1000px;
	overflow: hidden;
	background: #14100A;
}
.tsm-hero-video__media {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover; object-position: center;
	display: block;
}
.tsm-hero-video__kenburns { animation: tsm-hero-kenburns 26s ease-in-out infinite alternate; will-change: transform; }
@keyframes tsm-hero-kenburns {
	0%   { transform: scale(1.02) translate(0, 0); }
	50%  { transform: scale(1.10) translate(-1%, -1%); }
	100% { transform: scale(1.06) translate(1%, 0); }
}
.tsm-hero-video__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(20,16,10,.25) 0%, rgba(20,16,10,0) 30%, rgba(20,16,10,0) 70%, rgba(20,16,10,.55) 100%);
	pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
	.tsm-hero-video__kenburns { animation: none; }
}
@media (max-width: 900px) {
	.tsm-hero-video { min-height: 520px; }
}

/* ---------- NAV property (Federo typographic logo + custom items) ---------- */
.tsm-nav__brand--type {
	font: 500 22px/1 var(--tsm-serif);
	letter-spacing: .28em;
	color: #fff;
	text-decoration: none;
	display: inline-flex; align-items: center;
}
.tsm-nav--sticky .tsm-nav__brand--type { color: var(--tsm-ink); font-size: 20px; }
.tsm-nav__brand-word { display: inline-block; }
@media (max-width: 900px) {
	.tsm-nav__brand--type { font-size: 18px; letter-spacing: .22em; }
}

/* ---------- INTRO SECTION ---------- */
.tsm-intro {
	padding-block: 96px 72px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	background: var(--tsm-ivory-2);
	text-align: center;
}
.tsm-intro__head { display: flex; flex-direction: column; align-items: center; margin-bottom: 64px; }
.tsm-intro__emblem { color: var(--tsm-accent); margin-bottom: 24px; opacity: .8; }
.tsm-intro__emblem svg { width: 60px; height: 60px; }
.tsm-intro__title {
	font: 500 clamp(48px, 8vw, 88px)/1.02 var(--tsm-serif);
	color: var(--tsm-ink);
	letter-spacing: -0.02em;
	margin: 0 0 24px;
	text-wrap: balance;
}
.tsm-intro__divider {
	position: relative;
	width: 120px;
	height: 1px;
	background: var(--tsm-border);
	margin: 0 0 32px;
}
.tsm-intro__divider span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--tsm-accent);
}
.tsm-intro__ctas { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.tsm-intro__grid {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 64px;
	align-items: center;
	max-width: var(--tsm-content-max);
	margin: 0 auto 80px;
	text-align: left;
}
.tsm-intro__copy p {
	font: 400 17px/1.7 var(--tsm-sans);
	color: var(--tsm-ink-2);
	max-width: 65ch;
	margin: 0;
	text-wrap: pretty;
}
.tsm-intro__slider {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: var(--tsm-r-md);
	overflow: hidden;
	background: var(--tsm-ivory-3);
	box-shadow: 0 12px 40px rgba(33,29,24,.10);
}
.tsm-intro__slider-track { position: absolute; inset: 0; }
.tsm-intro__slide {
	position: absolute; inset: 0;
	opacity: 0;
	transition: opacity 800ms var(--ease-out-strong);
	will-change: opacity;
}
.tsm-intro__slide.is-active { opacity: 1; }
.tsm-intro__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tsm-intro__dots {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 8px;
	padding: 6px 10px;
	background: rgba(20,16,10,.35);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border-radius: var(--tsm-r-pill);
}
.tsm-intro__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	border: none;
	background: rgba(255,255,255,.5);
	cursor: pointer;
	padding: 0;
	transition: width 260ms var(--ease-out-strong), background 260ms var(--ease-out-strong);
}
.tsm-intro__dot.is-active { width: 24px; border-radius: var(--tsm-r-pill); background: #fff; }
.tsm-intro__dot:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.tsm-intro__valueprop {
	max-width: 780px;
	margin: 0 auto;
	text-align: center;
	position: relative;
	padding-inline: 60px;
}
.tsm-intro__valueprop p {
	font: 500 clamp(20px, 2.4vw, 26px)/1.5 var(--tsm-serif);
	color: var(--tsm-ink);
	margin: 0;
	text-wrap: balance;
}
.tsm-intro__valueprop em {
	font-style: normal;
	color: var(--tsm-accent);
}
.tsm-intro__valueprop-emblem {
	position: absolute;
	top: 50%;
	right: -20px;
	transform: translateY(-50%);
	color: var(--tsm-accent);
	opacity: .35;
}
.tsm-intro__valueprop-emblem svg { width: 80px; height: 80px; }
@media (max-width: 900px) {
	.tsm-intro { padding-block: 64px 48px; }
	.tsm-intro__head { margin-bottom: 40px; }
	.tsm-intro__grid { grid-template-columns: 1fr; gap: 40px; margin-bottom: 56px; }
	.tsm-intro__valueprop { padding-inline: 0; }
	.tsm-intro__valueprop-emblem { position: static; transform: none; display: block; margin: 20px auto 0; opacity: .3; }
	.tsm-intro__ctas .tsm-btn { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
	.tsm-intro__slide { transition: none; }
}

.tsm-nav__toggle {
	display: none;
	width: 40px; height: 40px;
	border: none; background: transparent;
	border-radius: var(--tsm-r-pill);
	cursor: pointer;
	color: #fff;
	align-items: center; justify-content: center;
	transition: color .3s var(--tsm-ease);
}
.tsm-nav__toggle span,
.tsm-nav__toggle span::before,
.tsm-nav__toggle span::after {
	content: "";
	display: block; width: 20px; height: 2px; background: currentColor;
	transition: transform .2s var(--tsm-ease);
}
.tsm-nav__toggle span { position: relative; }
.tsm-nav__toggle span::before { position: absolute; top: -6px; left: 0; }
.tsm-nav__toggle span::after  { position: absolute; top:  6px; left: 0; }

/* ---------- HERO (full-bleed edge-to-edge con video) ---------- */
.tsm-hero-wrap { position: relative; padding-top: 0; }
.tsm-hero {
	position: relative;
	height: 100svh;
	min-height: 640px;
	max-height: 900px;
	overflow: hidden;
	width: 100%;
	margin: 0;
	border-radius: 0;
	background: #14100A;
}
.tsm-hero__media {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
}
.tsm-hero__media video,
.tsm-hero__media img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover; object-position: center 60%;
}
@media (prefers-reduced-motion: reduce) {
	.tsm-hero__media video { display: none; }
}
.tsm-hero__overlay {
	position: absolute; inset: 0;
	background:
		radial-gradient(ellipse 90% 55% at 22% 88%, rgba(20,16,10,.70), transparent 65%),
		linear-gradient(180deg, rgba(20,16,10,0) 0%, rgba(20,16,10,.15) 40%, rgba(20,16,10,.55) 75%, rgba(20,16,10,.88) 100%);
}
body.tsm-page .tsm-hero__title { color: #fff; }
body.tsm-page .tsm-hero__sub  { color: rgba(255,255,255,.88); }
.tsm-hero__kicker,
.tsm-hero__title,
.tsm-hero__sub {
	text-shadow: 0 2px 24px rgba(0,0,0,.35);
}
.tsm-hero__inner {
	position: absolute;
	/* Contenido dentro del área segura (misma regla que .tsm-section) */
	left: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	right: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	bottom: 72px;
	max-width: 760px;
}
.tsm-hero__kicker {
	font: 700 13px/1 var(--tsm-sans);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tsm-accent-lt);
	margin: 0 0 20px;
}
.tsm-hero__title {
	font: 500 62px/1.08 var(--tsm-serif);
	color: #fff;
	max-width: 680px;
	margin: 0 0 24px;
}
.tsm-hero__sub {
	font: 400 19px/1.6 var(--tsm-sans);
	color: rgba(255,255,255,.88);
	max-width: 520px;
	margin: 0 0 36px;
}

/* ---------- SECTION shell ----------
 * Background full-width, contenido acotado a --tsm-content-max con auto-center.
 * padding-inline usa max() para garantizar min gutter + centering en widescreens.
 */
.tsm-section {
	padding-block: 100px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	background: var(--tsm-ivory);
}
.tsm-section--sand { background: var(--tsm-ivory-2); }
.tsm-section--cream { background: var(--tsm-ivory-3); }
/* Diferencia entre "Qué hacemos" y "Cómo trabajamos": el segundo va en tono cálido. */
#proceso.tsm-section { background: var(--tsm-ivory-3); }
.tsm-section-head {
	text-align: center;
	max-width: 640px;
	margin: 0 auto 48px;
}
.tsm-section-head--left {
	text-align: left;
	margin: 0 0 48px;
	max-width: 640px;
}
.tsm-section-head h2 {
	font-size: 42px;
	line-height: 1.15;
	margin: 0 0 14px;
}
.tsm-section-head p {
	font: 400 15px/1.6 var(--tsm-sans);
	color: var(--tsm-ink-2);
	margin: 0;
}

/* ---------- PORTFOLIO CARRUSEL ----------
 * Desktop: marquee auto-motion con cards duplicadas (translate infinito, pausa on hover).
 * Mobile: scroll+snap nativo con peek visible.
 * El viewport rompe el padding-inline del section para edge-to-edge.
 */
.tsm-portfolio__viewport {
	position: relative;
	margin-inline: calc(-1 * max(var(--tsm-gutter), 50vw - var(--tsm-content-max) / 2));
	padding-block: 4px;
	overflow: hidden;
	/* Máscara sutil en los edges para dar sensación de "continúa" */
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
	        mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
}
.tsm-portfolio__row {
	display: flex;
	gap: 28px;
	padding-block: 12px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	scrollbar-width: none;
	-ms-overflow-style: none;
	will-change: transform;
	touch-action: pan-y;
	cursor: grab;
	user-select: none;
	-webkit-user-select: none;
}
.tsm-portfolio__row.is-dragging { cursor: grabbing; transition: none !important; }
.tsm-portfolio__row.is-dragging .tsm-card { pointer-events: none; }
.tsm-portfolio__row::-webkit-scrollbar { display: none; }

.tsm-portfolio__arrows {
	display: flex; gap: 8px;
	justify-content: center;
	margin-top: 32px;
}
.tsm-portfolio__arrow {
	width: 44px; height: 44px;
	border-radius: var(--tsm-r-pill);
	border: 1.5px solid var(--tsm-border);
	background: #fff;
	color: var(--tsm-ink);
	cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
	font: 500 18px/1 var(--tsm-sans);
	transition: background .2s var(--tsm-ease), color .2s var(--tsm-ease), border-color .2s var(--tsm-ease);
}
.tsm-portfolio__arrow:hover { background: var(--tsm-accent); color: #fff; border-color: var(--tsm-accent); }
.tsm-portfolio__arrow:disabled { opacity: .35; cursor: default; background: #fff; color: var(--tsm-ink); border-color: var(--tsm-border); }

.tsm-card {
	flex: 0 0 380px;
	background: #fff;
	border-radius: var(--tsm-r-md);
	overflow: hidden;
	box-shadow: var(--tsm-shadow-card);
	text-decoration: none;
	color: inherit;
	transition: transform 260ms var(--ease-drawer), box-shadow 320ms var(--ease-out-strong);
	display: block;
	max-width: 380px;
	scroll-snap-align: start;
}
@media (hover: hover) and (pointer: fine) {
	.tsm-card:hover { transform: translateY(-4px); box-shadow: 0 14px 36px rgba(33,29,24,.12); }
	.tsm-card:hover .tsm-card__media img { transform: scale(1.03); }
}
.tsm-card:active { transform: translateY(-2px) scale(.995); transition-duration: 120ms; }
.tsm-card:focus-visible { outline: 2px solid var(--tsm-accent); outline-offset: 4px; }
.tsm-card__media {
	position: relative;
	height: 260px;
	overflow: hidden;
}
.tsm-card__media img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 500ms var(--ease-drawer);
}
.tsm-card__badge {
	position: absolute; top: 18px; left: 18px;
	background: var(--tsm-accent);
	color: #fff;
	font: 600 12px/1 var(--tsm-sans);
	padding: 9px 14px;
	border-radius: var(--tsm-r-pill);
	overflow: hidden;
	isolation: isolate;
}
.tsm-card__badge--open { background: var(--tsm-olive); }
.tsm-card__badge--soon {
	background: rgba(var(--tsm-ink-rgb), .55);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.tsm-card__badge--done { background: var(--tsm-accent); }
/* Shine sweep sutil solo para badges "Abierto a inversión" (estado activo).
   Un pase cada 6s. Reduced-motion desactiva la animación pero mantiene visible el badge. */
.tsm-card__badge--open::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(100deg, transparent 40%, rgba(255,255,255,.32) 50%, transparent 60%);
	clip-path: inset(0 100% 0 0);
	animation: tsm-shine 6s var(--ease-out-strong) infinite;
	pointer-events: none;
}
@keyframes tsm-shine {
	0%, 15%   { clip-path: inset(0 100% 0 0); }
	40%       { clip-path: inset(0 -30% 0 130%); }
	40.01%, 100% { clip-path: inset(0 100% 0 0); }
}
@media (prefers-reduced-motion: reduce) {
	.tsm-card__badge--open::after { animation: none; }
}
.tsm-card__body { padding: 26px 28px; }
.tsm-card__meta {
	font: 400 12.5px/1.4 var(--tsm-sans);
	color: var(--tsm-ink-2);
	margin: 0 0 8px;
}
.tsm-card__name {
	font: 500 24px/1.2 var(--tsm-serif);
	margin: 0 0 14px;
}
.tsm-card__row {
	display: flex; align-items: center; justify-content: space-between;
}
.tsm-card__detail {
	font: 600 16px/1 var(--tsm-sans);
	color: var(--tsm-ink);
}
.tsm-card__arrow {
	width: 40px; height: 40px;
	border-radius: var(--tsm-r-pill);
	background: var(--tsm-ivory-3);
	display: flex; align-items: center; justify-content: center;
	font: 600 16px/1 var(--tsm-sans);
	color: var(--tsm-ink);
	transition: background 200ms var(--ease-out-strong), color 200ms var(--ease-out-strong), transform 220ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-card:hover .tsm-card__arrow { background: var(--tsm-accent); color: #fff; transform: translateX(3px) scale(1.05); }
}

/* ---------- SERVICES ---------- */
.tsm-section--services { padding-block: 132px; }
.tsm-section--services .tsm-section-head { margin-bottom: 72px; }
.tsm-services__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 56px 40px;
	max-width: 1180px;
	margin: 0 auto;
}
.tsm-svc {
	display: flex; flex-direction: column; align-items: center;
	text-align: center; gap: 20px;
}
.tsm-svc__icon {
	width: 88px; height: 88px;
	border-radius: var(--tsm-r-pill);
	background: #fff;
	box-shadow: var(--tsm-shadow-icon);
	display: flex; align-items: center; justify-content: center;
	color: var(--tsm-accent);
	position: relative;
	transition: background 200ms var(--ease-out-strong), color 200ms var(--ease-out-strong), box-shadow 220ms var(--ease-out-strong), transform 260ms var(--ease-out-strong);
}
.tsm-svc__icon::after {
	content: "";
	position: absolute; inset: -6px;
	border-radius: var(--tsm-r-pill);
	border: 1px solid rgba(var(--tsm-accent-rgb), .18);
	opacity: 0;
	transition: opacity 260ms var(--ease-out-strong), transform 260ms var(--ease-out-strong);
	transform: scale(.94);
	pointer-events: none;
}
.tsm-svc__icon svg { width: 34px; height: 34px; transition: transform 240ms var(--ease-out-strong); }
@media (hover: hover) and (pointer: fine) {
	.tsm-svc:hover .tsm-svc__icon {
		background: var(--tsm-accent);
		color: #fff;
		box-shadow: 0 14px 30px rgba(var(--tsm-accent-rgb),.28);
		transform: translateY(-4px);
	}
	.tsm-svc:hover .tsm-svc__icon::after { opacity: 1; transform: scale(1); }
	.tsm-svc:hover .tsm-svc__icon svg { transform: rotate(-4deg) scale(1.06); }
	.tsm-svc:hover .tsm-svc__label { color: var(--tsm-ink); }
}
.tsm-svc__label {
	font: 500 16px/1.5 var(--tsm-sans);
	max-width: 220px;
	color: var(--tsm-ink);
	letter-spacing: -0.005em;
	transition: color 200ms var(--ease-out-strong);
}
@media (max-width: 900px) {
	.tsm-section--services { padding-block: 84px; }
	.tsm-section--services .tsm-section-head { margin-bottom: 48px; }
	.tsm-services__grid { gap: 44px 24px; }
	.tsm-svc__icon { width: 76px; height: 76px; }
	.tsm-svc__icon svg { width: 30px; height: 30px; }
	.tsm-svc__label { font-size: 15px; max-width: 200px; }
}

/* ---------- PROCESS ---------- */
.tsm-process__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 24px;
}
.tsm-process__card {
	padding: 32px 28px;
	background: #fff;
	border-radius: var(--tsm-r-md);
	box-shadow: var(--tsm-shadow-process);
	transition: transform 260ms var(--ease-drawer), box-shadow 320ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-process__card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(33,29,24,.08); }
	.tsm-process__card:hover .tsm-process__num { background: var(--tsm-accent); color: #fff; }
}
.tsm-process__num {
	width: 56px; height: 56px;
	border-radius: var(--tsm-r-pill);
	background: var(--tsm-ivory-2);
	display: flex; align-items: center; justify-content: center;
	font: 500 20px/1 var(--tsm-serif);
	color: var(--tsm-accent);
	margin: 0 0 20px;
	transition: background 200ms var(--ease-out-strong), color 200ms var(--ease-out-strong);
}
.tsm-process__title {
	font: 600 18px/1.3 var(--tsm-sans);
	margin: 0 0 10px;
	font-family: var(--tsm-sans);
}
.tsm-process__desc {
	font: 400 14.5px/1.6 var(--tsm-sans);
	color: var(--tsm-ink-2);
	margin: 0;
}

/* ---------- WHY INVEST ---------- */
.tsm-why {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}
.tsm-why__quote {
	background: var(--tsm-ivory-2);
	padding: 48px;
	border-radius: var(--tsm-r-lg);
}
.tsm-why__quote-text {
	font: 500 26px/1.5 var(--tsm-serif);
	font-style: italic;
	color: var(--tsm-ink);
	margin: 0 0 24px;
}
.tsm-why__quote-author {
	font: 600 13px/1.4 var(--tsm-sans);
	color: var(--tsm-ink-2);
}
.tsm-why__body h2 { font-size: 38px; margin: 0 0 24px; }
.tsm-why__body p {
	font: 400 16px/1.7 var(--tsm-sans);
	color: var(--tsm-ink-2);
	margin: 0;
}

/* ---------- CONTACT ---------- */
.tsm-contact { display: flex; justify-content: center; }
.tsm-contact__wrap { width: 100%; max-width: 560px; }
.tsm-contact__head { text-align: center; margin-bottom: 36px; }
.tsm-contact__head h2 { font-size: 38px; margin: 0 0 14px; }
.tsm-contact__head p {
	font: 400 15px/1.6 var(--tsm-sans);
	color: var(--tsm-ink-2);
	margin: 0;
}
.tsm-contact__card {
	background: #fff;
	border-radius: var(--tsm-r-lg);
	padding: 40px;
	box-shadow: 0 10px 32px rgba(33,29,24,.06);
}
.tsm-progress { display: flex; gap: 6px; margin: 0 0 28px; }
.tsm-progress__seg {
	flex: 1; height: 4px;
	border-radius: var(--tsm-r-pill);
	background: var(--tsm-border-2);
}
.tsm-progress__seg.is-active { background: var(--tsm-accent); }
.tsm-contact__step-title {
	font: 600 18px/1.3 var(--tsm-sans);
	margin: 0 0 20px;
	color: var(--tsm-ink);
}
.tsm-ranges { display: flex; flex-direction: column; gap: 12px; }
.tsm-range-btn {
	text-align: left;
	padding: 18px 22px;
	border: 1.5px solid var(--tsm-border);
	background: #fff;
	border-radius: var(--tsm-r-sm);
	font: 500 15px/1 var(--tsm-sans);
	color: var(--tsm-ink);
	cursor: pointer;
	transition: border-color 180ms var(--ease-out-strong), background 180ms var(--ease-out-strong), transform 180ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-range-btn:hover { border-color: var(--tsm-accent); background: var(--tsm-ivory); transform: translateX(4px); }
}
.tsm-range-btn:active { transform: translateX(2px) scale(.995); transition-duration: 100ms; }
.tsm-range-btn:focus-visible { outline: 2px solid var(--tsm-accent); outline-offset: 2px; }
.tsm-back {
	background: transparent;
	border: none; padding: 0;
	font: 500 13px/1 var(--tsm-sans);
	color: var(--tsm-ink-2);
	cursor: pointer;
	margin: 0 0 20px;
	display: inline-flex; align-items: center; gap: 6px;
}
.tsm-form { display: flex; flex-direction: column; gap: 14px; }
.tsm-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tsm-form input, .tsm-form textarea {
	width: 100%;
	border: 1.5px solid var(--tsm-border);
	border-radius: var(--tsm-r-sm);
	background: #fff;
	min-height: 44px;
	padding: 12px 16px;
	font: 400 15px/1.4 var(--tsm-sans);
	color: var(--tsm-ink);
	outline: none;
	transition: border-color 180ms var(--ease-out-strong), box-shadow 180ms var(--ease-out-strong), background 180ms var(--ease-out-strong);
}
.tsm-form input:focus, .tsm-form textarea:focus {
	border-color: var(--tsm-accent);
	box-shadow: 0 0 0 4px rgba(var(--tsm-accent-rgb),.12);
	background: #FFFDF9;
}
.tsm-form__label {
	font: 600 13px/1 var(--tsm-sans);
	color: var(--tsm-ink);
	margin: 8px 0 4px;
	display: block;
}
.tsm-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.tsm-chip {
	padding: 10px 18px;
	border: 1.5px solid var(--tsm-border);
	border-radius: var(--tsm-r-pill);
	background: #fff;
	color: var(--tsm-ink);
	font: 500 13px/1 var(--tsm-sans);
	cursor: pointer;
	transition: background 180ms var(--ease-out-strong), color 180ms var(--ease-out-strong), border-color 180ms var(--ease-out-strong), transform 120ms var(--ease-out-strong);
	min-height: 40px;
}
.tsm-chip:active { transform: scale(.96); }
.tsm-chip:focus-visible { outline: 2px solid var(--tsm-accent); outline-offset: 2px; }
.tsm-chip.is-active,
.tsm-chip[aria-pressed="true"] {
	background: var(--tsm-accent);
	color: #fff;
	border-color: var(--tsm-accent);
}
.tsm-thanks { text-align: center; padding: 20px 0; }
.tsm-thanks h3 { font: 500 28px/1.2 var(--tsm-serif); margin: 0 0 12px; }
.tsm-thanks p { font: 400 15px/1.6 var(--tsm-sans); color: var(--tsm-ink-2); margin: 0; }

/* ---------- FOOTER ----------
 * Background full-bleed 100vw (misma regla que .tsm-section).
 * Contenido acotado a --tsm-content-max via .tsm-footer__inner.
 */
.tsm-footer {
	background: var(--tsm-navy);
	color: #fff;
	width: 100%;
	margin: 0;
	padding-block: 72px 32px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	box-sizing: border-box;
	border-radius: 0;
}
.tsm-footer__inner {
	max-width: var(--tsm-content-max);
	margin: 0 auto;
}
.tsm-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr;
	gap: 48px;
	margin-bottom: 48px;
}
.tsm-footer__brand {
	line-height: 0;
	margin: 0 0 16px;
	color: #fff;
}
.tsm-footer__brand svg {
	display: block;
	width: 148px;
	height: auto;
	color: inherit;
}
.tsm-footer__tag {
	font: 400 14px/1.5 var(--tsm-sans);
	color: rgba(255,255,255,.6);
}
.tsm-footer__col-title {
	font: 600 13px/1 var(--tsm-sans);
	letter-spacing: .06em;
	color: rgba(255,255,255,.5);
	margin: 0 0 18px;
	text-transform: uppercase;
}
.tsm-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tsm-footer__list a {
	font: 400 14px/1 var(--tsm-sans);
	color: rgba(255,255,255,.85);
	text-decoration: none;
	position: relative;
	padding-block: 2px;
	transition: color 200ms var(--ease-out-strong);
}
.tsm-footer__list a::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -2px;
	height: 1px;
	background: currentColor;
	clip-path: inset(0 100% 0 0);
	transition: clip-path 260ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-footer__list a:hover { color: #fff; }
	.tsm-footer__list a:hover::after { clip-path: inset(0 0 0 0); }
}
.tsm-footer__list a:focus-visible { color: #fff; outline: none; }
.tsm-footer__list a:focus-visible::after { clip-path: inset(0 0 0 0); }
.tsm-footer__bottom {
	border-top: 1px solid rgba(255,255,255,.15);
	padding-top: 24px;
	font: 400 12px/1 var(--tsm-sans);
	color: rgba(255,255,255,.45);
}

/* ---------- WHATSAPP FLOAT ---------- */
.tsm-wa {
	position: fixed; right: 28px; bottom: 28px; z-index: 30;
	width: 60px; height: 60px;
	border-radius: var(--tsm-r-pill);
	background: var(--tsm-wa);
	display: flex; align-items: center; justify-content: center;
	box-shadow: var(--tsm-shadow-wa);
	text-decoration: none;
	transition: transform .2s var(--tsm-ease);
}
.tsm-wa:hover { transform: scale(1.06); }
.tsm-wa svg { width: 30px; height: 30px; fill: #fff; }

/* ---------- REVEAL ----------
 * translateY 20px + opacity con --ease-out-strong 700ms.
 * `will-change` solo mientras está oculto (JS limpia después de transitionend).
 */
.tsm-reveal {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 700ms var(--ease-out-strong), transform 700ms var(--ease-out-strong);
}
.tsm-reveal.is-hidden {
	opacity: 0;
	transform: translateY(20px);
	will-change: opacity, transform;
}
@media (prefers-reduced-motion: reduce) {
	.tsm-reveal, .tsm-reveal.is-hidden { opacity: 1 !important; transform: none !important; transition: none !important; will-change: auto !important; }
	.tsm-card, .tsm-card:hover, .tsm-card__media img, .tsm-wa:hover, .tsm-svc:hover .tsm-svc__icon svg, .tsm-process__card:hover { transform: none !important; }
}

/* ---------- PROPERTY DETAIL (subpáginas) ---------- */
.tsm-prop-hero-wrap { width: 100%; position: relative; }
.tsm-prop-hero {
	position: relative;
	height: 70svh;
	min-height: 480px;
	max-height: 720px;
	overflow: hidden;
	width: 100%;
	margin: 0;
	border-radius: 0;
	background: #14100A;
}
.tsm-prop-hero__img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	animation: tsm-kenburns 22s ease-out both;
}
@keyframes tsm-kenburns {
	from { transform: scale(1.08); }
	to   { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
	.tsm-prop-hero__img { animation: none; }
}
.tsm-prop-hero__overlay {
	position: absolute; inset: 0;
	background:
		radial-gradient(ellipse 90% 55% at 22% 85%, rgba(20,16,10,.70), transparent 65%),
		linear-gradient(180deg, rgba(20,16,10,.05) 0%, rgba(20,16,10,.25) 45%, rgba(20,16,10,.60) 78%, rgba(20,16,10,.88) 100%);
}
body.tsm-page .tsm-prop-hero__title { color: #fff; }
body.tsm-page .tsm-prop-hero__meta  { color: rgba(255,255,255,.88); }
.tsm-prop-hero__kicker,
.tsm-prop-hero__title,
.tsm-prop-hero__meta {
	text-shadow: 0 2px 24px rgba(0,0,0,.35);
}
.tsm-prop-hero__inner {
	position: absolute;
	left: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	right: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	bottom: 72px;
	max-width: 760px;
}
.tsm-prop-hero__kicker { font: 700 12px/1 var(--tsm-sans); letter-spacing: .16em; color: var(--tsm-accent-lt); text-transform: uppercase; margin: 0 0 16px; }
.tsm-prop-hero__title { font: 500 56px/1.08 var(--tsm-serif); color: #fff; margin: 0 0 16px; }
.tsm-prop-hero__meta { font: 400 15px/1.6 var(--tsm-sans); color: rgba(255,255,255,.88); margin: 0 0 20px; }
.tsm-prop-hero__badge {
	display: inline-block;
	position: static;
	background: var(--tsm-accent);
}
.tsm-prop-hero__badge.tsm-card__badge--open { background: var(--tsm-olive); }

/* ---------- PROPERTY FORM SECTION ---------- */
.tsm-prop-form-section {
	padding-block: 100px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	background: var(--tsm-ivory-2);
}
.tsm-prop-form-section__inner {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 64px;
	align-items: start;
	max-width: var(--tsm-content-max);
	margin: 0 auto;
}
.tsm-prop-form-section__head { padding-top: 12px; }
.tsm-prop-form-section__head .tsm-kicker { margin-bottom: 14px; display: block; }
.tsm-prop-form-section__head h2 { font: 500 40px/1.1 var(--tsm-serif); color: var(--tsm-ink); margin: 0 0 18px; }
.tsm-prop-form-section__head p { font: 400 16px/1.6 var(--tsm-sans); color: var(--tsm-ink-2); margin: 0; max-width: 440px; }
.tsm-prop-form-section__card {
	background: #fff;
	border-radius: var(--tsm-r-lg);
	padding: 40px;
	box-shadow: 0 10px 32px rgba(33,29,24,.06);
}
.tsm-prop-form-section__card textarea {
	resize: vertical;
	min-height: 96px;
	font-family: var(--tsm-sans);
}
@media (max-width: 900px) {
	.tsm-prop-form-section { padding-block: 72px; }
	.tsm-prop-form-section__inner { grid-template-columns: 1fr; gap: 40px; }
	.tsm-prop-form-section__head h2 { font-size: 30px; }
	.tsm-prop-form-section__card { padding: 28px; }
}

.tsm-prop-body {
	padding-block: 100px;
	padding-inline: max(var(--tsm-gutter), calc(50vw - var(--tsm-content-max) / 2));
	background: var(--tsm-ivory);
}
.tsm-prop-body__inner { max-width: var(--tsm-content-max); margin: 0 auto; }
.tsm-prop-body__intro { max-width: 760px; margin: 0 0 48px; }
.tsm-prop-body__short { font: 400 20px/1.6 var(--tsm-sans); color: var(--tsm-ink); margin: 0 0 20px; }
.tsm-prop-body__long { font: 400 16px/1.7 var(--tsm-sans); color: var(--tsm-ink-2); margin: 0; }

.tsm-prop-facts {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px;
	margin: 0 0 56px;
}
.tsm-prop-fact {
	background: #fff; border: 1px solid var(--tsm-border);
	border-radius: var(--tsm-r-md); padding: 24px;
	transition: transform 260ms var(--ease-drawer), box-shadow 320ms var(--ease-out-strong);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-prop-fact:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(var(--tsm-ink-rgb),.06); }
}
.tsm-prop-fact__label { font: 500 12px/1 var(--tsm-sans); letter-spacing: .12em; color: var(--tsm-ink-2); text-transform: uppercase; margin: 0 0 10px; }
.tsm-prop-fact__value { font: 500 22px/1.2 var(--tsm-serif); color: var(--tsm-ink); margin: 0; }

.tsm-prop-gallery {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
	margin: 0 0 56px;
}
.tsm-prop-gallery__item {
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--tsm-r-md);
	background: var(--tsm-ivory-2);
}
.tsm-prop-gallery__item img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 500ms var(--ease-drawer);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-prop-gallery__item:hover img { transform: scale(1.04); }
}
.tsm-prop-cta { text-align: center; padding: 20px 0 0; }

/* ---------- BREADCRUMBS ---------- */
.tsm-breadcrumbs {
	font: 400 13px/1 var(--tsm-sans);
	color: rgba(255,255,255,.72);
	margin: 0 0 24px;
	display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
}
.tsm-breadcrumbs a {
	color: rgba(255,255,255,.9);
	text-decoration: none;
	transition: color 200ms var(--ease-out-strong);
}
.tsm-breadcrumbs a:hover { color: var(--tsm-accent-lt); }
.tsm-breadcrumbs span[aria-hidden] { opacity: .5; }
.tsm-breadcrumbs [aria-current] { color: rgba(255,255,255,.5); }

/* ---------- STAGGER REVEAL ----------
 * Grupos con delay computado por --tsm-i. Se activa via IntersectionObserver
 * en JS agregando .is-visible al padre.
 */
.tsm-stagger-item {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 600ms var(--ease-out-strong), transform 600ms var(--ease-out-strong);
	transition-delay: calc(var(--tsm-i, 0) * 50ms);
}
.tsm-stagger-group.is-visible .tsm-stagger-item {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.tsm-stagger-item { opacity: 1 !important; transform: none !important; transition: none !important; }
}

.tsm-prop-gallery__btn {
	display: block; width: 100%; height: 100%;
	padding: 0; border: none; background: transparent; cursor: zoom-in;
	overflow: hidden; border-radius: inherit;
}
.tsm-prop-gallery__btn img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 500ms var(--ease-drawer);
}
@media (hover: hover) and (pointer: fine) {
	.tsm-prop-gallery__btn:hover img { transform: scale(1.04); }
}
.tsm-prop-gallery__item { padding: 0; }

/* ---------- LIGHTBOX ---------- */
.tsm-lightbox {
	position: fixed; inset: 0;
	background: rgba(20, 16, 10, .92);
	display: none;
	align-items: center; justify-content: center;
	z-index: 100;
	padding: 32px;
	opacity: 0;
	transition: opacity 220ms var(--ease-out-strong);
}
.tsm-lightbox.is-open { display: flex; opacity: 1; }
.tsm-lightbox__figure {
	position: relative;
	max-width: min(1200px, 92vw);
	max-height: 90vh;
	margin: 0;
}
.tsm-lightbox__img {
	display: block;
	max-width: 100%;
	max-height: 90vh;
	border-radius: var(--tsm-r-md);
	transform: scale(.96);
	transition: transform 220ms var(--ease-out-strong);
	box-shadow: 0 24px 64px rgba(0,0,0,.4);
}
.tsm-lightbox.is-open .tsm-lightbox__img { transform: scale(1); }
.tsm-lightbox__close,
.tsm-lightbox__nav {
	position: absolute;
	width: 48px; height: 48px;
	border: none; cursor: pointer;
	border-radius: var(--tsm-r-pill);
	background: rgba(255,255,255,.14);
	color: #fff;
	font-size: 20px;
	display: flex; align-items: center; justify-content: center;
	transition: background 180ms var(--ease-out-strong), transform 120ms var(--ease-out-strong);
}
.tsm-lightbox__close { top: -60px; right: 0; }
.tsm-lightbox__nav { top: 50%; transform: translateY(-50%); }
.tsm-lightbox__nav--prev { left: -68px; }
.tsm-lightbox__nav--next { right: -68px; }
@media (hover: hover) and (pointer: fine) {
	.tsm-lightbox__close:hover,
	.tsm-lightbox__nav:hover { background: rgba(255,255,255,.24); }
}
.tsm-lightbox__close:active,
.tsm-lightbox__nav:active { transform: scale(.94); }
.tsm-lightbox__caption {
	position: absolute;
	left: 0; right: 0; bottom: -40px;
	text-align: center;
	color: rgba(255,255,255,.65);
	font: 400 13px/1 var(--tsm-sans);
}
@media (max-width: 900px) {
	.tsm-lightbox__nav--prev { left: 8px; background: rgba(0,0,0,.5); }
	.tsm-lightbox__nav--next { right: 8px; background: rgba(0,0,0,.5); }
	.tsm-lightbox__close { top: 16px; right: 16px; background: rgba(0,0,0,.5); }
	.tsm-lightbox__caption { bottom: -32px; }
}
body.tsm-lightbox-open { overflow: hidden; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px) {
	:root {
		--tsm-nav-h: 60px;
		--tsm-gutter: var(--tsm-gutter-sm);
	}
}

/* Devices muy angostos (≤ 360px — iPhone SE, Android compact). */
@media (max-width: 360px) {
	.tsm-nav { padding: 8px 12px; }
	.tsm-nav__brand svg { width: 96px; }
	.tsm-nav__right { gap: 8px; }
	.tsm-lang__btn { padding: 5px 8px; font-size: 11px; }
}

@media (max-width: 900px) {
	.tsm-section { padding-block: 64px; }
	.tsm-hero__inner { bottom: 40px; }
	.tsm-hero { min-height: 520px; }
	.tsm-hero__title { font-size: 40px; }
	.tsm-hero__sub { font-size: 16px; }
	.tsm-nav {
		top: max(16px, env(safe-area-inset-top, 0px) + 8px);
		padding: 10px 14px 10px 18px;
	}
	.tsm-nav--sticky {
		top: max(8px, env(safe-area-inset-top, 0px) + 4px);
		padding: 8px 14px 8px 16px;
	}
	.tsm-nav__links, .tsm-nav__right .tsm-btn { display: none; }
	.tsm-nav__toggle { display: inline-flex; }
	.tsm-nav__right { gap: 12px; }
	.tsm-lang__btn { padding: 6px 10px; }
	.tsm-nav.is-open .tsm-nav__links {
		display: flex; flex-direction: column;
		position: absolute; top: calc(100% + 8px); left: 0; right: 0;
		background: rgba(20,16,10,.9);
		border-radius: var(--tsm-r-md);
		padding: 20px 20px max(20px, env(safe-area-inset-bottom, 0px));
		backdrop-filter: blur(8px);
		gap: 16px;
		max-height: calc(100vh - var(--tsm-nav-h) - 32px);
		overflow-y: auto;
	}
	.tsm-nav--sticky.is-open .tsm-nav__links { background: rgba(255,255,255,.98); }
	.tsm-nav--sticky.is-open .tsm-nav__links a { color: var(--tsm-ink); }
	.tsm-section-head h2, .tsm-contact__head h2, .tsm-why__body h2 { font-size: 30px; }
	.tsm-services__grid { grid-template-columns: repeat(2, 1fr); }
	.tsm-why { grid-template-columns: 1fr; }
	.tsm-why__quote { padding: 32px; }
	.tsm-why__quote-text { font-size: 20px; }
	.tsm-footer { padding-block: 48px 24px; }
	.tsm-footer__brand svg { width: 128px; }
	.tsm-nav__brand svg { width: 110px; }
	.tsm-footer__grid { grid-template-columns: 1fr; gap: 32px; }
	/* Carrusel mobile: misma mecánica JS del desktop, cards más chicas, sin flechas ni mask */
	.tsm-portfolio__viewport { -webkit-mask-image: none; mask-image: none; }
	.tsm-portfolio__row .tsm-card { flex: 0 0 78vw; max-width: 320px; }
	.tsm-portfolio__arrows { display: none; }
	.tsm-contact__card { padding: 28px; }
	.tsm-form__row { grid-template-columns: 1fr; }
	.tsm-wa { right: 16px; bottom: 16px; }
	.tsm-prop-hero { min-height: 400px; }
	.tsm-prop-hero__inner { bottom: 40px; }
	.tsm-prop-hero__title { font-size: 36px; }
	.tsm-prop-body { padding-block: 56px; }
	.tsm-prop-body__short { font-size: 17px; }
	.tsm-prop-gallery { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}