/* ============================================================
   MODERN — SISTEMA DE DISEÑO REDISEÑO COMPLETO
   Estilo: moderno, híbrido claro/oscuro por bloques, tipografía
   display bold espaciada (upperacse), acentos á-ye-verde.
   Referencia estética: codeland.com.ar (moderno, bold, dark+light).
   Esta capa se carga DESPUÉS de style.css y lux/, y la NEUTRALIZA.
   ============================================================ */

:root {
	/* Base clara (secciones de producto) */
	--md-fondo:      #f5f1ea;
	--md-fondo-2:    #efe9de;
	--md-superficie: #fbf9f4;
	--md-superficie-2: #ffffff;
	--md-tinta:      #16110c;
	--md-texto:      #33291f;
	--md-texto-soft: #7a6c5b;
	--md-linea:      #e2d9c8;
	--md-hierro:     #1a1510;

	/* Bloques oscuros (hero, banner, footer, breadcrumb) */
	--md-oscuro:     #0f0f0d;
	--md-oscuro-2:   #171714;
	--md-oscuro-3:   #22221e;
	--md-blanco:     #ffffff;
	--md-blanco-suave: rgba(255, 255, 255, 0.86);
	--md-blanco-dim:  rgba(255, 255, 255, 0.58);

	/* Acentos */
	--md-oro:        #c9a55a;
	--md-oro-strong: #d9b879;
	--md-oro-oscuro: #9e7f46;
	--md-burdeos:    #6e1423;
	--md-burdeos-2:  #8a1a2d;
	--md-verde:      #1f3d2b;

	/* Tipografía */
	--md-font-sans:  'Poppins', sans-serif;
	--md-font-serif: 'Cormorant Garamond', serif;
	--md-font-mono:  'Space Mono', monospace;

	/* Radios / sombras / espacios */
	--md-r:          2px;
	--md-r-lg:       8px;
	--md-sombra:     0 20px 44px rgba(22, 17, 12, 0.16);
	--md-sombra-soft: 0 10px 26px rgba(22, 17, 12, 0.08);
	--md-seccion-x:  96px;
	--md-seccion-y:  96px;
	--md-contenedor: 1280px;
}

/* Dark mode global (mantener coherencia) */
body.dark {
	--md-fondo:      #101010;
	--md-fondo-2:    #151515;
	--md-superficie: #1c1c18;
	--md-superficie-2: #22221d;
	--md-tinta:      #f0e9dc;
	--md-texto:      #cdc3b3;
	--md-texto-soft: #948878;
	--md-linea:      #2c2c26;
	--md-hierro:     #ffffff;
	--md-oscuro:     #0a0a09;
	--md-oscuro-2:   #131310;
	--md-oscuro-3:   #1c1c18;
	--md-blanco:     #101010;
	--md-blanco-suave: rgba(240, 233, 220, 0.88);
	--md-blanco-dim:  rgba(240, 233, 220, 0.6);
	--md-oro:        #d9b879;
	--md-oro-strong: #e6c98f;
	--md-oro-oscuro: #c9a55a;
}

/* ============================================================
   NEUTRALIZAR estética Ogani/Lux
   (mantenemos layout estructural, restauramos espacio/fondos)
   ============================================================ */
body {
	font-family: var(--md-font-sans);
	background: var(--md-fondo);
	color: var(--md-texto);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--md-font-sans);
	font-weight: 700;
	color: var(--md-tinta);
	letter-spacing: -0.01em;
	line-height: 1.12;
	text-transform: none;
}

a {
	color: var(--md-oro-oscuro);
	transition: color 0.2s ease;
}
a:hover {
	color: var(--md-burdeos);
}

img { max-width: 100%; }

/* Contenedor: compatibilidad con .container de Bootstrap, ancho propio */
.container, .md-container {
	width: 100%;
	max-width: var(--md-contenedor);
	margin: 0 auto;
	padding-left: 24px;
	padding-right: 24px;
}

/* ============================================================
   UTILIDADES MODERN MOD
   ============================================================ */
.md-eyebrow {
	display: inline-block;
	font-family: var(--md-font-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--md-oro-oscuro);
}
.md-title-xl {
	font-family: var(--md-font-sans);
	font-weight: 700;
	font-size: clamp(2.4rem, 5vw, 4.2rem);
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--md-tinta);
}
.md-sub {
	font-size: 1.05rem;
	color: var(--md-texto-soft);
	max-width: 46ch;
}

/* Secciones numeradas tipo "01 / 02 / 03" */
.md-section-head {
	display: flex;
	align-items: baseline;
	gap: 18px;
	margin-bottom: 44px;
	border-bottom: 1px solid var(--md-linea);
	padding-bottom: 20px;
}
.md-section-num {
	font-family: var(--md-font-mono);
	font-size: 14px;
	font-weight: 700;
	color: var(--md-oro-oscuro);
	letter-spacing: 0.2em;
}
.md-section-title {
	font-size: clamp(1.8rem, 3.4vw, 2.9rem);
	font-weight: 700;
	margin: 0;
}

/* Botones modern */
.md-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--md-font-mono);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 15px 30px;
	border: 1px solid transparent;
	border-radius: var(--md-r);
	white-space: nowrap;
	transition: all 0.22s ease;
	cursor: pointer;
}
.md-btn--dark {
	background: var(--md-oscuro);
	color: var(--md-blanco);
	border-color: var(--md-oscuro);
}
.md-btn--dark:hover { background: var(--md-burdeos); border-color: var(--md-burdeos); color: var(--md-blanco); }
.md-btn--gold {
	background: var(--md-oro);
	color: var(--md-oscuro);
	border-color: var(--md-oro);
}
.md-btn--gold:hover { background: var(--md-oro-strong); border-color: var(--md-oro-strong); }
.md-btn--outline {
	background: transparent;
	color: var(--md-texto);
	border-color: var(--md-linea);
}
.md-btn--outline:hover { border-color: var(--md-oro); color: var(--md-oro-oscuro); }
.md-btn--burdeos {
	background: var(--md-burdeos);
	color: var(--md-blanco);
	border-color: var(--md-burdeos);
}
.md-btn--burdeos:hover { background: var(--md-burdeos-2); }

/* Espacios de sección */
.md-section { padding-top: var(--md-seccion-y); padding-bottom: var(--md-seccion-y); }
.md-section--tight { padding-top: 64px; padding-bottom: 64px; }

/* === Bloques híbridos === */
/* Bloque claro por defecto */
.md-block--light { background: var(--md-fondo); color: var(--md-texto); }
/* Bloque oscuro */
.md-block--dark { background: var(--md-oscuro); color: var(--md-blanco-suave); }
.md-block--dark .md-section-title { color: var(--md-blanco); }
.md-block--dark .md-sub { color: var(--md-blanco-dim); }
.md-block--dark .md-eyebrow { color: var(--md-oro-strong); }
.md-block--dark .md-section-head { border-bottom-color: rgba(255,255,255,0.14); }

/* === Grids === */
.md-grid { display: grid; gap: 24px; }
.md-grid--auto { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }

/* === Enmascarar legado importante === */
/* Eliminamos marcos dobles / ornament hero heredados del maximalista sin tocar JS */
.hero__corner { display: none; }
.lux-monograma { display: none; }
.footer__monograma { display: none; }

::selection { background: var(--md-oro); color: var(--md-oscuro); }