/*
Theme Name: METACRE (Astra hijo)
Template: astra
Description: Tema hijo de Astra para metacre.info: paleta «Luz de mañana» (D-031) y pestañas por producto (estructura_paginas).
Version: 0.1.2
Text Domain: metacre
License: GPL-2.0-or-later
*/

@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter Tight"; font-weight: 800; font-style: normal; font-display: swap; src: url("fonts/inter-tight-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Instrument Serif"; font-weight: 400; font-style: italic; font-display: swap; src: url("fonts/instrument-serif-latin-400-italic.woff2") format("woff2"); }

:root {
  --color-bg: #F6F3EE;
  --color-surface: #FFFFFF;
  --color-ink: #15171A;
  --color-muted: #5B6068;
  --color-line: rgba(21, 23, 26, 0.12);
  --color-cta: #FFD400;
  --color-signal: #C8243C;
  --c29-fill: #1FB5C9;  --c29-ink: #0B6E7B;
  --c26-fill: #7BC67E;  --c26-ink: #2E6E2F;
  --c27-fill: #FFB000;  --c27-ink: #7A5500;
  --c24-fill: #5AA9E6;  --c24-ink: #1D5E8C;
  --c13-fill: #E0A458;  --c13-ink: #8A5A16;
  --tab-fill: var(--c29-fill);
  --tab-ink: var(--c29-ink);
  --font-display: "Inter Tight", system-ui, sans-serif;
  --font-text: "Inter", system-ui, sans-serif;
  --font-accent: "Instrument Serif", Georgia, serif;
  --ease-cine: cubic-bezier(0.22, 1, 0.36, 1);
}

body, .ast-separate-container, .ast-plain-container { background: var(--color-bg); color: var(--color-ink); font-family: var(--font-text); }
h1, h2, h3, .entry-title, .site-title { font-family: var(--font-display); font-weight: 800; color: var(--color-ink); letter-spacing: -0.01em; text-transform: none; }
html, body { overflow-x: clip; }
/* Botón de la plantilla de demostración de Astra: la navegación son las pestañas */
.ast-header-button-1, .ast-builder-button-wrap,
#masthead .menu-toggle, #masthead .main-header-menu, #masthead .main-navigation, #ast-mobile-header .ast-mobile-header-content { display: none !important; }
a { color: var(--tab-ink); }
.button, button.button, .wp-block-button__link, .single_add_to_cart_button, .wc-block-components-button {
  background: var(--color-cta) !important; color: var(--color-ink) !important; border: 0; border-radius: 999px; font-weight: 600;
}

/* Pestañas: una por producto; en móvil, barra fija deslizable */
.mc-tabs { display: flex; gap: .25rem; overflow-x: auto; padding: .5rem 1rem; background: var(--color-surface); border-bottom: 1px solid var(--color-line); position: sticky; top: 0; z-index: 50; scrollbar-width: none; }
.mc-tabs a { flex: 0 0 auto; padding: .5rem .9rem; border-radius: 999px; text-decoration: none; color: var(--color-ink); font-weight: 600; font-size: .95rem; border-bottom: 3px solid transparent; }
.mc-tabs a[aria-current="page"] { border-bottom-color: var(--tab-fill); color: var(--tab-ink); }
.mc-tabs a .mc-soon { color: var(--color-muted); font-weight: 400; }

/* Pestaña activa (base estática; escenas GSAP en F3) */
.mc-hero { min-height: 100svh; display: grid; align-items: center; gap: 2rem; padding: 2rem 1rem 6rem; max-width: 1100px; margin: 0 auto; }
@media (min-width: 900px) { .mc-hero { grid-template-columns: 1.1fr 1fr; padding-bottom: 2rem; } }
.mc-hero > * { min-width: 0; }
.mc-hero img { width: 100%; max-width: 100%; height: auto; border-radius: 1.25rem; background: var(--color-surface); }
.mc-hero h1 { font-size: clamp(2.2rem, 6vw, 4rem); line-height: 1.02; margin: 0 0 .75rem; text-transform: none; overflow-wrap: anywhere; }
.mc-hero .mc-accent { font-family: var(--font-accent); font-style: italic; font-weight: 400; color: var(--tab-ink); }
.mc-lead { font-size: 1.15rem; color: var(--color-muted); margin: 0 0 1.25rem; }
.mc-price { font-family: var(--font-display); font-size: 2rem; font-weight: 800; }
.mc-price small { font-family: var(--font-text); font-size: .9rem; font-weight: 400; color: var(--color-muted); }
.mc-facts { list-style: none; margin: 1rem 0 1.5rem; padding: 0; color: var(--color-muted); }
.mc-facts li::before { content: "— "; color: var(--tab-ink); }
.mc-cta { display: inline-block; padding: .95rem 1.6rem; border-radius: 999px; background: var(--color-cta); color: var(--color-ink); font-weight: 600; text-decoration: none; }
.mc-section { max-width: 1100px; margin: 0 auto; padding: 3rem 1rem; }
.mc-section h2 { font-size: clamp(1.6rem, 4vw, 2.4rem); }
.mc-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.mc-card { background: var(--color-surface); border: 1px solid var(--color-line); border-radius: 1rem; padding: 1.25rem; text-decoration: none; color: var(--color-ink); }
.mc-buybar { position: fixed; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem 1rem; background: var(--color-surface); border-top: 1px solid var(--color-line); z-index: 60; }
@media (min-width: 900px) { .mc-buybar { display: none; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }