/* =============================================================================
   DOTCRAFT BASE — BASE STYLES
   Reset, tipografía global y elementos HTML base.
   ============================================================================= */

/* Reset */
*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-size: 16px;
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	font-family:      var(--dc-font-base);
	font-size:        var(--dc-font-size-base);
	font-weight:      var(--dc-font-weight-regular);
	line-height:      var(--dc-line-height-base);
	color:            var(--dc-color-text);
	background-color: var(--dc-color-bg);
	-webkit-font-smoothing:  antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Tipografía */
h1, h2, h3, h4, h5, h6 {
	font-family:   var(--dc-font-base);
	font-weight:   var(--dc-font-weight-bold);
	line-height:   var(--dc-line-height-tight);
	letter-spacing:var(--dc-letter-spacing-tight);
	color:         var(--dc-color-text);
}

h1 { font-size: clamp(var(--dc-font-size-3xl), 5vw, var(--dc-font-size-5xl)); }
h2 { font-size: clamp(var(--dc-font-size-2xl), 4vw, var(--dc-font-size-4xl)); }
h3 { font-size: clamp(var(--dc-font-size-xl),  3vw, var(--dc-font-size-3xl)); }
h4 { font-size: clamp(var(--dc-font-size-lg),  2vw, var(--dc-font-size-2xl)); }
h5 { font-size: var(--dc-font-size-xl); }
h6 { font-size: var(--dc-font-size-lg); }

p {
	line-height: var(--dc-line-height-base);
}

/* Limitar ancho de lectura solo en contextos de contenido editorial,
   nunca globalmente — evita romper cards, columnas y plugins. */
.dc-prose p,
.dc-hero__subtitle,
.entry-content p {
	max-width: var(--dc-max-width-text);
}

a {
	color:           var(--dc-color-accent);
	text-decoration: none;
	transition:      color var(--dc-duration-fast) var(--dc-ease);
}

a:hover { color: var(--dc-color-accent-hover); }

a:focus-visible {
	outline:        2px solid var(--dc-color-accent);
	outline-offset: 3px;
	border-radius:  var(--dc-radius-sm);
}

img, video {
	max-width: 100%;
	height:    auto;
	display:   block;
}

ul, ol { list-style: none; }

button {
	font-family: var(--dc-font-base);
	cursor:      pointer;
	border:      none;
	background:  none;
}

input, textarea, select {
	font-family: var(--dc-font-base);
	font-size:   var(--dc-font-size-base);
}

/* Layout base */
.dc-container {
	width:     100%;
	max-width: var(--dc-max-width);
	margin:    0 auto;
	padding:   0 var(--dc-gutter);
}

.dc-container--wide {
	max-width: var(--dc-max-width-wide);
}

.dc-section {
	padding: var(--dc-space-20) 0;
}

.dc-section--sm  { padding: var(--dc-space-12) 0; }
.dc-section--lg  { padding: var(--dc-space-32) 0; }

/* Accesibilidad */
.sr-only {
	position: absolute;
	width:    1px;
	height:   1px;
	padding:  0;
	margin:   -1px;
	overflow: hidden;
	clip:     rect(0, 0, 0, 0);
	border:   0;
}

/* Small mobile — headings (≤ 480px) */
@media (max-width: 480px) {
	h1 { font-size: clamp(1.75rem, 8vw, 2.5rem); }
	h2 { font-size: clamp(1.375rem, 6vw, 2rem);  }
	h3 { font-size: clamp(1.125rem, 5vw, 1.5rem); }
	h4 { font-size: clamp(1rem,     4vw, 1.25rem); }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration:   0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration:  0.01ms !important;
	}
	html { scroll-behavior: auto; }
}