/* ===========================================
   ESTILOS BASE DEL TEMA DIGITALHAMSTER
   =========================================== */

@font-face {
  font-family: 'HK Grotesk';
  src: url('../fonts/HKGrotesk-Regular.ttf');
  src: url('../fonts/HKGrotesk-Regular.eot') format("embedded-opentype"),
    url('../fonts/HKGrotesk-Regular.woff2') format("woff2"),
    url('../fonts/HKGrotesk-Regular.woff') format("woff"),
    url('../fonts/HKGrotesk-Regular.ttf') format("ttf"),
    url('../fonts/HKGrotesk-Regular.otf') format("otf");
  font-weight: 100 400;
  font-display: swap;
}

@font-face {
  font-family: 'HK Grotesk';
  src: url('../fonts/HKGrotesk-Medium.ttf');
  src: url('../fonts/HKGrotesk-Medium.eot') format("embedded-opentype"),
    url('../fonts/HKGrotesk-Medium.woff2') format("woff2"),
    url('../fonts/HKGrotesk-Medium.woff') format("woff"),
    url('../fonts/HKGrotesk-Medium.ttf') format("ttf"),
    url('../fonts/HKGrotesk-Medium.otf') format("otf");
  font-weight: 500 600;
  font-display: swap;
}

@font-face {
  font-family: 'HK Grotesk';
  src: url('../fonts/HKGrotesk-Bold.ttf');
  src: url('../fonts/HKGrotesk-Bold.eot') format("embedded-opentype"),
    url('../fonts/HKGrotesk-Bold.woff2') format("woff2"),
    url('../fonts/HKGrotesk-Bold.woff') format("woff"),
    url('../fonts/HKGrotesk-Bold.ttf') format("ttf"),
    url('../fonts/HKGrotesk-Bold.otf') format("otf");
  font-weight: 700 900;
  font-display: swap;
}

:root {
  /*Primary*/
  /*Fonts*/
  --black: #000000;
  --white: #ffffff;
  /*BG*/
  --strong-cream: #fae8e0;
  --cream: #f9ede7;
  --light-cream: #faf1ed;
  --lightest-cream: #fcf6f3;
  /*Acent*/
  --acento: #e26b40;
  --acento-salmon: #E6B2AD;
  --accento-light: #F3D8D6;
  --correcto: #456f4b;
  --acento-red: #C23B33;
  /*Fonts*/
  --font-grotesk: "HK Grotesk";

  --pink: #F3D8D6;
  --red: #C23B33;
  --salmon-bg: #FAE8E0;
  --bs-link-color: var(--black) !important;
  --bs-link-hover-color: var(--black) !important;
}

/* Reset básico */
* {
  box-sizing: border-box;
}

body {
  font-family: "Archivo", sans-serif;
  line-height: 1.6;
  color: var(--black);
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, button {
  font-family: "DM Mono", sans-serif !important;
}

/* Utilidades básicas */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.btn {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
  font-family: "DM Mono", sans-serif;
}

.btn-primary {
  background: var(--acento-red);
  color: var(--white);
}

.btn-primary:hover {
  background: #a02d26;
  transform: translateY(-2px);
}

/* Responsive básico */
@media (max-width: 768px) {
  .container {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .container {
    padding: 0 10px;
  }
}