/* Base styles.
 * In Tienda Nube the landing ran on top of the Morelia theme CSS (dart-style-critical/colors/async).
 * These are ONLY the Morelia rules that matched elements of the home, with theme variables
 * resolved to their current values, so the page renders identically without Morelia. */

html { box-sizing: border-box; }
*, ::after, ::before { box-sizing: inherit; }

body {
  margin: 0;
  color: #333333;
  fill: #333333;
  font-family: "Inter", sans-serif;
  background-color: #ffffff;
  font-size: 14px;
}

h1, h2, h3, h4, h5 { margin-top: 0; font-family: "Space Grotesk", sans-serif; font-weight: 400; }
h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
p { margin-top: 0; line-height: 1.4286em; }

a { color: #333333; text-decoration: none; transition: 0.4s; }
button { cursor: pointer; }

.btn {
  margin: 0; text-decoration: none; text-align: center; border: 0; cursor: pointer;
  font-size: 12px; line-height: 18px; appearance: none; white-space: normal; background: none; transition: 0.4s;
}
.btn-primary { padding: 11px 15px; background-color: #2D3E46; color: #FFFFFF; fill: #FFFFFF; }
.btn-link {
  color: #333333; fill: #333333; cursor: pointer; text-decoration: underline; font-size: 14px;
  appearance: none; background: none; border: none;
}

footer { padding: 40px 0; color: #FFFFFF; background: #2D3E46; }
footer a { color: #FFFFFF; }

/* Morelia grid helpers used by the cookie banner */
.container-fluid { width: 100%; margin-right: auto; margin-left: auto; padding: 0 30px; }
.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.col-12, .col-md-auto { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; }
.col-12 { flex: 0 0 100%; max-width: 100%; }
.justify-content-center { justify-content: center !important; }
.align-items-center { align-items: center !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
@media (min-width: 768px) {
  .container-fluid { padding: 0 40px; }
  .col-md-auto { flex: 0 0 auto; width: auto; max-width: none; }
  .mb-md-0 { margin-bottom: 0 !important; }
  .pr-md-0 { padding-right: 0 !important; }
}

/* Cookie banner (Tienda Nube notification) */
.notification { padding: 10px; text-align: center; font-size: 12px; }
.notification-fixed-bottom { position: fixed; bottom: 0; left: 0; z-index: 999; width: 100%; font-size: 12px; }
.notification-fixed-bottom .btn-link { font-size: 12px; }
.notification-primary {
  color: #333333; fill: #333333; background-color: #ffffff;
  border-top: 1px solid #33333312; border-bottom: 1px solid #33333312;
}
.notification-primary.notification-fixed-bottom { border-top: 1px solid #33333312; border-bottom: none; }

/* WhatsApp floating button (Tienda Nube store.whatsapp) */
.btn-whatsapp {
  position: fixed; bottom: 15px; right: 15px; z-index: 100;
  color: #fff; background-color: #4dc247; box-shadow: rgba(0, 0, 0, 0.3) 0 0 6px; border-radius: 50%;
}
.btn-whatsapp svg { width: 45px; height: 45px; padding: 10px; fill: #fff; vertical-align: middle; }
